@import url(paging.css);

body {
	background: url(../images/bg.gif) top left repeat-x;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	color: #888888;
	}

a:link, a:visited {
	color: #009179;
	text-decoration: none;
	}

a:hover, a:active {
	color: #001713;
	text-decoration: none;
	}

.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
	}

.clearfix {
    display:inline-block;
	}
/* Hide from IE Mac \*/
.clearfix {
    display:block;
	}
/* End hide from IE Mac */

.wrapper {
	width: 860px;
	margin: 0 auto;
    }

/* ~~~~~~~~~~ HEADER STYLE ~~~~~~~~~~ */

.header {
	position: relative;
	height: 166px;
	margin-bottom: 28px;
    }

.header .link {
	background: url(../images/link.gif) no-repeat;
	width: 272px;
	height: 39px;
	position: absolute;
	top: 0;
	right: 0;
    }

.header .link a {
	display: block;
	float: left;
	margin-top: 14px;
	color: #fff;
	font-size: 12px;
	line-height: 1.2;
    }

.header .link a:hover {
	color: #B2F9EE;
    }

.header .link .world {
	margin-left: 47px;
	margin-right: 32px;
    }

.header .middle h1 {
	float: left;
	margin-top: 26px;
    }

.header .middle h1 a {
	display:block;
	background: url(../images/h1.gif) no-repeat;
	width: 171px;
	height: 72px;
	text-indent: -9999px;
    }

.header .middle .slogan {
	float: right;
	margin-top: 60px;
	width: 564px;
	color: #333;
	line-height: 1.2;
    }

.header .nav {
	position: absolute;
	top: 126px;
    }

.header .nav li {
	float: left;
	font-size: 16px;
	font-weight: bold;
	line-height: 1.9;
	margin-right: 20px;
	width: 123px;
    }

.header .nav li a {
	float: left;
	display: block;
	padding-left: 29px;
	width: 94px;
	height: 30px;
    }

.header .nav li.selected a {
	background: url(../images/nav-selected.gif) no-repeat;
	color: #fff;
	cursor: default;
    }

/* ~~~~~~~~~~ HOME STYLE ~~~~~~~~~~ */

.container {
	margin-bottom: 40px;
    }

.home .middle {
	margin-bottom: 42px;
    }

.home .subject li {
	float: left;
	margin-right: 20px;
	width: 200px;
    }

.home .subject li.last {
	margin-right: 0;
    }

.home .subject li img {
	border: 1px #ccc solid;
	padding: 1px;
	margin-bottom: 8px;
    }

.home .subject li a:hover img {
	border: 1px #68D0BF solid;
    }

.home .subject li h2 {
	font-size: 15px;
	margin-bottom: 8px;
    }

.home .subject li h2 a {
	color: #333;
    }

.home .subject li h2 a:hover {
	color: #009179;
    }

.home .subject li p {
	color: #888;
	line-height: 1.4;
    }

/* ~~~~~~~~~~ SLIDER STYLE ~~~~~~~~~~ */

#slider {
	background: url(../images/slider-bg.gif) no-repeat;
	float: left;
	width: 560px;
	height: 240px;
	position: relative;
	overflow: hidden;
    }

.sliderImage {
    float: left;
    position: relative;
	display: none;
    }

.sliderImage span,
.top {
    display: none;
    }

/* ~~~~~~~~~~ ARTICLE CLASS STYLE ~~~~~~~~~~ */

.article-class li {
	float: left;
	margin: 0 14px 14px 0;
	width: 268px;
	height: 220px;
	border: 1px #e7e7e7 solid;
	padding: 1px;
    }

.article-class li:hover {
	border: 1px #bbb solid;
    }

.article-class li h4 {
	margin: 12px 0 4px;
	padding: 0 4px;
	font-size: 15px;
    }

.article-class li p {
	padding: 0 4px;
	line-height: 1.4;
	color: #666;
    }

.sidebar .class-article li a {
	background: url(../images/spirit.gif) no-repeat;
	background-position: 0 -32px;
    }

/* ~~~~~~~~~~ ARTICLE LIST STYLE ~~~~~~~~~~ */

.article-list {
	float: left;
	width: 568px;
    }

.article-list .item li  {
	float: left;
	margin: 0 20px 20px 0;
	width: 264px;
    }

