@charset "utf-8";
/*
Theme Name: Kisetsu
Theme URI: http://www.kisetsu.org/
Description: Site design for kisetsu.org
Version: 1.0
Author: Katsuhiro Saiki
Author URI: 
Tags: 
*/

/*
========================================
default font size style
========================================
*/


/*
Copyright (c) 2008, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 2.5.1
*/
html{color:#000;background:#efefef;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img{border:0;}
address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}
li{list-style:none;}
caption,th{text-align:left;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
q:before,q:after{content:'';}
abbr,acronym {border:0;font-variant:normal;}
/* to preserve line-height and selector appearance */
sup {vertical-align:text-top;}
sub {vertical-align:text-bottom;}
input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}
/*to enable resizing for IE*/
input,textarea,select{*font-size:100%;}
/*because legend doesn't inherit in IE */
legend{color:#000;}

/**
 * Percents could work for IE, but for backCompat purposes, we are using keywords.
 * x-small is for IE6/7 quirks mode.
 */
body {font:13px/1.231 helvetica,arial,sans-serif;*font-size:small;*font:x-small;}
table {font-size:inherit;font:100%;}
/**
 * Bump up IE to get to 13px equivalent
 */
pre,code,kbd,samp,tt {font-family:monospace;*font-size:108%;line-height:100%;}




/*
========================================
generic style
========================================
*/

body {
	color: #666;
	background: url(/style/images/background.gif) left top repeat-x #efefef;
	}

/* hidden item */
.hidden {
	position: absolute;
 	left: 0px;
 	top: -500px;
 	width: 1px;
 	height: 1px;
 	overflow: hidden;
	}

em {
	font-style: italic;
	}

strong {
	font-weight: bold;
	}

.japanese {
	font-family: "Helvetica", "Arial", "Hiragino Kaku Gothic Pro", "Osaka", "ＭＳ Ｐゴシック", sans-serif;
	}



/* horizontal rule styles - use: <div class="hr"><!-- --></div><hr /> */
div.hr {
	height: 1px;
	background: url(/style/images/dots.gif) center center repeat-x;
	margin: 1em 0;
	}

.last {
	margin-bottom: 0;
	}

.cleardiv {
	height: 0;
	clear: both;
	}

hr {display: none;}


/* arrow link font setting */
.link {
	font-size: 85% !important;
	text-transform: uppercase !important;
}

/* return link footer setting  */
p.return {
	background: url(/style/images/dots.gif) top left repeat-x;
	padding: 2em 0 !important;
	font-size: 77% !important;
	text-transform: uppercase;
	}


/*
========================================
link color
========================================
*/

/* sitewide link colors */
a:link {
	color: #03a;
	text-decoration: none;
	}

a:visited {
	color: #639;
	text-decoration: none;
	}

a:hover {
	color: #39d;
	text-decoration: none;
	}
/* end sitewide link colors */



/* sidebar link colors */
#sidebar div.purchase-wrap p a {
	color: #03a;
	text-decoration: underline;
}

#sidebar div.purchase-wrap p a:visited {
	color: #03a;
	}

#sidebar div.purchase-wrap p a:hover {
	color: #39d;
	}


/* arrow link colors */
a.arrow {
	padding-left: 10px;
	color: #03a;
	background: url(/style/images/arrow_off.gif) center left no-repeat;
	font-weight: bold;
	}

a.arrow:visited {
	color: #03a;
	background: url(/style/images/arrow_off.gif) center left no-repeat;
	}

a.arrow:hover {
	color: #39d;
	background: url(/style/images/arrow_on.gif) center left no-repeat;
	}

/* external link colors */
a.exlink {
	padding-right: 22px;
	color: #03a;
	background: url(/style/images/exlink_icon_off.gif) center right no-repeat;
	}

a.exlink:visited {
	color: #03a;
	background: url(/style/images/exlink_icon_off.gif) center right no-repeat;
	}

a.exlink:hover {
	color: #39d;
	background: url(/style/images/exlink_icon_on.gif) center right no-repeat;
	}

/* return link colors */
p.return a {
	padding-left: 18px;
	color: #03a;
	background: url(/style/images/back_icon_off.gif) center left no-repeat;
	}

p.return a:visited {
	color: #03a;
	background: url(/style/images/back_icon_off.gif) center left no-repeat;
	}

p.return a:hover {
	color: #39d;
	background: url(/style/images/back_icon_on.gif) center left no-repeat;
	}

/* top link colors */

p.toplink a {
	padding-left: 13px;
	color: #03a;
	background: url(/style/images/top_icon_off.gif) top left no-repeat;
	}

p.toplink a:visited {
	color: #03a;
	background: url(/style/images/top_icon_off.gif) top left no-repeat;
	}

