@charset "utf-8";

/* --------------------
 @Wellness.
 home pages css.
-------------------- */


/*
 **********div#attract**********[
----------------------------------------------------------- */

#attract {
	width: 960px;
	margin: 0 auto 40px;
	padding-top: 40px;
	font-size: 90%;
	line-height: 1.4;
}
#attract img {
	vertical-align: bottom;
}
#attract p {
	margin: 0 10px;
}
#attract h2 {
	font-weight:bold;
	height:36px;
	line-height:33px;
	margin:30px 0;
	overflow:hidden;
	padding-left:25px;
	text-shadow:1px 1px 0 #FFFFFF;
	background: url("/merit/img/h2_attract.gif") left top no-repeat;
}
#attract h3 {
	font-weight:bold;
	margin:30px 0;
	padding:0 0 10px 10px;
	border-bottom:2px solid #1090ba;
}
#attract h3 span {
	color: #1090ba;
	padding-right: 1em;
}

/*
 **********div#caseStudy**********[
----------------------------------------------------------- */

#caseStudy div.box {
	margin-right: -28px;
	min-height: 327px;
	height: auto !important;	/* ie6対策 */
	height: 327px;
	background: url("/merit/img/bg_attract_caseStudy.gif") 169px 20px no-repeat;
}
#caseStudy div.box dl {
	width: 464px;
	float: left;
	display: inline;
	margin: 0 28px 28px 0;
	border: 1px solid #d1d1d1;
	background: url("/merit/img/bg_merit_caseStudy_box.gif") left top repeat;
}
#caseStudy div.box dl dt {
	margin: 15px 15px 0;
}

#caseStudy div.box dl dd {
	width: 432px;
	margin: 15px auto;
	background: url("/merit/img/bg_attract_caseStudy_link.gif") left top repeat-x #0f82a7;
}
#caseStudy div.box dl dd a {
	display: block;
	width: 377px;	/* ie6対策 */
	line-height: 44px;
	padding-left: 55px;
	color: #fff;
	font-size: 100%;
	font-weight: bold;
	background: url("/merit/img/ic_arrow_white.gif") 20px center no-repeat;
}


/* ==========#problem========== */

#problem div.box {
	margin: 30px 0 0;
}
#problem div.box div {
	position: relative;
	width: 48%;
	float: left;
	display: inline;
	border:1px solid #D0D0D0;
	-moz-border-radius:4px 4px 4px 4px;
}
#problem div.box div.case_02 {
	float: right;
}
#problem div.box h4 span {
	position:absolute;
	top:-9px;
	left:5px;
	display:block;
	height:0;
	padding-top:15px;
	overflow:hidden;
}
#problem div  ul {
	padding: 15px 10px 10px 15px;
}
#problem div ul li {
	line-height: 20px;
	padding-left: 20px;
	background: url("/common/img/share/icon/ic_list_gray.gif") left center no-repeat;
}
#problem div ul li.last {
	background: none;
	text-align: right;
	padding: 0 0 0 20px;
}


#problem div.case_01 h4 span { width: 100px; background: url("/merit/img/h4_attract_problem.gif") left top no-repeat;}
#problem div.case_02 h4 span { width: 105px; background: url("/merit/img/h4_attract_problem.gif") left -17px no-repeat;}


/* ==========#proposal[#caseStudy_01]========== */

#proposal {
	margin: 50px 0 0 0;
}

#caseStudy_01 {
	margin: 0 0 70px 0;
}
#caseStudy_01 p.image {
	text-align: center;
}
#caseStudy_01 p.comment {
	background-color: #f3f3f3;
	margin-top: 20px;
	padding: 10px;
}

#caseStudy_01 ul {
	margin: 30px 2px 30px 10px;
}
#caseStudy_01 ul li {
	width: 150px;
	float: left;
	display: inline;
	margin-right: 8px;
}
#caseStudy_01 ul li a {
	display: block;
	height: 0;
	padding-top: 50px;
	overflow: hidden;
}
#caseStudy_01 ul li.corporate a { background: url("/merit/img/bg_merit_link.gif") left top no-repeat;}
#caseStudy_01 ul li.corporate a:hover { background: url("/merit/img/bg_merit_link.gif") left -49px no-repeat;}
#caseStudy_01 ul li.mobile a { background: url("/merit/img/bg_merit_link.gif") -149px top no-repeat;}
#caseStudy_01 ul li.mobile a:hover { background: url("/merit/img/bg_merit_link.gif") -149px -49px no-repeat;}
#caseStudy_01 ul li.cms a { background: url("/merit/img/bg_merit_link.gif") -298px top no-repeat;}
#caseStudy_01 ul li.cms a:hover { background: url("/merit/img/bg_merit_link.gif") -298px -49px no-repeat;}
#caseStudy_01 ul li.social a { background: url("/merit/img/bg_merit_link.gif") -447px top no-repeat;}
#caseStudy_01 ul li.social a:hover { background: url("/merit/img/bg_merit_link.gif") -447px -49px no-repeat;}
#caseStudy_01 ul li.program a { background: url("/merit/img/bg_merit_link.gif") -596px top no-repeat;}
#caseStudy_01 ul li.program a:hover { background: url("/merit/img/bg_merit_link.gif") -596px -49px no-repeat;}
#caseStudy_01 ul li.other a { background: url("/merit/img/bg_merit_link.gif") -745px top no-repeat;}
#caseStudy_01 ul li.other a:hover { background: url("/merit/img/bg_merit_link.gif") -745px -49px no-repeat;}
#caseStudy_01 ul li.strategy a { background: url("/merit/img/bg_merit_link.gif") -894px top no-repeat;}
#caseStudy_01 ul li.strategy a:hover { background: url("/merit/img/bg_merit_link.gif") -894px -49px no-repeat;}