.article-list .item li .photo  {
	float: left;
    }

.article-list .item li .photo img {
	width: 120px;
	height: 120px;
	border: 1px #eee solid;
	padding: 1px;
    }

.article-list .item li .photo:hover img {
	border: 1px #68D0BF solid;
    }

.article-list .item li .info  {
    float: right;
    width: 130px;
    color: #555;
    }

.article-list .item li .info h4  {
	border-bottom: 1px #bbb dotted;
	margin-bottom: 10px;
	padding-bottom: 8px;
	line-height: 1.2;
    }

.article-list .item li .info h4 a  {
	display: block;
	background: url(../images/spirit.gif) left -110px no-repeat;
	padding-left: 18px;
    }

.article-list .item li .info p  {
	line-height: 1.3;
    }

/* ~~~~~~~~~~ ARTICLE STYLE ~~~~~~~~~~ */

.article,
.news-list,
.news  {
	float: left;
	width: 548px;
    }

.article .photo {
	float: left;
	width: 254px;
    }

.article .info {
	float: right;
	width: 270px;
	font-weight: bold;
    }

.article .lightbox img {
	width: 240px;
	height: 180px;
	border: 2px #f4f4f4 solid;
	padding: 5px;
    }

.article .lightbox:hover img {
	border: 4px #eee solid;
	padding: 3px;
    }

.article .info h2 {
	margin-bottom: 10px;
	font-size: 15px;
	line-height: 1.2;
	color: #333;
    }

.article .info li {
	border-bottom: 1px #bbb dotted;
	margin-bottom: 6px;
	padding-bottom: 6px;
	line-height: 1.2;
    }

.article .info li.last {
	border-bottom: 0;
	margin-bottom: 0;
	padding-bottom: 0;
    }

.article .info li .label {
	float: left;
	width: 74px;
    }

.article .info li .describe {
	float: right;
	width: 196px;
    }

.article .info li .describe span {
	display: block;
    }

.article .description {
    margin: 28px 0;
    color: #555;
    }

.article .description p {
	margin-bottom: 10px;
	line-height: 1.4;
    }

.article .service a {
	display: block;
	float: left;
	margin-right: 6px;
	height: 16px;
    }

.article .service .download {
	background: url(../images/icon-service.gif) 0 0 no-repeat;
	width: 73px;
	text-indent: -9999px;
    }

.article .service .demand {
	background: url(../images/icon-service.gif) 0 -16px no-repeat;
	width: 72px;
	text-indent: -9999px;
    }

/* ~~~~~~~~~~ NEWS-LIST STYLE ~~~~~~~~~~ */

.news-list .item li {
	border-bottom: 1px #bbb dotted;
	margin-bottom: 18px;
	padding-bottom: 12px;
	line-height: 1.2;
    }

.news-list .item li.last {
	border-bottom: 0;
	margin-bottom: 20px;
    }

.news-list .item li .app {
	margin-bottom: 6px;
    }

.news-list .item li .app h5 {
	float: left;
	width: 360px;
	font-size: 15px;
    }

.news-list .item li .app h5 a {
	display: block;
	background: url(../images/spirit.gif) left -89px no-repeat;
	padding-left: 24px;
	width: 336px;
	-o-text-overflow:ellipsis;
	text-overflow:ellipsis;
	white-space:nowrap;
	overflow:hidden;
    }

.news-list .item li .app div {
	float: right;
	padding-top: 2px;
	font-size: 12px;
    }

.news-list .item li .app .category {
	float: left;
	display: block;
	background: url(../images/spirit.gif) left -53px no-repeat;
	margin-right: 10px;
	padding-left: 18px;
    }

.news-list .item li .app .date {
	float: left;
	background: url(../images/spirit.gif) left -70px no-repeat;
	padding-left: 18px;
	color: #aaa;
    }

/* ~~~~~~~~~~ NEWS STYLE ~~~~~~~~~~ */

.news .heading {
	margin-bottom: 30px;
    }

.news .heading h2 {
	border-bottom: 1px #bbb dotted;
	margin-bottom: 12px;
	padding-bottom: 14px;
	font-size: 15px;
	color: #333;
	line-height: 1.2;
    }