p.toplink a:hover {
	color: #39d;
	background: url(/style/images/top_icon_on.gif) top left no-repeat;
	}

/* page navigation */
.navigation {
	font-size: 85%;
	text-transform: uppercase;
	}

.navigation .prev {
	float: left;
	}

.navigation .next {
	float: right;
	}

.navigation a:visited {
	color: #03a !important;
}

.navigation a:hover {
	color: #39d !important;
}

.navigation .prev a {
	padding-left: 12px;
	background: url(images/arrow_l_off.gif) left center no-repeat;
	}

.navigation .prev a:hover {
	background: url(images/arrow_l_on.gif) left center no-repeat;
	}

.navigation .next a {
	padding-right: 12px;
	background: url(images/arrow_r_off.gif) right center no-repeat;
	}

.navigation .next a:hover {
	background: url(images/arrow_r_on.gif) right center no-repeat;
	}

/*
========================================
page layout setting
========================================
*/

#container {
	width: 780px;
	margin: 0 auto;
}

#page-wrap {
	background: #fff;
	margin-bottom: 20px;
	border:solid 1px #b0b0b0;
}

#content-sidebar {
	padding: 15px 15px 0 15px;
}

#nosidebar-content {
	padding: 15px 15px 0 15px;
}

#content {
	width: 552px;
	float: left;
}

#nosidebar-content #content {
	width: 100%;
	float: none;
}

#content .width-wrap {
	margin: 0 8px;
	clear: both;
}

#sidebar {
	width: 180px;
	float: right;
}

#footer {
	clear:both;
}

/* end contents layout style */


/*
========================================
header
========================================
*/

/* header lauguage select style */

#header .lang {
	float: right;
	margin:6px 10px 6px 0;
	font-size:77%;
	font-family: "Trebuchet MS", "Lucida Sans", sans-serif;
	letter-spacing: 0.1em;
	text-transform:uppercase;
	color:#555;
}

#header .lang a {
	color:#000;
}

#header .lang a:hover {
	color:#777;
}


/* header layout style */

#header .header-container {
	clear:both;
	height: 103px;
	padding-right: 14px;
	background: url(/style/images/header.gif) left top;
}

#header .header-container h2.logo a{
	float: left;
	height: 89px;
	width: 194px;
	text-indent: -5000px;
	background: url(/style/images/header_logo.gif) no-repeat left top;
}

/* end header layout style */


/* user-services */

#header .user-services-wrap {
	float: right;
	width: 180px;
	height: 24px;
	margin-top: 37px;
	background: url(/style/images/header_menu_bg.gif) left top transparent;
}

#header .user-services-wrap ul {
	padding-top: 1px;
	padding-left: 5px;
}

#header .user-services-wrap ul li {
	float: left;
}

#header .user-services-wrap ul li a {
	display: block;
	width: 82px;
	height: 22px;
	text-indent: -5000px;
}

#h-map a {
	background: url(/style/images/headmenu_sitemap.gif) top left no-repeat;
	}

#h-contact a {
	background: url(/style/images/headmenu_contact.gif) top left no-repeat;
	}

/* main navigation */

#nav {
	overflow: hidden;
	height: 31px; 
}

#nav li {
	float: left;
	}

#nav li a {
	display: block;
	overflow: hidden;
	width: 156px;
	height: 0px !important; 
	height /**/: 31px; /* for IE5/Win only */
	padding-top: 31px;
	}

#nav #n-home a {
	background: url(/style/images/menu_en_home.gif) top left no-repeat;
	}

#nav #n-news a {
	background: url(/style/images/menu_en_news.gif) top left no-repeat;
	}

#nav #n-kisetsu a {
	background: url(/style/images/menu_en_study.gif) top left no-repeat;
	}

#nav #n-learn a {
	background: url(/style/images/menu_en_learn.gif) top left no-repeat;
	}

#nav #n-about a {
	background: url(/style/images/menu_en_about.gif) top left no-repeat;
	}

#nav li a:hover {
	background-position: 0 -31px !important;
	}

ul.sub-nav li { 
	float: none;
	width: 100%;
	margin: 0;
	padding: 0;
	font-size: 85%;
}

#nav li.off ul.sub-nav { 
	display: none;
	position: absolute !important;
	}

#nav li.on ul.sub-nav {
	position: absolute !important;
	width: 156px !important;
	padding: 0 !important;
}

#nav li.on ul.sub-nav li a {
	display: block !important;
	width: 136px !important;
	height: 16px !important; 
	margin: 0 !important;
	padding: 5px 10px !important;
	border-bottom: 1px #e0e0e0 solid !important;
	color: #333 !important;
	background-image: none !important;
	background-color: #f0f0f0 !important;
	text-align: left;
}

