@import url("list.css");

/* CSS Document */

*{
	margin: 0;
	padding: 0;
}

body{
	text-align: center;
	font-size: 82%;
	line-height: 1.4;
	font-family: "MS UI Gothic","ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
	background: url(../img/top/bk-hd.jpg) repeat-x #FFFFFF;
}

body#pgBody{
	background-color: #FFFFFF;
	background-image: url(../img/page/bk-pg.jpg);
	background-repeat: repeat-x;
	background-position: top;
}

body,td,th{
	font-size: 82%;
	voice-family: "\"}\"";
	voice-family: inherit;
	font-size: 100%;

}

a:link{ color:#17536B}
a:visited{ color: #006666;}
a:hover{ color: #009966;	text-decoration: underline;}

#frame{
	width: 860px;
	text-align: left;
	margin: 0 auto;

}

h2.h3,h4,h5{ font-size: 100%;}
img{ vertical-align: top;}


/*------------------------------------------------------------------
			header
-------------------------------------------------------------------*/

#header{
	height: 108px;
}
#header.hd-pg{
	background: url(../img/comm/logo-bk.jpg) no-repeat right; 
}


#logoArea{
	float: left;
	padding-top: 14px;
	width: 360px;
}

#subMenuArea{
	float: right;
	width: 320px;
	text-align: right;
}

#headerPage{
	height: 57px;
}

#headerPage #logoArea{
	float: left;
	padding-top: 12px;
	width: 500px;
}

#headerPage #subMenuArea{
	float: right;
	width: 320px;
	text-align: right;
	padding-top: 28px
}


/*------------------------------------------------------------------
			contents
-------------------------------------------------------------------*/

#contents{
	clear: both;
	padding-top: 18px;
	background: url(../img/top/lin-dot.gif) left bottom repeat-x;
	padding-bottom: 30px;
	margin-bottom: 60px;
}
#contentsPage{
	clear: both;
	padding-top: 18px;
	background: url(../img/top/lin-dot.gif) left bottom repeat-x;
	padding-bottom: 20px;
	margin-bottom: 10px;
}

#topMain{
	width: 632px;
	float: right;
}

#topMain .courseBox{
	float: left;
	width: 128px;
	padding-bottom: 8px;
}
#topMain .courseBoxEnd{
	float: left;
	width: 120px;
	padding-bottom: 8px;
}

#topMain .courseBox img,#topMain .courseBoxEnd img{
	margin-bottom: 5px;
}

.cName{
	font-weight: bold;
	padding-bottom: 2px;
}


.cyj{
	background: url(../img/top/i-yj-bl.gif) no-repeat;
	padding-left: 18px;
}
.cyj2{
	background: url(../img/top/i-yj-org.gif) no-repeat;
	padding-left: 18px;
}
.courseCap{
	background: url(../img/top/cap-meisyo-bk.gif) repeat-x;
	text-align: right;
	margin: 8px 0 8px;
}
.courseCap2{
	background: url(../img/top/cap-jo-bk.gif) repeat-x;
	text-align: right;
	margin: 8px 0 8px;
	height: 32px;
}



#topSide{
	width: 210px;
	margin-right: auto;
	margin-left:0px;
}

#topSide #loginArea{
	background: url(../img/top/bk-login.jpg) no-repeat left 31px;
	width: 201px;
	text-align: center;
	height: 171px;
	font-size: 14px;
	margin-bottom: 8px;
	line-height: 2.1;
}
#topSide #loginArea .txt-wd{
	width: 90px;
	height: 16px;
}

#topSide .rankBox{
	border: 1px solid #67B5E5;
	width: 198px;
	margin-bottom: 8px;
	padding-bottom: 8px;
}

#topSide .rankBox img{
	border-bottom:  1px solid #67B5E5;
}

#topSide .rankBox .flag{
	background: url(../img/top/i-flag.gif) no-repeat left top;
	padding-left: 18px;
	margin-left: 5px;
}
#topSide .rankBox .flag a{
	font-weight: bold;
}

#topSide .rankBox .yj{
	background:  url(../img/top/i-yj-g.gif) no-repeat left 2px;
	padding-left: 18px;
	margin-left: 5px;
	margin-top: 2px;
}

#topSide .rankNum{
	font-weight: bold;
	margin-left: 8px;
}
#topSide .rankName{
	margin-left: 35px;
}


#topSide img{
	margin-bottom: 8px;
}
#sideArea{
	float: left;
	width: 200px;
}

#sideArea img{
	margin-bottom: 10px;
}

#sideArea ul{
	list-style-type: none;
	margin-bottom: 15px;

}