.news .heading p {
	position: relative;
    }

.news .heading p span {
	padding-right: 12px;
	font-size: 12px;
	color: #999;
    }

.news .heading p a {
	position: absolute;
	right: 0px;
    }

.news .description {
	color: #777;
	line-height: 1.6;
    }

.news .description .photo img {
	float: left;
	border: 1px #D0D0D0 solid;
	padding: 4px;
	margin-right: 12px;
    }

/* ~~~~~~~~~~ SIDEBAR STYLE ~~~~~~~~~~ */

.sidebar {
	float: right;
	width: 272px;
    }

.sidebar h3,
.article-class h3,
.article-list h3,
.news-list h3 {
	color: #666;
	line-height: 1.2;
	margin-bottom: 14px;
    }

.sidebar h3 p,
.article-class h3 p,
.article-list h3 p,
.news-list h3 p {
	float: left;
    }

.sidebar h3 a,
.article-class h3 a,
.article-list h3 a,
.news-list h3 a {
	background: url(../images/spirit.gif) 0 0 no-repeat;
	display: block;
	float: left;
	margin-left: 4px;
	width: 12px;
	height: 12px;
	text-indent: -9999px;
	margin-top: 2px;
    }

.home .sidebar .list {
	margin-top: 10px;
    }

.sidebar .list li {
	border-bottom: 1px #ddd dotted;
	margin-bottom: 8px;
	padding-bottom: 8px;
	line-height: 1.2;
    }

.sidebar .latest-news li span {
    display: inline-block;
    }

.sidebar .list li a {
	display: block;
	padding-left: 22px;
	width: 250px;
	-o-text-overflow:ellipsis;
	text-overflow:ellipsis;
	white-space:nowrap;
	overflow:hidden;
    }

.sidebar .latest-news li a {
	background: url(../images/spirit.gif) no-repeat;
	background-position: 0 -16px;
    }

.sidebar .magazine {
	margin-top: 34px;
    }

.sidebar .magazine a {
	background: url(../images/magazine.gif) no-repeat;
	display: block;
	height: 140px;
	text-indent: -9999px;
    }

.sidebar .magazine .eng {
	background-position: 0 0;
	margin-bottom: 6px;
    }

.sidebar .magazine .eng:hover {
	background-position: 0 -140px;
    }

.sidebar .magazine .jp {
	background-position: 0 -280px;
    }

.sidebar .magazine .jp:hover {
	background-position: 0 -420px;
    }

/* ~~~~~~~~~~ CONTACT STYLE ~~~~~~~~~~ */

.branch {
    float: left;
    padding-top: 20px;
    width: 320px;
    color: #555;
    }

.branch li {
	border-bottom: 1px #ddd dashed;
	margin-bottom: 16px;
	padding-bottom: 10px;
    }

.branch li.last {
	border-bottom: 0;
	margin-bottom: 0;
	padding-bottom: 0;
    }

.branch h5 {
	color: #666;
	position: relative;
	margin-bottom: 10px;
    }

.branch h5 a {
	background: url(../images/btn-map.gif) top no-repeat;
	width: 48px;
	height: 18px;
	position: absolute;
	right: 0px;
	top: -2px;
	text-indent: -9999em;
    }

.branch h5 a:hover {
	background: url(../images/btn-map.gif) bottom no-repeat;
    }

.branch .detail {
	background: url(../images/spirit.gif) no-repeat;
	padding-left: 24px;
	line-height: 1.4;
    }

.branch .phone {
	background-position: 0 -131px;
    }

.branch .fax {
	background-position: 0 -150px;
    }

.branch .address {
	background-position: 0 -171px;
    }

.contact-form {
	float: right;
	background: url(../images/contact-form.gif) left no-repeat;
	width: 410px;
	height: 520px;
	padding: 37px 0 0 40px;
    }

.contact-form h4 {
    margin-bottom: 20px;
    font-size: 15px;
    color: #777;
    line-height: 1.2;
    }

.contact-form .field {
	margin-bottom: 16px;
    }

.contact-form label {
    float: left;
    display: block;
    margin-right: 20px;
    width: 62px;
    font-weight: bold;
    line-height: 2;
    text-align: right;
    color: #555;
    }

