@charset "UTF-8";
/*
Copyright 2006 infonet.co.,ltd
infonet.co.,ltd Global CSS 
*/

* {
  line-height: 1.0;
  margin: 0 auto;
  padding: 0;
}

body {
  color: #333333;
  font-size: 90%;
  padding-top: 5px;
  padding-bottom: 5px;
  text-align: left;
  background-image: url(img/bg.gif);
}

h1 {
  margin: 0;
  padding: 30px 0;
  color: #FFFFFF;
  font-size: 140%;
  font-family: "ヒラギノ角ゴ Pro W3", "ＭＳ Ｐゴシック", "Osaka";
  text-align: center;
}

h2 {
  line-height: 100%;
  margin: 15px 0;
  padding: 5px 15px;
  border-left: 5px solid #0099FF;
  font-size: 110%;
  letter-spacing: 0.5em;
}

h3 {
  padding: 3px 10px;
  margin: 10px 0;
  background: #99CC33 url(img/titlebg.gif);
  color: #FFF;
  border: 1px outset #336600;
  font-size: 90%;
}

img {
  border: none;
}

ul {
  margin: 0;
  padding: 1em;
  list-style-type: none;
  text-align: left;
}
ul ul {
  padding: 0.5em 1em;
}
	li {
	  vertical-align: middle;
	  margin: 0;
	  padding: 0.3em 0.5em;
	  line-height: 120%;
	}

dl {
  margin: 0px auto;
  padding: 30px 35px;
  color: #666666;
  font-size: 95%;
}

dt {
  letter-spacing: 0.2em;
  line-height: 140%;
  margin: 0 0 0 10px;
  font-weight: bold;
}

dd {
  position: relative;
  top: -1.4em;
  left: 8.5em;
  line-height: 140%;
  width: 350px;
  margin: 0;
  padding: 0 20px 0 10px;
}

	a:link {
	  outline-style: none;
	  color: #6666FF;
	  text-decoration: none;
	}
	a:visited {
	  outline-style: none;
	  color: #666699;
	  text-decoration: none;
	}
	a:hover {
	  outline-style: none;
	  color: #666666;
	  text-decoration: underline;
	  background-color: #CCCCCC;
	}
	a:active {
	  outline-style: none;
	  color: #000000;
	  text-decoration: none;
	}

address {
  line-height: 160%;
  font-style: normal;
}

hr {
  margin: 1.5em 0;
}

/* contents */

div#stage {
  background: url(img/sbg.gif) center repeat-y;
}

div#con {
  width: 700px;
  overflow: hidden;
  border: 2px solid #333333;
  background-color: #999999;
}

/* head */

div#head {
  float:left;
  padding:0 13px;
}
	div#head_right {
	  float: right;
	}

/* menu */

div#menus {
  height: 44px;
  color: #FFFFFF;
  overflow: hidden;
  font-family: "ＭＳ Ｐゴシック", "Osaka", "ヒラギノ角ゴ Pro W3";
  background-image: url(img/menubg.gif);
  background-repeat: repeat-x;
}
	ul#menu {
	  margin: 0;
	  padding: 0;
	  text-align: center;
	}
	ul#menu li {
	  display: block;
	  float: right;
	  margin: 0;
	  padding: 0;
	  text-align: center;
	  font-size: 12px;
	}
	ul#menu li a {
	  display: block;
	  margin: 0;
	  padding-top: 15px;
	  color: #FFFFFF;
	  font-weight :bold;
	}
		ul#menu li.offt a {
		  width: 135px;
		  height: 44px;
		  background: transparent url("img/buttont.gif") no-repeat 0px -44px;
		}
		ul#menu li.offt a:hover {
		  color: #000000;
		  text-decoration: none;
		  background: transparent url("img/buttont.gif") no-repeat;
		}
		ul#menu li.ont a {
		  width: 135px;
		  height: 44px;
		  color: #999999;
		  background: transparent url("img/buttont.gif") no-repeat;
		}
		ul#menu li.ont a:hover {
		  color: #000000;
		  text-decoration: none;
		  background: transparent url("img/buttont.gif") no-repeat;
		}
	ul#menu li.off a {
	  width: 100px;
	  height: 44px;
	  background: transparent url("img/button.gif") no-repeat 0px -44px;
	}
	ul#menu li.off a:hover {
	  color: #000000;
	  text-decoration: none;
	  background: transparent url("img/button.gif") no-repeat;
	}
	ul#menu li.on a {
	  width: 100px;
	  height: 44px;
	  color: #999999;
	  background: transparent url("img/button.gif") no-repeat;
	}
	ul#menu li.on a:hover {
	  color: #000000;
	  text-decoration: none;
	  background: transparent url("img/button.gif") no-repeat;
	}

/* maincontents */