#sideArea li{
	background-color: #DDEDAE;
	padding: 5px;
	margin: 0px;
	margin-bottom: 2px;
}
#sideArea li a{
	border-left: 4px solid #88B826;
	padding-left: 6px;
	font-weight: bold;
	margin-left: 4px;
	color: #000000;
}
#sideArea li.nopd{
	margin: 0px;
	padding: 0px;
	padding-top: 4px;
}

#sideArea li.nopd a{
	padding-left: 6px;
	margin-left: 8px;
}



#sideArea li.nopd ul{
	background-color: #FFFFFF;
	margin-top: 4px;
	padding: 3px 3px 3px 0px;
	margin-bottom: 0px;
}
#sideArea li.nopd li{
	background-color: #FFFFFF;
	padding-left: 0px;
	padding-bottom: 0px;

}

#sideArea li.nopd li a{
	background: url(../img/comm/i-orn.gif) no-repeat left 2px;
	padding-left: 14px;
	border: none;
}

#sideArea li.nopd li ul{
	margin-top:0px;
	padding: 0px;
	margin-bottom: 0px;
}
#sideArea li.nopd li li a{
	background: none;
	font-weight: normal;
	padding-left: 14px;
	border: none;
}




#mainArea{
	margin-left: 220px;
	line-height: 1.6;
}

#mainArea ul,
#mainArea ol{
	padding-left: 30px;
}
#wnewArea{
	float: left;
	width: 340px;
	padding-top: 15px;
}
#wnewArea iframe{
	width: 338px;
	height: 360px;
	border: 1px solid #666666;
	padding:0px;
	margin: 0;
	vertical-align:top;
}

#wnewTtlArea{
	height: 28px;
}
#startArea{
	width: 410px;
	margin-left: auto;
	margin-right: 0px;
	padding-top: 15px;
	float: right;
}

#startAreaWk{
	border: 1px solid #548C41;
}

#startAreaFlt p,
#startAreaFlt h4
{
	padding-left: 5px;
}
#startAreaFlt a:link{
	color:#476316;
}

#startArea img{
	margin-right: 3px;
	margin-bottom: 4px;
}

#startAreaFlt{
	width: 195px;
	float: left;
	margin-left: 2px;
	margin-right: 2px;
	display: inline;
}

#startAreaBn{
	padding-top: 10px;
}

#startAreaBn img{
	margin: 0px 4px 8px 0px;
}
#startAreaBn img{
	margin: 
}




#hourArea{
	border: 1px solid #CCC;
	margin-top: 10px;
}

#linkArea{
	line-height: 1.2;
}

/*-----------------------------------------------------------------
		gnavi
------------------------------------------------------------------*/

#gnavi{
	height: 29px;
}

#gnavi ul{
	list-style-type: none;
}
#gnavi li{
	float: left;
	padding: 4px 0px 0px 0px;
}

#gnavi li.li-right{
	float: right;
}



/*-----------------------------------------------------------------
		pageArea
------------------------------------------------------------------*/

.pnkz{
	padding-bottom: 8px;
}

#welcomeMenu{
	width: 855px;
	margin: 0 auto 10px;
}

#welcomeMenu img.vBt{
	vertical-align: bottom;
}

#welcomeMenu .td-bk{
	background: url(../img/page/tbl-bk.gif) repeat-y;
	padding: 0px 20px 0px;
	text-align: right;
}

#welcomeMenu .flt-left{
	float: left;
	margin-left:0px;
	margin-right: auto;
	width: 720px;
	text-align: left; 
}

#welcomeMenu ul{
	list-style-type: none;
	padding-top: 4px;
}

#welcomeMenu li{
	float: left;
	padding-right: 12px;
}
#welcomeMenu li a{
	background: url(../img/page/i-yj-bl.jpg) no-repeat left 2px;
	padding-left: 16px;
	font-weight: bold;
}


.capKiroku{
	background: url(../img/page/cap-kiroku-bk.gif) repeat-x;
	margin: 15px 0px 10px;
}
.capKore{
	background: url(../img/page/cap-kore-bk.gif) repeat-x;
	margin: 15px 0px 10px;
}

.pgHalf{
	float: left;
	width: 430px;
	padding-bottom: 20px;
}

.pgHalf2{
	width: 427px;
	margin-left: auto;
	margin-right: 0px; 
}

.tbl-nobdr {
	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
}

.tbl-nobdr td {
	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
}

.tbl-nml{
	border-bottom: 1px solid #97BEDF;
	border-left: 1px solid #97BEDF;
	width: 425px;
	margin-bottom: 10px;
}

