﻿@charset "UTF-8";

/*//////////////////////////////////////////////////

Title			: top.css
For				: Setting base styles of the site


Created			: 2009-04-15
Last Modified	: 2011-02-24

----------------------------------------

Content

		1. Main frame

//////////////////////////////////////////////////*/


/* ---------------------------------------

        0. Container TOP

   ---------------------------------------- */


#contentsContainerTop {
	width: 950px;
	height:100%;
	margin: 10px 0 30px;
}



/* ---------------------------------------

		1. Flash Area

   ---------------------------------------- */

#contentsContainerTop #flashAreaTop {
	width:950px;
	height:290px;
	margin-top: 10px;
}



/* ---------------------------------------

		2. Contents Top

   ---------------------------------------- */

#contentsContainerTop #contentsTop {
	position: relative;
	width: 950px;
	height: 100%;
	/*margin: 28px 0 0;*/
	background: url(/shared/images/bg_banner_ohsmtr.gif) repeat-y right top;
}


/* 2-1. Banner Area Top
------------------------------- */

#contentsContainerTop #contentsTop img#bannerFrameTop {
	position: absolute;
	right: 0;
	top: 0;
	z-index: 1;
}

#contentsContainerTop #contentsTop img#bannerFrameBtm {
	position: absolute;
	right: 0;
	bottom: 0;
	z-index: 1;
}

#contentsContainerTop #contentsTop #bannerAreaTop {
	float: right;
	width: 160px;
	margin: 2px 0;
	padding: 5px;
}

#contentsContainerTop #contentsTop #bannerAreaTop img {
	margin-bottom: 5px;
}


/* 2-2. Main Contents Top
------------------------------- */


#contentsContainerTop #contentsTop #mainContensTop {
	float: left;
	width: 750px;
}

/* Special Point Ohisama */

#contentsContainerTop #contentsTop #mainContensTop #specialPointOhisama {
	width: 750px;
}

#contentsContainerTop #contentsTop #mainContensTop #specialPointOhisama h2 {
	position: relative;
	width: 750px;
	height: 48px;
}

#contentsContainerTop #contentsTop #mainContensTop #specialPointOhisama h2 img#popAsked {
	position: absolute;
	left: 40px;
	top: -22px;
	z-index: 1;
}

#contentsContainerTop #contentsTop #mainContensTop #specialPointOhisama #specialPointInner {
	width: 750px;
	background: url(/images/bg_top_01.gif) repeat-y left top;
}

#contentsContainerTop #contentsTop #mainContensTop #specialPointOhisama #specialPointInner .spclCategory {
	float: left;
	background: url(/images/line_top_hgt2.gif) repeat-y right top;
}

#contentsContainerTop #contentsTop #mainContensTop #specialPointOhisama #specialPointInner .spclCategory h3,
#contentsContainerTop #contentsTop #mainContensTop #specialPointOhisama #specialPointInner .coziness h3 {
	margin-left: 2px;
}

#contentsContainerTop #contentsTop #mainContensTop #specialPointOhisama #specialPointInner .spclCategory .onesArea,
#contentsContainerTop #contentsTop #mainContensTop #specialPointOhisama #specialPointInner .coziness .onesArea {
	margin-top: 20px;
}

#contentsContainerTop #contentsTop #mainContensTop #specialPointOhisama #specialPointInner .spclCategory .spclFace,
#contentsContainerTop #contentsTop #mainContensTop #specialPointOhisama #specialPointInner .coziness .spclFace {
	float: left;
	margin-right: 7px;
}

#contentsContainerTop #contentsTop #mainContensTop #specialPointOhisama #specialPointInner .spclCategory .spclComment,
#contentsContainerTop #contentsTop #mainContensTop #specialPointOhisama #specialPointInner .coziness .spclComment {
	position: relative;
	min-height: 127px !important;
	height: 127px;
}

#contentsContainerTop #contentsTop #mainContensTop #specialPointOhisama #specialPointInner .spclCategory .spclComment h4 {
	margin: 0 0 16px 2px;
}

#contentsContainerTop #contentsTop #mainContensTop #specialPointOhisama #specialPointInner .spclCategory .spclComment img.iconSpcl,
#contentsContainerTop #contentsTop #mainContensTop #specialPointOhisama #specialPointInner .coziness .spclComment img.iconSpc {
	margin: 0 0 6px 1px;
}

#contentsContainerTop #contentsTop #mainContensTop #specialPointOhisama #specialPointInner .spclCategory .spclComment p.onesComment,
#contentsContainerTop #contentsTop #mainContensTop #specialPointOhisama #specialPointInner .coziness .spclComment p.onesComment {
	margin-top: 11px;
}