div.top {
  overflow: hidden;
  width: 700px;
  height: 200px;
}
div#maincon {
  padding-bottom: 10px;
  border-top: 3px solid #4C4C4C;
  background: #E6E6E6 url(img/tbg.gif) repeat-y;
}

	div.main {
	  line-height: 160%;
	  padding: 10px 50px;
	}
	div.main_in {
	  line-height: 160%;
	  padding: 10px 30px;
	}

div#topics {
  background-image: url(img/tbg.gif);
  background-repeat: repeat-y;
}
	
	div#t_topics {
	  overflow: auto;
	  line-height: 140%;
	  width: 620px;
	  height: 105px;
	  padding: 10px 15px;
	}
	
	div#t_topics ul {
	  margin: 0;
	  padding: 0 1em;
	  list-style:none;
	}
	div#t_topics li {
	  line-height: 120%;
	  margin: 0;
	  padding: 0.1em 0em;
	}

	div#t_test {
	  float: left;
	  width: 310px;
	  margin: 5px 0;
	  padding: 0 0 0 26px;
	}
	
	div#t_dousa {
	  float: right;
	  width: 317px;
	  margin: 5px 0;
	  padding: 0 26px 0 3px;
	  border-left: 1px dotted #999999;
	}
	
	div.topicin1 {
	  overflow: hidden;
	  height: 235px;
	  line-height: 130%;
	  margin: 0;
	  padding: 15px 10px;
	}
	div.topicin2 {
	  overflow: auto;
	  width: 298px;
	  height: 235px;
	  line-height: 130%;
	  margin: 0px;
	  padding: 15px 10px;
	}
	
		table.dousa {
		  width: 273px;
		  margin: 0;
		  padding: 0;
		  border-spacing: 3px;
		  font-size: 85%;
		}
		td.l1 {
		  padding: 2px 0.5em;
		  background-color: #CCCCCC;
		}
		td.dousa1 {
		  vertical-align: middle;
		  width: 67px;
		  padding: 2px 0 1px 0.5em;
		  color: #FFFFFF;
		  background-color: #B3B3B3;
		}
		td.dousa2 {
		  vertical-align: middle;
		  width: 185px;
		  padding: 2px 0.5em 1px 0.5em;
		  background-color: #EEEEEE;
		}
			td.dousa2 ul {
			  margin: 0;
			  padding: 0;
			}
			td.dousa2 li {
			  padding: 0;
			}
			td.dousa2 ul ul li {
			  padding: 0 0 0 1em;
			}
		caption.top {
		  margin: 0;
		  padding: 2px;
		  text-align: left;
		  border-bottom: 1px solid #666666;
		}
		td.blank {
		  width: 12px;
		}
	
	div.topicinin {
	  padding-top: 0.5em;
	  line-height: 140%;
	  font-size: 85%;
	  margin: 10px 15px 5px;
	}

div.learning {
  overflow: hidden;
  width: 700px;
  height: 68px;
  text-align: center;
  background: url(img/learning.gif) no-repeat;
}

	div#learn {
	  padding-left: 25px;
	  text-align: center;
	}
	div#learn h2 {
	  float: left;
	  overflow: hidden;
	  width: 166px;
	  height: 136px;
	  margin: 0 7px;
	  padding: 0;
	  border-left: 0px solid #0099FF;
	  font-size: 110%;
	  letter-spacing: normal;
	}
	div#learn h2#but01 a, div#learn h2#but01 a:visited {
	  display: block;
	  width: 166px;
	  height: 136px;
	  background: url(img/but01.gif) no-repeat;
	}
	div#learn h2#but01 a:hover , div#learn h2#but01 a#butnow {
	  color: #DDDDDD;
	  background: url(img/but01.gif) 0 -136px no-repeat;
	  text-decoration: none;
	}
	
	div#learn h2#but02 a, div#learn h2#but02 a:visited {
	  display: block;
	  width: 166px;
	  height: 136px;
	  background: url(img/but02.gif) no-repeat;
	}
	div#learn h2#but02 a:hover , div#learn h2#but02 a#butnow {
	  color: #DDDDDD;
	  background: url(img/but02.gif) 0 -136px no-repeat;
	  text-decoration: none;
	}
	
	div#learn h2#but03 a, div#learn h2#but03 a:visited {
	  display: block;
	  width: 166px;
	  height: 136px;
	  background: url(img/but03.gif) no-repeat;
	}
	div#learn h2#but03 a:hover , div#learn h2#but03 a#butnow {
	  color: #DDDDDD;
	  background: url(img/but03.gif) 0 -136px no-repeat;
	  text-decoration: none;
	}

div.answer {
  margin: 10px 0;
  padding: 1em 0;
  text-align: center;
}

div.example {
  float: left;
  width: 280px;
  padding: 10px;
  text-align: center;
  line-height: 160%;
}

	div.detail {
	  font-size: 90%;
	  line-height: 140%;
	  width: 250px;
	  padding: 5px 0;
	  text-align: left;
	}