.tbl-nml td,
.tbl-nml th
{
	padding: 6px;
	border-top: 1px solid #97BEDF;
	border-right: 1px solid #97BEDF;
	vertical-align: top;
}

.tbl-nml th{
	background-color: #E9F0F8;
	text-align: left;
	font-weight: normal;
	width: 35%;
}

.tbl-nml2{
	border-bottom: 1px solid #A2C79B;
	border-left: 1px solid #A2C79B;
	width: 425px;
	margin-bottom: 10px;
}

.tbl-nml2 td,
.tbl-nml2 th
{
	padding: 6px;
	border-top: 1px solid #A2C79B;
	border-right: 1px solid #A2C79B;
	vertical-align: top;
}

.tbl-nml2 th{
	background-color: #E8F0E5;
	text-align: left;
	font-weight: normal;
	width: 45%;
}

.td-bold{
	font-weight: bold;
	line-height: 1.4;
	font-size: 90%;
	voice-family: "\"}\"";
	voice-family: inherit;
	font-size: 120%;

}

.td-red-bld{
	color: #CC0001;
	line-height: 1.4;
	font-weight: bold;
	font-size: 90%;
	voice-family: "\"}\"";
	voice-family: inherit;
	font-size: 120%;
}

.td-red-bld-span{
	color: #CC0001;
	font-weight: bold;
	font-size: 120%;
}




/*快足日記登録情報*/
.pg-one-third {
	width:280px;
	margin-right:10px;
	float:left;
	text-align: center;
}

.pg-two-third {
	width:560px;
	margin-right: 0px;
	margin-left: auto;
}

.tbl-nml-100per{
	border-bottom: 1px solid #97BEDF;
	border-left: 1px solid #97BEDF;
	width: 100%;
	margin-bottom: 10px;
}

.tbl-nml-100per td,
.tbl-nml-100per th
{
	padding: 6px;
	border-top: 1px solid #97BEDF;
	border-right: 1px solid #97BEDF;
	vertical-align: top;
}

.tbl-nml-100per th{
	background-color: #E9F0F8;
	text-align: left;
	font-weight: normal;
	width: 25%;
}

/*快足日記ウォーキング履歴*/
.tbl-nml2-100per{
	border-bottom: 1px solid #A2C79B;
	border-left: 1px solid #A2C79B;
	width: 100%;
	margin-bottom: 10px;
	margin-top: 15px;
}

.tbl-nml2-100per td,
.tbl-nml2-100per th
{
	padding: 3px;
	border-top: 1px solid #A2C79B;
	border-right: 1px solid #A2C79B;
	text-align: center;
}

.tbl-nml2-100per th{
	background-color: #E8F0E5;
	text-align: center;
	font-weight: bold;
}

.tbl-nml2-100per td.tbl-nml2-100per-txtleft{
	padding: 3px;
	border-top: 1px solid #A2C79B;
	border-right: 1px solid #A2C79B;
	text-align: left;

}

.tbl-nml2-100per td.tbl-nml2-100per-nobdr {
	padding: 3px;
	text-align: left;
	border:0px;
}

.tbl-blue {
	width:100%;
	border-top-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #006699;
	border-bottom-color: #006699;
	border-left-color: #006699;
}

.tbl-blue td {
	padding:5px;
	border-top-width: 1px;
	border-right-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-top-color: #006699;
	border-right-color: #006699;
}

.tbl-blue th {
	padding:3px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #006699;
	font-weight: bold;
	color: #FFFFFF;
	background-color: #0099CC;
	text-align: center;
}

.tbl-orange {
	width:100%;
	border-top-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #FF6600;
	border-bottom-color: #FF6600;
	border-left-color: #FF6600;
}

.tbl-orange td {
	padding:5px;
	border-top-width: 1px;
	border-right-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-top-color: #FF6600;
	border-right-color: #FF6600;
}

.tbl-orange th {
	padding:3px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #FF6600;
	font-weight: bold;
	color: #FFFFFF;
	background-color: #FF9933;
	text-align: center;
}

.tbl-orange td,
.tbl-blue td img {
	vertical-align: middle;
}

.courseBox{
	float: left;
	width: 128px;
	padding-bottom: 8px;
}
.courseBoxEnd{
	float: left;
	width: 120px;
	padding-bottom: 8px;
}

.courseBox img,#topMain .courseBoxEnd img{
	margin-bottom: 5px;
}

.a-i-yj{
	background: url(../img/page/i-yj-bl2.gif) no-repeat;
	padding-left: 18px;
}

.petArea{
	float: right;
	width: 66px;
}