#contentsContainerTop #contentsTop #mainContensTop #specialPointOhisama #specialPointInner .spclCategory .spclComment p span {
	margin-left: 5px;
	line-height: 123%;
}

#contentsContainerTop #contentsTop #mainContensTop #specialPointOhisama #specialPointInner .spclCategory .spclComment a.readMoreTop,
#contentsContainerTop #contentsTop #mainContensTop #specialPointOhisama #specialPointInner .coziness .spclComment a.readMoreTop {
	display: block;
	position: absolute;
	right: 0;
	bottom: 0;
}

#contentsContainerTop #contentsTop #mainContensTop #specialPointOhisama #specialPointInner .capacity {
	width: 248px !important;
	width: 247px;
}

#contentsContainerTop #contentsTop #mainContensTop #specialPointOhisama #specialPointInner .capacity .capacityInner {
	margin: 0 11px 0 20px;
}

#contentsContainerTop #contentsTop #mainContensTop #specialPointOhisama #specialPointInner .consult {
	width: 255px !important;
	width: 254px;
}

#contentsContainerTop #contentsTop #mainContensTop #specialPointOhisama #specialPointInner .consult .consultInner {
	margin: 0 11px 0 10px;
}

#contentsContainerTop #contentsTop #mainContensTop #specialPointOhisama #specialPointInner .coziness {
	float: right;
	width: 247px !important;
	width: 246px;
	background: none;
}

#contentsContainerTop #contentsTop #mainContensTop #specialPointOhisama #specialPointInner .coziness .cozinessInner {
	margin: 0 20px 0 10px;
}


/* Arrival */

#contentsContainerTop #contentsTop #mainContensTop #multiArrival {
	float: left;
	width: 424px;
	margin-top: 20px;
}

#contentsContainerTop #contentsTop #mainContensTop #multiArrival h2 {
	width: 424px;
	height: 22px;
}

#contentsContainerTop #contentsTop #mainContensTop #multiArrival h2 img.arrivalTitle {
	margin-left: 2px;
}

#contentsContainerTop #contentsTop #mainContensTop #multiArrival .arrivalArticle {
	width: 424px;
	padding: 12px 0 10px;
	background: url(/shared/images/line_dot_f6_w2.gif) repeat-x left bottom;
}

#contentsContainerTop #contentsTop #mainContensTop #multiArrival .arrivalArticle span {
	display: block;
	width: 416px;
	margin: 0 4px;
}

#contentsContainerTop #contentsTop #mainContensTop #multiArrival .arrivalArticle span.arrivalHead {
	padding-left: 18px;
	line-height: 125%;
}

#contentsContainerTop #contentsTop #mainContensTop #multiArrival .arrivalArticle a {
	display: block;
}

#contentsContainerTop #contentsTop #mainContensTop #multiArrival #contentsArrival {
	width: 424px;
	margin-bottom: 18px;
}

#contentsContainerTop #contentsTop #mainContensTop #multiArrival #contentsArrival h2 {
	position: relative;
	border-bottom: 2px solid #76a176;
}

#contentsContainerTop #contentsTop #mainContensTop #multiArrival #contentsArrival h2 span#announceRss {
	position: absolute;
	right: 0;
	bottom: 4px;
	vertical-align: middle;
}

#contentsContainerTop #contentsTop #mainContensTop #multiArrival #contentsArrival h2 span#announceRss a:hover {
	color: #2d6e2d;
}

#contentsContainerTop #contentsTop #mainContensTop #multiArrival #contentsArrival h2 span#announceRss span {
	padding: 0 4px 0 0;
	font-size: 80%;
	vertical-align: middle;
}

#contentsContainerTop #contentsTop #mainContensTop #multiArrival #contentsArrival .arrivalArticle span.arrivalDate span {
	padding-left: 18px;
	background: url(/shared/images/icon_link_arrow_01.gif) no-repeat left center;
}

#contentsContainerTop #contentsTop #mainContensTop #multiArrival #contentsArrival .arrivalArticle a:hover {
	color: #2d6e2d;
}

#contentsContainerTop #contentsTop #mainContensTop #multiArrival #blogArrival {
	width: 424px;
}

#contentsContainerTop #contentsTop #mainContensTop #multiArrival #blogArrival h2 {
	border-bottom: 2px solid #e89a9a;
}

#contentsContainerTop #contentsTop #mainContensTop #multiArrival #blogArrival .arrivalArticle span.arrivalDate span {
	padding-left: 18px;
	background: url(/shared/images/icon_link_arrow_02.gif) no-repeat left center;
}

#contentsContainerTop #contentsTop #mainContensTop #multiArrival #blogArrival .arrivalArticle a:hover {
	color: #e67373;
}