#nav li.on ul.sub-nav li a:hover {
	background-image: none !important;
	background-color: #ccc !important;
	border-bottom: 1px #bbb solid !important;
}



/*
========================================
footer
========================================
*/

/* footer layout style*/

#footer {
	padding-top: 35px;
	padding-bottom: 15px;
	background-color: #82b12a;
}

#footer .foot-navi {
	text-align: center;
	font-size: 77%;
	color: #fff;
	letter-spacing: 1px;
}

#footer .foot-navi a {
	font-weight: bold;
	text-decoration: none;
	text-transform: uppercase;
	color: #fff;
}

#footer .foot-navi a:hover {
	color: #ccc;
	text-decoration: underline;
}

#copy {
	font-family: Helvetica, Arial, sans-serif;
	margin: 20px 0;
	text-align: center;
	font-size:9px;
	letter-spacing: 1px;
}

/* end footer style*/



/*
========================================
sidebar setting
========================================
*/

/* ecommunity */

#sidebar div.ecommunity-wrap {
	margin-bottom:18px;
	padding-bottom:1px;
	background:#d9d5bd;
}

#sidebar div.ecommunity-wrap h3 {
	height:32px;
	text-indent: -5000px;
	background: url(/style/images/side_en_ecommunity.gif) top left no-repeat;
}

#sidebar div.ecommunity-wrap div.wrapper {
	margin: 10px;
	background: #deeff2;
	border: 2px solid #fff;
}

#sidebar div.ecommunity-wrap h4.student a {
	display: block;
	height: 36px;
	text-indent: -5000px;
	background: url(/style/images/submit_en_student.gif) top left no-repeat;
}

#sidebar div.ecommunity-wrap h4.teacher a {
	display: block;
	height: 36px;
	text-indent: -5000px;
	background: url(/style/images/submit_en_teacher.gif) top left no-repeat;
}

#sidebar div.ecommunity-wrap p {
	font-size: 85%;
	color: #444;
	padding: 8px;
	padding-top: 0;
	line-height: 130%;
}

/* submit */

#sidebar div.submit-wrap {
	margin-bottom:18px;
	padding-bottom:1px;
	background:#d9d5bd;
}

#sidebar div.submit-wrap h3 {
	height:32px;
	text-indent: -5000px;
	background: url(/style/images/side_en_submit.gif) top left no-repeat;
}

#sidebar div.submit-wrap div.wrapper {
	margin: 10px;
	background: #deeff2;
	border: 2px solid #fff;
}

#sidebar div.submit-wrap h4.student a {
	display: block;
	height: 36px;
	text-indent: -5000px;
	background: url(/style/images/submit_en_student.gif) top left no-repeat;
}

#sidebar div.submit-wrap h4.teacher a {
	display: block;
	height: 36px;
	text-indent: -5000px;
	background: url(/style/images/submit_en_teacher.gif) top left no-repeat;
}

#sidebar div.submit-wrap p {
	font-size: 85%;
	color: #444;
	padding: 8px;
	padding-top: 0;
	line-height: 130%;
}

/* purchace */

#sidebar div.purchase-wrap {
	margin-bottom:18px;
}

#sidebar div.purchase-wrap h3 a {
	display: block;
	height:32px;
	text-indent: -5000px;
	background: url(/style/images/side_en_textbook.gif) top left no-repeat;
}

#sidebar div.purchase-wrap img {
	display: block;
	border: 1px solid #bbb;
}

/* academic */

#sidebar div.academicprice-wrap {
	margin-bottom:18px;
}

#sidebar div.academicprice-wrap h3 a {
	display: block;
	height:32px;
	text-indent: -5000px;
	background: url(/style/images/side_en_academic.gif) top left no-repeat;
}

#sidebar div.academicprice-wrap p {
	font-size: 85%;
	color: #444;
	padding: 8px;
	line-height: 130%;
	background-color: #edf2f3;
	border: 1px solid #bbb;
}

#sidebar div.academicprice-wrap p a {
	color: #f60;
	text-decoration: underline;
}

/* donation */

#sidebar div.donation-wrap {
	margin-bottom:18px;
}

#sidebar div.donation-wrap h3 a {
	display: block;
	height:32px;
	text-indent: -5000px;
	background: url(/style/images/side_en_donation.gif) top left no-repeat;
}

#sidebar div.donation-wrap p {
	font-size: 85%;
	color: #444;
	padding: 8px;
	line-height: 130%;
	background-color: #edf2f3;
	border: 1px solid #bbb;
}

#sidebar div.donation-wrap p a {
	color: #f60;
	text-decoration: underline;
}



/* paypal */

#sidebar div.paypal-wrap {
	margin-bottom:18px;
	text-align: center;
}



/* link */

#sidebar div.link-wrap{
	margin-bottom:18px;
}