/*------------------------------------------------------------------
			footer
-------------------------------------------------------------------*/


#footer{
	clear: both;
	padding-bottom: 20px;
}

#ftMenu{
	background: url(../img/comm/lin-dot.jpg) repeat-x;
	padding-top: 6px;
	padding-bottom: 6px;
	text-align: center;
	text-align: center;
	position:relative;
	overflow: hidden;
	
}
#ftMenu ul{
	position:relative;
	left: 50%;
	float: left;
}

#ftMenu li{
	position:relative;
	left: -50%;
	float: left;


	list-style-type: none;
	float: left;
	display:-moz-inline-box;
	padding-left: 8px;
	padding-right: 8px;
	border-left: 1px solid #666666;
}

#ftMenu li.fst{
	border-left: none;
}
#ftMenu li a{
	text-decoration: none;
	color: #333333;
}
#ftMenu li a:visited{
	text-decoration: none;
	color: #000000;
}
#ftMenu li a:hover{
	text-decoration: underline;
	color: #669999;
}


#ftAddArea{
	clear: both;
	background: url(../img/comm/lin-dot.jpg) repeat-x;
	padding-top: 8px;
	padding-bottom: 20px;
}

#ftAdd{
	float: left;
	width: 400px;
}

#ftQr{
	margin-left:auto;
	margin-right: 0px;
	width: 350px;
	line-height: 1.3;
	float: right;
}




/*-----------------------------------------------------------------
		class
------------------------------------------------------------------*/

.clearfix { display: inline-block; }
.clearfix:after {
     clear: both;
     content: " ";
     display: block;
     font-size: 0;
     height: 0;
     visibility: hidden;
     }
/* start commented backslash hack \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }


.alin-c{ text-align: center;}
.alin-c table{ margin-left: auto; margin-right:auto;}
.alin-l{ text-align: left;}
.alin-r{ text-align: right;}

.bdr{ border: 1px solid #CCC;}
.bdr-bl{ border: 1px solid #3366CC;}
.bdr-t{ border-top: 1px solid #CCC;}

.bdr-l-orn{ border-left: 4px solid #FFC299;}

.box-ylw{
	border: 1px solid #FF9933;
	background-color: #FFFFE0;
}


.clr{ clear: both;}

.valn-c-img{
	vertical-align: middle;
	margin-right:5px;
}

.cap-start{
	background: url(../img/top/sta-cap-bk.jpg) repeat-x;
	padding-left: 4px;
	padding-bottom: 4px;
}

.cap-center{
	background-color:  #DDEDAE;
	padding: 4px;
	margin-bottom: 8px;
	
}

.cap-h2{
	background-color:  #D6EBEB;
	font-size: 120%;
	margin-bottom: 10px;
	padding-top: 4px;
	padding-right: 4px;
	padding-bottom: 4px;
	padding-left: 8px;
}

.cap-h3{
	padding: 0px 10px 10px 21px;
	margin-top: 12px;
	font-size: 120%;
	background-image: url(../img/common/i-blue.gif);
	background-repeat: no-repeat;
	background-position: left 5px;
}
.cap-h2 span{
	border-left: 4px solid #88B826;
	padding-left: 10px;
}


.cap-center a{
	border-left: 4px solid #88B826;
	padding-left: 10px;
	font-weight: bold;
	color: #000000;
}

.cap-juko{
	background: url(../img/shisetsu/juko-ttl-bk.gif) repeat-x;
}

.box-juko{
	border: 1px solid #FF9900;
	padding: 8px 100px 8px 8px;
	background: url(../img/shisetsu/juko-cut.gif) no-repeat right 5px  #FFF4DE;
}


.flt-r{
	float: right;
}

.flt-r10{
	float: right;
}

.flt-l{
	float: left;
}

.flt-l10{
	float: left;
	margin-right: 10px;
}

/* フォント　*/
.fs-sml{ font-size: 80%;}
.fs-lg{ font-size: 120%;}
.fs-lg2{ font-size: 140%;}