span.title {
  padding: 10px;
  background-color: #D0E5FF;
  border: 3px double #027ABB;
}
div.minititle {
  width: 250px;
  padding: 3px 0;
  margin-bottom: 3px;
  background: #99D0A0 url(img/minititlebg.gif);
  border: 1px outset #555555;
}

div.expic {
  float: left;
  line-height: 120%;
  width: 160px;
  font-size: small;
}
	div.expic img {
	  padding: 3px 0;
	}
	div.expicmid {
	  float: left;
	  vertical-align: middle;
	  padding: 60px 5px;
	}

div.apear {
  line-height: 140%;
  padding:5px;
  margin: 1em;
  background: #FBFAEC;
  border: 1px dotted #555555;
  font-size: 90%;
}

div.learning_fl {
  float: left;
  padding-right: 10px;
}

div.question {
  line-height: 140%;
  padding: 2px 10px;
  color: #FFFFFF;
  font-weight: bold;
  background: #84A9DA;
}
div.answer {
  padding: 2px 1em 2px 2em;
  line-height: 120%;
  text-align: left;
  text-indent: -1.6em;
}
	span.answer {
	  color: #7C3428;
	  font-weight: bold;
	  font-size: large;
	}

table.price {
  width: 400px;
  text-align: right;
  border: 0.5px solid #555555;
}
table.pricenob {
  width: 400px;
  text-align: right;
  border: 0px solid #555555;
}
	table.price th {
	  padding: 2px;
	  background: #888888;
	  text-align: center;
	  border: 0.5px solid #555555;
	}
	table.price td {
	  padding: 2px 5px;
	  background: #F0F0F0;
	  border: 0.5px solid #555555;
	}
	table.price td.noborder {
	  padding: 2px 5px;
	  text-align: center;
	  background: none;
	  border: 0;
	}

.blanksp {
  margin: 3em;
}

span.dousa {
  font-size: 90%;
}

/* footer */

div#footmenu {
  clear: both;
  padding: 1px 15px;
  font-size: 90%;
  color: #FFFFFF;
  text-align: center;
  border-top: 1px solid #4C4C4C;
  background-color: #999999;
}
	div#footmenu a {
	  color: #FFFFFF;
	  padding: 0 6px;
	}
	div#footmenu ul {
	  padding: 0;
	  text-align: center;
	}
	div#footmenu li {
	  display: inline;
	  padding: 0 3px;
	  margin: 0;
	  border-right: 1px solid #333333;
	}
	div#footmenu li.non {
	  padding: 0 3px;
	  border: none;
	}

div#footer {
  padding: 5px 10px;
  color: #4C4C4C;
  font-family: Georgia;
  font-size: 80%;
  text-align: right;
  border-top: 10px solid #4C4C4C;
}

/* etc */

div.cl {
  clear: both;
}

div.ma {
  padding: 1em;
}

div.right {
  text-align: right;
}

.center {
  text-align: center;
}

.left {
  text-align: left;
}

.vanity {
  display: none;
}

.small {
  font-size: smaller;
}
.large {
  font-size: large;
}
.red {
  color: #FF0000;
}

.disc {
  list-style: url(img/mark.gif) outside disc;
}
	ul.disc li {
	  margin-left: 1em;
	}

.attention {
  padding: 1em 0;
  font-size: smaller;
}
.attentionp {
  padding: 1em 0 0;
  text-align: center;
  font-size: small;
}
.p1em {
  padding: 1em 0;
}
.fl {
  float: left;
}

.pagetop {
  margin-top: 1em;
  font-size: small;
  text-align: right;
}

.category {
  font-weight: bold;
  font-size: 90%;
  color: #fff;
  background: #CCCCCC;
}
.category2 {
  font-weight: bold;
  font-size: 90%;
  color: #fff;
  background: #DDDDDD;
}

/* button */
	
#submenu {
        width: 146px;
		padding: 0;
		margin: 0;
		font-weight: bold;
		font-size: 11.5px;
        }

#submenu li {
		margin: 0;
		padding: 0;
		}

#submenu ul {
		margin: 0;
		padding: 0 0 0 6px;
		}

#submenu li a {
        height: 32px;
          voice-family: inherit;
          height: 24px;
        text-decoration: none;
        }

#submenu li a:link, #submenu li a:visited {
        color: #4D4D4D;
        display: block;
        background: url(img/button.gif);
        padding: 8px 0 0 10px;
        }

#submenu li a:hover, #submenu li #current {
        color: #FF9834;
        background: url(img/button.gif) 0 -32px;
        padding: 8px 0 0 10px;
        }
div.detail_btn {
	overflow: hidden;
	width: 477px;
	height: 52px;
	text-align: center;
	}
	div.detail_btn a {
		display: block;
		width: 477px;
		height: 52px;
		background: url(img/detail.gif) no-repeat;
		}
		div.detail_btn a:hover {
			background: url(img/detail.gif) no-repeat 0 -52px;
			}