/* Life Ohisama */

#contentsContainerTop #contentsTop #mainContensTop #lifeOhisamaTop {
	float: right;
	width: 297px;
	margin-top: 20px;
	background: url(/images/bg_top_02.gif) repeat-y right top;
}

#contentsContainerTop #contentsTop #mainContensTop #lifeOhisamaTop h2 {
	margin: 11px 12px;
}

#contentsContainerTop #contentsTop #mainContensTop #lifeOhisamaTop #leadLife {
	position: relative;
	width: 273px;
	height: 188px;
	margin-left: 12px;
	background: url(/images/bg_top_02_i.gif) no-repeat right top;
}

#contentsContainerTop #contentsTop #mainContensTop #lifeOhisamaTop #leadLife img {
	position: absolute;
}

#contentsContainerTop #contentsTop #mainContensTop #lifeOhisamaTop #leadLife img#leadTextLife {
	left: 8px;
	top: 0;
}

#contentsContainerTop #contentsTop #mainContensTop #lifeOhisamaTop #leadLife img#leadPopLife {
	left: 3px;
	top: 57px;
}

#contentsContainerTop #contentsTop #mainContensTop #lifeOhisamaTop #leadLife img#leadBtnLife {
	left: 60px;
	top: 74px;
}

#contentsContainerTop #contentsTop #mainContensTop #lifeOhisamaTop #leadLife img#linkLetoit {
	left: 0;
	top: 128px;
}

#contentsContainerTop #contentsTop #mainContensTop #lifeOhisamaTop #upInfoLife {
	position: relative;
	width: 273px;
	margin: 0 0 8px 12px;
	background-color: #fbfbf5;
}

#contentsContainerTop #contentsTop #mainContensTop #lifeOhisamaTop #upInfoLife h3 {
	position: absolute;
	right: 4px;
	top: -19px;
}

#contentsContainerTop #contentsTop #mainContensTop #lifeOhisamaTop #upInfoLife #upLifeInner {
	margin: 0 5px 0 8px;
	padding: 9px 0 6px;
}

#contentsContainerTop #contentsTop #mainContensTop #lifeOhisamaTop #upInfoLife #upLifeInner p {
	width: 250px;
	padding: 8px 5px 7px;
	background: url(/images/line_top_w2.gif) repeat-x right bottom;
}

#contentsContainerTop #contentsTop #mainContensTop #lifeOhisamaTop #upInfoLife #upLifeInner p.OldestLife {
	background: none;
}

#contentsContainerTop #contentsTop #mainContensTop #lifeOhisamaTop #upInfoLife #upLifeInner p span {
	display: block;
}

#contentsContainerTop #contentsTop #mainContensTop #lifeOhisamaTop #upInfoLife #upLifeInner a {
	color: #000000;
}

#contentsContainerTop #contentsTop #mainContensTop #lifeOhisamaTop #upInfoLife #upLifeInner a:hover {
	color:#ef9120;
	text-decoration: underline;
}

/* Lecture Doctor */

#contentsContainerTop #contentsTop #mainContensTop #lectureDoctorTop {
	position: relative;
	width: 750px;
	height: 272px;
	margin-top: 25px;
	background: url(/images/bg_top_03.gif) no-repeat left bottom;
}

#contentsContainerTop #contentsTop #mainContensTop #lectureDoctorTop img#doctorTop {
	position: absolute;
	right: -1px;
	bottom: -10px;
	z-index: 3;
}

#contentsContainerTop #contentsTop #mainContensTop #lectureDoctorTop a {
	display: block;
	position:absolute;
	z-index: 1;
}

#contentsContainerTop #contentsTop #mainContensTop #lectureDoctorTop a#lecBtn01 {
	left: 9px;
	top: 43px
} 

#contentsContainerTop #contentsTop #mainContensTop #lectureDoctorTop a#lecBtn02 {
	left: 214px;
	top: 43px
} 

#contentsContainerTop #contentsTop #mainContensTop #lectureDoctorTop a#lecBtn03 {
	left: 214px;
	top: 143px
} 

#contentsContainerTop #contentsTop #mainContensTop #lectureDoctorTop a#lecBtn04 {
	left: 398px;
	top: 43px
} 

#contentsContainerTop #contentsTop #mainContensTop #lectureDoctorTop a#lecBtn05 {
	left: 398px;
	top: 143px
} 

#contentsContainerTop #contentsTop #mainContensTop #lectureDoctorTop a#lecBtn06 {
	left: 592px;
	top: 86px
}

#contentsContainerTop #contentsTop #mainContensTop #lectureDoctorTop a:hover {
	z-index: 2;
}

/* Banners 2009.12.04 */