.fc-blue {
	color:#006699;
	margin-bottom: 10px;
}
.fc-red { color:#FF0000;}
.fc-green {
	color:#669933;
	margin-bottom: 10px;
}


.pd3{padding:3px;}
.pd5{padding:5px;}
.pd10{padding:10px;}
.pd15{padding:15px;}
.pd20{padding:20px;}
.pd25{padding:25px;}
.pd30{padding:30px;}

.pdt3{padding-top:3px;}
.pdt5{padding-top:5px;}
.pdt10 {padding-top:10px;}
.pdt15 {padding-top:15px;}
.pdt20 {padding-top:20px;}
.pdt30 {padding-top:30px;}
.pdt50 {padding-top:50px;}
	
.pdr5 {padding-right:5px;}
.pdr10 {padding-right:10px;}
.pdr15 {padding-right:15px;}
.pdr20 {padding-right:20px;}
.pdr30 {padding-right:20px;}

.pdb5 {padding-bottom:5px;}
.pdb10 {padding-bottom:10px;}
.pdb15 {padding-bottom:15px;}
.pdb20 {padding-bottom:20px;}
.pdb30 {padding-bottom:30px;}
.pdb40 {padding-bottom:40px;}
.pdb50 {padding-bottom:50px;}
	
.pdl5 {padding-left:5px;}
.pdl10 {padding-left:10px;}
.pdl15 {padding-left:15px;}
.pdl20 {padding-left:20px;}
.pdl25 {padding-left:25px;}
.pdl30 {padding-left:30px;}
.pdl35 {padding-left:35px;}
.pdl40 {padding-left:40px;}
.pdt10b20l10{padding:10px 0 20px 10px;}

.mg10{margin:10px;}

.mgt5 {margin-top:5px;}
.mgt10 {margin-top:10px;}
.mgt15 {margin-top:15px;}
.mgt20 {margin-top:20px;}
.mgt30 {margin-top:30px;}

.mgr5 {margin-right:5px;}
.mgr10 {margin-right:10px;}
.mgr15 {margin-right:15px;}
.mgr20 {margin-right:20px;}

.mgb5 {margin-bottom:5px;}
.mgb10 {margin-bottom:10px;}
.mgb15 {margin-bottom:15px;}
.mgb20 {margin-bottom:20px;}
.mgb30 {margin-bottom:30px;}

.mgl5 {margin-left:5px;}
.mgl8 {margin-left:8px;}
.mgl10 {margin-left:10px;}
.mgl15 {margin-left:15px;}
.mgl20 {margin-left:20px;}


.bdr-bl-pad10 {
	border: 2px solid #3984BE;
	text-align: center;
	padding: 10px;
	margin-top: 10px;
	margin-bottom: 10px;
}
.fbgc-blue {
	color:#000000;
	font-weight: bold;
	background-color: #DDF7FF;
	padding: 5px;
	margin-top: 5px;
	margin-bottom: 10px;
	clear: both;
}
.fbgc-glay-cen {
	color:#000000;
	font-weight: bold;
	background-color: #F0F0F0;
	padding: 10px;
	margin-top: 10px;
	margin-bottom: 10px;
	clear: both;
	text-align: center;
	border: 1px solid #D9D9D9;
}

div.tooltip	{
	width: 250px;
	position: absolute;
	left: -9999px;
	background: #EEE;
	padding: 5px;
	border: 1px solid #AAA;
}


/*-----------------------------------------------------------------
		tooltips
------------------------------------------------------------------*/
ul.tooltip	{
	width: 250px;
	position: absolute;
	left: -9999px;
	background: #EEE;
	padding: 5px;
	border: 1px solid #AAA;
}

ul.tooltip li{
	color: #FFF;
	background: #222;
	padding: 5px 10px;
}
/*-----------------------------------------------------------------
		ゴールページ
------------------------------------------------------------------*/
#goal-subpic-box {
	width: 410px;
	margin-top: 10px;
	margin-bottom: 10px;
}

.goal-subpic-mgrb5 {
	margin-top: 0px;
	margin-right: 4px;
	margin-bottom: 5px;
	margin-left: 0px;
}

#goal-info-box {
	border:1px solid #00CCFF;
	padding: 8px;
	margin-top: 20px;
	margin-right: 0;
	margin-bottom: 10px;
	margin-left: 0;
}

h3.goal-point {
	font-size:100%;
	background-image: url(../img/maru.gif);
	margin-top: 0;
	margin-right: 0;
	margin-bottom: 5px;
	margin-left: 20px;
	padding-left: 10px;
	background-repeat: no-repeat;
	background-position: left center;
}

h4#goal-comment {
	background-color: #86C4E9;
	margin-bottom: 5px;
	padding: 4px;
}
h3.goal-point02 {
	font-size:100%;
	background-image: url(../img/arrow-course.gif);
	background-repeat: no-repeat;
	background-position: left center;
	margin-top: 0;
	margin-right: 0;
	margin-bottom: 5px;
	margin-left: 30px;
	padding-left: 30px;
}
.cap-h4 {
	padding: 5px;
	font-size: 110%;
	color: #FFFFFF;
	background-color: #3984BE;
}
.mgl50 {
margin-left:60px;
}