/* ==========#proposal[#caseStudy_02]========== */

#caseStudy_02 {
	position: relative;
	width: 960px;
}
#caseStudy_02 p.pageTop {
	position: absolute;
	right: 0;
	top: -50px;
	margin: 0;
	padding: 0 0 1px 71px;
	background: url("/common/img/share/bg_pageTop_border.gif") right bottom no-repeat;
}
#caseStudy_02 div.accessLog {
	margin: 30px 0 50px;
	background: url("/merit/img/im_attract_proposal_caseStudy_02.gif") left top no-repeat;
}
#caseStudy_02 div.accessLog div {
	position: relative;
	margin: 0 0 20px 52%;
	width: 48%;
	border:1px solid #D0D0D0;
	-moz-border-radius:4px 4px 4px 4px;
}
#caseStudy_02 div.accessLog h4 span {
	position:absolute;
	top:-9px;
	left:5px;
	display:block;
	height:0;
	padding-top:15px;
	overflow:hidden;
}
#caseStudy_02 div div.secession h4 span { width: 308px; background: url("/merit/img/h4_attract_caseStudy_02.gif") left top no-repeat;}
#caseStudy_02 div div.cause h4 span { width: 156px; background: url("/merit/img/h4_attract_caseStudy_02.gif") left -17px no-repeat;}


#caseStudy_02 div.accessLog div.secession p {
	text-align: center;
	padding: 25px 0 15px;
}

#caseStudy_02 div.accessLog div ul {
	padding: 15px 10px 10px 15px;
}
#caseStudy_02 div.accessLog div ul li {
	line-height: 20px;
	padding-left: 20px;
	background: url("/common/img/share/icon/ic_list_blue.gif") left center no-repeat;
}
#caseStudy_02 div.accessLog div ul li.last {
	background: none;
	text-align: right;
	padding: 0 0 0 20px;
}


/* .accessibility */

#caseStudy_02 div.accessibility,
#caseStudy_02 div.usability {
	position: relative;
	width: 48%;
	float: left;
	margin: 30px 0 20px;
	border:1px solid #D0D0D0;
	-moz-border-radius:4px 4px 4px 4px;
}
#caseStudy_02 div.usability {
	float: right;
}
#caseStudy_02 div.accessibility p,
#caseStudy_02 div.usability ul {
	padding: 15px 10px 10px 15px;
}
#caseStudy_02 div.accessibility p.comment {
	padding: 0;
	margin: 5px 10px 15px;
	text-align: center;
	font-size: 85%;
}
#caseStudy_02 div.accessibility h4 span,
#caseStudy_02 div.usability h4 span {
	position:absolute;
	top:-9px;
	left:5px;
	display:block;
	height:0;
	padding-top:15px;
	overflow:hidden;
}

#caseStudy_02 div.accessibility h4 span { width: 137px; background: url("/merit/img/h4_attract_caseStudy_02.gif") left -34px no-repeat; }
#caseStudy_02 div.usability h4 span { width: 129px; background: url("/merit/img/h4_attract_caseStudy_02.gif") left -51px no-repeat; }

#caseStudy_02 div.usability ul li {
	line-height: 20px;
	padding-left: 20px;
	background: url("/common/img/share/icon/ic_list_blue.gif") left center no-repeat;
}
#caseStudy_02 div.usability ul li.last {
	background: none;
	text-align: right;
	padding: 0 0 0 20px;
	padding-bottom: 30px;
}
#caseStudy_02 div.link {
	margin: 10px auto 0;
	padding-bottom: 30px;
}

#caseStudy_02 div p.link {
	width: 317px;
	float: left;
	display: inline;
	margin: 9px 35px 0 145px;
}
#caseStudy_02 div p.form {
	width: 265px;
	float: left;
	display: inline;
	margin: 0;
}