#highlightContainer {
	padding: 2px 0 10px;
}

#highlightContainer .simulationBnr {
	float: left;
}

#highlightContainer .haakuBnr {
	float: right;
	padding-top: 11px;
}

/* 2010.07.29 */

/*#contentsContainerTop #contentsTop #mainContensTop #doubleInterview {
	width: 750px;
	height: 389px;
	background: url(/images/bg_top_double.gif) no-repeat left bottom;
}

#contentsContainerTop #contentsTop #mainContensTop #doubleInterview h2 {
	margin-bottom: 9px;
}

#contentsContainerTop #contentsTop #mainContensTop #doubleInterview .doubleW {
	width: 735px;
	height: 158px;
	margin: 0 0 0 12px;
	overflow: hidden;
	/zoom: 1;
}

#contentsContainerTop #contentsTop #mainContensTop #doubleInterview .inner {
	float: left;
	width: 236px;
	height: 148px;
	margin-right: 9px;
	background: url(/images/bg_top_double_inner.gif) no-repeat 0 0;
	overflow: hidden;
	/zoom: 1;
}

#contentsContainerTop #contentsTop #mainContensTop #doubleInterview .inner.pLtR .comment {
	float: right;
	width: 137px;
	margin-left: 9px;
	padding-top: 10px;
}

#contentsContainerTop #contentsTop #mainContensTop #doubleInterview .inner.pRtL .comment {
	float: left;
	width: 137px;
	margin-right: 9px;
	padding-top: 10px;
	text-align: right;
}

#contentsContainerTop #contentsTop #mainContensTop #doubleInterview .inner.pLtR .photo {
	padding-top: 10px;
	text-align: right;
}

#contentsContainerTop #contentsTop #mainContensTop #doubleInterview .inner.pRtL .photo {
	padding-top: 10px;
}

#contentsContainerTop #contentsTop #mainContensTop #doubleInterview .inner.h158 {
	float: right;
	width: 245px;
	height: 158px;
	margin-right: 0;
	background: url(/images/bg_top_double_inner_l.gif) no-repeat 0 0;
}*/

#contentsContainerTop #contentsTop #mainContensTop #energySelfOp { position: relative; }
#contentsContainerTop #contentsTop #mainContensTop #energySelfOp .btn {  position: absolute; top: 137px; left: 587px; }

#contentsContainerTop #contentsTop #mainContensTop #shNav { position: relative; margin: 20px 0 0; }
#contentsContainerTop #contentsTop #mainContensTop #shNav .btn {  position: absolute; top: 164px; left: 347px; }



/* himituInterview */

#contentsContainerTop #contentsTop #mainContensTop #himituInterview {
	position: relative;
	width: 750px;
	height: 370px;
	background: url(/images/bg_top_himitu.jpg) no-repeat left bottom;
	margin: 30px 0 0;
}

#contentsContainerTop #contentsTop #mainContensTop #himituInterview h2 {
	position: absolute;
	top: 17px;
	left: 27px;
}

#contentsContainerTop #contentsTop #mainContensTop #himituInterview p#himituLead {
	position: absolute;
	top: 69px;
	left: 24px;
}

#contentsContainerTop #contentsTop #mainContensTop #himituInterview p#himituBalloon {
	position: absolute;
	top: 59px;
	left: 521px;
}

#contentsContainerTop #contentsTop #mainContensTop #himituInterview #himituAll {
	position: absolute;
	top: 134px;
	left: 24px;
	width: 506px;
	height: 80px;
}

#contentsContainerTop #contentsTop #mainContensTop #himituInterview #himituAll h3 {
	position: absolute;
	top: 13px;
	left: 6px;
}

#contentsContainerTop #contentsTop #mainContensTop #himituInterview #himituAll p {
	position: absolute;
	top: 43px;
	left: 365px;
}

#contentsContainerTop #contentsTop #mainContensTop #himituInterview #himituArea {
	position: absolute;
	top: 224px;
	left: 24px;
	width: 506px;
	height: 122px;
}

#contentsContainerTop #contentsTop #mainContensTop #himituInterview #himituArea h3 {
	position: absolute;
	top: 11px;
	left: 3px;
}

#contentsContainerTop #contentsTop #mainContensTop #himituInterview #himituArea ul {
	position: absolute;
	top: 43px;
	left: 69px;
}

#contentsContainerTop #contentsTop #mainContensTop #himituInterview #himituArea ul li {
	float: left;
	padding: 0 5px 5px 0;
	line-height: 100%;
	font-size: 0px;
}

#contentsContainerTop #contentsTop #mainContensTop #himituInterview #himituMember {
	position: absolute;
	top: 286px;
	left: 542px;
	width: 506px;
	height: 122px;
}