#sidebar div.link-wrap div.banner{
	padding-top: 10px;
	text-align: center;
	background: #f7f7f7;
	border: 1px solid #bbb;
}

#sidebar div.link-wrap h3 {
	height: 32px;
	text-indent: -5000px;
	background: url(/style/images/side_en_relatedsite.gif) top left no-repeat;
}

#sidebar div.link-wrap a img {
	border: 1px solid #999;
	margin-bottom: 8px;
	line-height: 100%;
}


/* sidebar menu */

#sidebar div.submenu {
	margin-bottom:18px;
	padding: 1em 8px 4px 8px;
	background-color: #d9d5bd;
}

#sidebar div.submenu ul li {
	font-size: 77%;
	text-transform: uppercase;
	font-family: "Lucida Sans", sans-serif;
	font-weight: bold;
	padding-bottom: 1em;
	}

#sidebar div.submenu ul a {
	display: block;
	padding-left: 10px;
	background: url(/style/images/arrow_off_gray.gif) center left no-repeat;
	color: #444;
	}

#sidebar div.submenu ul a:hover {
	background: url(/style/images/arrow_on_gray.gif) center left no-repeat;
	color: #999;
	}

/* end sidebar */

/*
========================================
generic form style
========================================
*/


form .form dt {
	display: block;
	float: left;
	clear: left;
	width: 170px;
	margin: 0 10px 5px 0;
	text-align: right;
	font-size: 85%;
	text-transform: uppercase;
}

form .form dd input {
	padding: 1px;
}

form .form dd {
	font-size: 93%;
	margin: 0 10px 5px 180px;
}

form #lastname,
form #firstname {
	width: 200px;
}

form #email,
form #mail,
form #mail2,
form #affiliate,
form #department,
form #jobtitle,
form #street1,
form #street2,
form #city {
	width: 300px;
}

form #zipcode {
	width: 80px;
}

form #telephone {
	width: 180px;
}


form #file1,
form #file2,
form #attach01,
form #attach02,
form #attach03,
form #attach04,
form #title {
	width: 300px;
}

form #subject {
	width: 300px;
}

form #step {
	width: 180px;
}

form #detail,
form #description,
form #message {
	width: 320px;
}

form #reset,
form #return,
form #submit {
	padding: 1px; 15px;
	font-size: 85%;
	font-weight: bold;
	color: #333;
}

dl.confirm dt {
	display: block;
	float: left;
	clear: left;
	width: 170px;
	margin: 0 10px 10px 0;
	text-align: right;
	font-size: 85%;
	text-transform: uppercase;
}

dl.confirm dd {
	font-size: 93%;
	line-height: 130%;
	margin: 0 10px 10px 180px;
}

/*
========================================
page style
========================================
*/





/*
---------------------------------------------------
news page
---------------------------------------------------
*/


/* common */

#news #content h2 {
	height: 48px;
	margin-bottom: 20px;
	text-indent: -5000px;
	background: url(/style/images/news_header_en.gif) top left no-repeat;
}

#news #content h1 {
	background: url(/style/images/dots.gif) bottom left repeat-x;
	padding: 5px 0;
	font-size: 123.1%;
	font-weight: bold;
	color: #000;
	line-height: 130%;
}

#news #content h1.list-title {
	font-size: 100%;
	font-weight: bold;
	font-family: "Trebuchet MS", "Lucida Sans", sans-serif;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: #000;
}

/* list */

#news #content ul {
	margin-bottom: 25px;
}

#news #content ul li {
	padding: 0.5em 0;
	line-height: 130%;
	background: url(/style/images/dots.gif) bottom left repeat-x;
	}

#news #content ul li div {
	padding-left: 2.5em;
	background: url(/style/images/leaf_icon.gif) 2px 3px no-repeat;
	}

#news #content ul li span.date {
	font-size: 85%;
	text-transform: uppercase;
	}

#news #content ul li span.date a {
	color: #333;
	}

#news #content ul li a {
	font-size: 93%;
	}

#news #content .navigation {
	font-size: 85%;
	text-transform: uppercase;
	margin-bottom: 2em;
	}

/* news page */

#news #content h3 {
	font-size: 93%;
	line-height: 150%;
	color: #444;
	font-weight: bold;
	padding-bottom: 1.5em;
}

#news #content h4 {
	font-size: 93%;
	line-height: 150%;
	color: #444;
	font-weight: bold;
}

#news #content p {
	font-size: 93%;
	line-height: 150%;
	color: #444;
	padding-bottom: 1.5em;
}

#news #content p.date {
	font-size: 85%;
	color: #777;
	padding-bottom: 0;
}

#news #content p.date .category {
	text-transform: uppercase;
}

#news #content p.date .category a {
	color: #333;
}

#news #content .text-wrap {
	margin: 2em 0;
}