.contact-form .text {
	float: left;
	border: 1px #dcdcdc solid;
	width: 260px;
	padding: 5px 4px;
	color: #999;
    }

.contact-form .text:focus {
	border: 1px #aaa solid;
    }

.contact-form .submit {
	background: #00A88D;
	border: 0;
	padding: 5px 0;
	width: 126px;
	font-weight: bold;
	color: #fff;
	cursor: pointer;
	margin-left: 82px;
    }

/* ~~~~~~~~~~ FOOTER STYLE ~~~~~~~~~~ */

.footer {
	border-top: 1px #eee solid;
	padding: 18px 0 40px;
	font-size: 12px;
	line-height: 1.2;
    }

.footer .copyright {
	float: left;
	margin-right: 16px;
	color: #aaa;
    }

.footer li {
	float: left;
	background: url(../images/solid.gif) no-repeat;
	background-position: right 4px;
	margin-right: 8px;
	padding-right: 8px;
    }

.footer li.last {
	background: none;
    }

.footer li a:hover {
	text-decoration: underline;
    }
    
/* ~~~~~~~~~~ ABOUT STYLE ~~~~~~~~~~ */
    
.hiddencontent {
	display:none;
	}

#tabs {
    float: left;
    width: 180px;
	}

#tabs li {
    margin-bottom: 6px;
	}

#tabs li a {
    background: url(../images/tabs-bg.gif) top no-repeat;
    display: block;
    padding: 12px 0 0 24px;
    height: 28px;
    font-weight: bold;
    color: #999;
    line-height: 1.2;
	}

#tabs li a:hover {
    background: url(../images/tabs-bg.gif) bottom no-repeat;
	}

#tabs li a.selected,
#tabs li a.selected:hover {
    background: url(../images/tabs-bg.gif) top no-repeat;
    color: #333;
    cursor: default;
	}

#about {
    float: right;
    width: 640px;
    color: #555;
	}

#about h3 {
    border-left: 8px #00A88D solid;
    margin-bottom: 20px;
    padding-left: 24px;
    font-size: 15px;
    color: #333;
    line-height: 1.4;
	}

#about .description {
    line-height: 1.6;
	}

#about .description p {
    margin-bottom: 14px;
	}

#about .description .photo {
    padding-top: 10px;
	}

#about .description .photo .left {
    float: left;
	}

#about .description .photo .right {
    float: right;
	}

#about .description .photo img {
    border: 6px #eee solid;
    padding: 4px;
	}

#about .description .strong span {
    color: #555;
    font-weight: bold;
	}

#about .description .ideal {
    border-bottom: 1px #ddd dotted;
    padding-bottom: 20px;
    margin-bottom: 20px;
	}

#about .description .ideal.last {
    border-bottom: 0;
    padding-bottom: 0;
    margin-bottom: 0;
	}


#about .description .ideal h4 {
    color: #555;
	}

#about .description .ideal h4 span {
    color: #999;
    padding-left: 10px;
	}

#about .history li {
    border-bottom: 1px #ddd dotted;
    margin-bottom: 10px;
    padding-bottom: 10px;
	}

#about .history li.last {
    border-bottom: 0;
    margin-bottom: 0;
    padding-bottom: 0;
	}

#about .history li .pic {
    float: left;
    margin-right: 16px;
	}
    
#about .history li div {
    float: left;
    padding-top: 6px;
	}

#about .history li p {
    margin-bottom: 0;
	}

#about .history li .years {
    color: #00A88D;
	}

/* ~~~~~~~~~~ SITEMAP STYLE ~~~~~~~~~~ */

.mapBlock {
    margin-bottom: 30px;
    padding-top: 10px;
	}

.mapBlock div {
    float: left;
    width: 256px;
    margin-right: 30px;
	}

.mapBlock div.last {
    margin-right: 0;
	}

.mapBlock div h3 {
    display: block;
    border-bottom: 1px #ccc dotted;
    margin-bottom: 16px;
    padding-bottom: 10px;
    font-size: 15px;
    line-height: 1.2;
	}

.mapBlock div ul {
    list-style-type: disc;
    padding-left: 16px;
	}

.mapBlock div ul li {
    margin-bottom: 10px;
    padding-left: 10px;
    font-weight: bold;
    color: #777;
	}