@charset "utf-8";

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

Name: wide_module.css

Description: Setting of content module for Case Studies page

Create: 2012.12.17
Update: 2014.03.XX

Copyright 2014 Hitachi, Ltd.

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



/* content===========================================

[c1] Page title
[c2] Social buttons
[c3] Controller
[c4] Controller Drop Down
[c5] Grid View
[c6] Map View
[c7] List View
[c8] Cover Story
[c9] Preview
[c21] Page Top Link
[c24] Banner Area

===================================================== */



/* [c1] Page title
=========================================================================================== */

#CsPageTitle {
width: 965px;
height: 58px;
background: url("/case_studies/image/page_title.gif") no-repeat 0 0;
}

#CsPageTitle h1 {
float: left;
width: 540px;
text-indent: -9999px;
}

#CsPageTitle ul#CsShareButtons {
float: right;
width: 415px;
padding-top: 20px;
}

#CsPageTitle ul#CsShareButtons li {
float: right;
width: 105px;
}

#CsPageTitle ul#CsShareButtons li.CsGplus {
width: 85px;
}

#CsPageTitle ul#CsShareButtons li.CsIn {
width: 120px;
}

#CsPageTitle ul#CsShareButtons li iframe.twitter-share-button {
width: 105px !important;
}


/* [c3] Controller
=========================================================================================== */

.Grid4 {
position: relative;
}

#CsController {
display: none;
position: absolute;
top: 58px;
width: 965px;
height: 60px;
z-index: 1001;
}

.CsJsOn #CsController {
display: block;
}

#CsController.CsFixed {
position: fixed;
top: 0;
}

#CsController dl {
position: relative;
width: 965px;
height: 60px;
background: url("/case_studies/image/bg_controller.gif") repeat-x 0 0;
}

#CsController dl dt {
position: absolute;
height: 60px;
background-image: url("/case_studies/image/btn_controller.gif");
background-repeat: no-repeat;
text-indent: -9999px;
z-index: 1002;
}

#CsController dl dt#CsCtrlTitle1 {
left: 0;
top: 0;
width: 60px;
background-position: 0 0;
}

#CsController dl dt#CsCtrlTitle2 {
left: 423px;
top: 0;
width: 50px;
background-position: -423px 0;
}

#CsController dl dt#CsCtrlTitle3 {
left: 662px;
top: 0;
width: 55px;
background-position: -662px 0;
}

#CsController dl dd {
position: absolute;
height: 60px;
z-index: 1003;
}

#CsController dl dd#CsCtrlButtons1 {
left: 60px;
top: 0;
width: 363px;
}

#CsController dl dd#CsCtrlButtons2 {
left: 492px;
top: 16px;
width: 136px;
height: 27px;
}

#CsController dl dd#CsCtrlButtons3 {
display: none;
left: 727px;
top: 0;
width: 228px;
}

#CsController dl dd#CsCtrlButtons1 li,
#CsController dl dd#CsCtrlButtons3 li {
display: inline;
float: left;
}

#CsController dl dd#CsCtrlButtons1 li a,
#CsController dl dd#CsCtrlButtons3 li a {
display: block;
height: 60px;
background-image: url("/case_studies/image/btn_controller.gif");
background-repeat: no-repeat;
outline: 0;
text-indent: -9999px;
}

#CsController dl dd li a#CsFilter1 { width: 100px; background-position: -60px 0; }
#CsController dl dd li a#CsFilter1:hover,
#CsController dl dd li a#CsFilter1.CsSelected { background-position: -60px -60px; }

#CsController dl dd li a#CsFilter2 { width: 80px; background-position: -160px 0; }
#CsController dl dd li a#CsFilter2:hover,
#CsController dl dd li a#CsFilter2.CsSelected { background-position: -160px -60px; }

#CsController dl dd li a#CsFilter3 { width: 87px; background-position: -240px 0; }
#CsController dl dd li a#CsFilter3:hover,
#CsController dl dd li a#CsFilter3.CsSelected { background-position: -240px -60px; }

#CsController dl dd li a#CsFilter4 { width: 96px; background-position: -327px 0; }
#CsController dl dd li a#CsFilter4:hover,
#CsController dl dd li a#CsFilter4.CsSelected { background-position: -327px -60px; }

#CsController dl dd li a#CsView1 { width: 66px; margin-right: 10px; background-position: -727px 0; }
#CsController dl dd li a#CsView1:hover,
#CsController dl dd li a#CsView1.CsSelected { background-position: -727px -60px; }

#CsController dl dd li a#CsView2 { width: 66px; margin-right: 10px; background-position: -802px 0; }
#CsController dl dd li a#CsView2:hover,
#CsController dl dd li a#CsView2.CsSelected { background-position: -802px -60px; }

#CsController dl dd li a#CsView3 { width: 66px; background-position: -876px 0; }
#CsController dl dd li a#CsView3:hover,
#CsController dl dd li a#CsView3.CsSelected { background-position: -876px -60px; }

#CsSortButton {
position: relative;
display: block;
width: 136px;
height: 27px;
background: url("/case_studies/image/btn_sort.gif") no-repeat 0 0;
outline: 0;
text-indent: -9999px;
}

ul#CsSortDropDown {
display: none;
position: absolute;
left: 0;
top: 21px;
width: 136px;
padding-top: 9px;
background: #9b9b9b url("/case_studies/image/btn_sort_dropdown.gif") no-repeat;
box-shadow: 0 4px 6px rgba(0,0,0,.5);
-moz-box-shadow: 0 4px 6px rgba(0,0,0,.5);
-webkit-box-shadow: 0 4px 6px rgba(0,0,0,.5);
}

ul#CsSortDropDown li a {
display: block;
width: 136px;
height: 30px;
background-image: url("/case_studies/image/btn_sort_dropdown.gif");
background-repeat: no-repeat;
outline: 0;
text-indent: -9999px;
}

ul#CsSortDropDown li a#CsSort0 { background-position: 0 -8px; }
ul#CsSortDropDown li a#CsSort0:hover,
ul#CsSortDropDown li a#CsSort0.CsSelected { background-position: -136px -8px; }

ul#CsSortDropDown li a#CsSort1 { background-position: 0 -38px; }
ul#CsSortDropDown li a#CsSort1:hover,
ul#CsSortDropDown li a#CsSort1.CsSelected { background-position: -136px -38px; }

ul#CsSortDropDown li a#CsSort2 { background-position: 0 -68px; }
ul#CsSortDropDown li a#CsSort2:hover,
ul#CsSortDropDown li a#CsSort2.CsSelected { background-position: -136px -68px; }

#CsCtrlHead {
	display: none;
	height: 52px;
	padding: 0 20px 0 35px;
	background-color: #3e3a39;
}

#CsCtrlHead #CsCtrlHeadTitle {
	float: left;
	padding-right: 20px;
}

#CsCtrlHead #CsCtrlHeadTitle p {
	color: #fff;
	font-size: 138.5%;
	line-height: 52px;
}

#CsCtrlHead #CsCtrlHeadTitle p span {
	color: #fff;
	font-size: 60%;
}

#CsCtrlHead #CsCtrlHeadClose {
	float: left;
	width: 123px;
	padding-top: 12px;
}

#CsCtrlHead #CsCtrlHeadClose a {
display: block;
width: 123px;
height: 28px;
background-image: url("/case_studies/image/btn_clear_selection.gif");
background-repeat: no-repeat;
background-position: 0 0;
outline: 0;
text-indent: -9999px;
}

#CsCtrlHead #CsCtrlHeadClose a:hover {
background-position: 0 -28px;
}



/* [c4] Controller Drop Down
=========================================================================================== */

#CsCtrlDropDownBg {
display: none;
position: fixed;
width: 100%;
height: 100%;
top: 0;
left: 0;
z-index: 1000;
}

.CsCtrlDropDown {
position: absolute;
display: none;
width: 965px;
top: 60px;
left: 0;
z-index: 1004;
background-color: #3e3a39;
}

.CsCtrlDropDownInner {
width: 965px;
padding: 20px 0;
}

.CsCtrlDropDownInner ul {
float: left;
width: 193px;
min-height: 293px;
height: auto !important;
height: 293px;
color: #fff;
background: url('/case_studies/image/bg_ctrl_dropdown.gif') repeat-y;
}

.CsCtrlDropDownInner ul.FirstItem {
background-image: none;
}

.CsCtrlDropDownInner ul li {
padding: 20px 10px 0 20px;
line-height: 140%;
font-size: 83%;
font-weight: bold;
}

.CsCtrlDropDownInner ul li.CsSubCategory {
padding-top: 5px;
font-size: 75%;
font-weight: normal;
}

.CsCtrlDropDownInner ul li a {color: #fff; text-decoration: none;}
.CsCtrlDropDownInner ul li a:hover,
.CsCtrlDropDownInner ul li a:active {color: #fff; text-decoration: underline;}

.CsCtrlDropDownInner ul li a span {
color: #fff;
}



/* [c5] Grid View
=========================================================================================== */

#CsBody {
position: relative;
margin-bottom: 20px;
background-color: #e6e6e6;
}

.CsJsOn #CsBody {
margin-top: 60px;
}

#CsBody.CsFiltered {
margin-top: 112px;
}

#CsGridView {
padding-bottom: 16px;
}

#CsGridView #CsGridViewBody {
margin-left: 16px;
}

.jsOn #CsGridView #CsGridViewBody {
visibility: hidden;
}

.CsBox {
position: relative;
float: left;
width: 220px;
margin: 15px 15px 0 0;
border: solid 1px #d0d0d0;
}

.CsBox .CsBoxNew {
position: absolute;
top: 8px;
right: 8px;
width: 34px;
height: 16px;
}

.CsBox .CsBoxRank {
display: none;
position: absolute;
top: 0;
left: 0;
width: 30px;
height: 30px;
}

.CsSortByView .CsBox .CsBoxRank {
display: block;
}

.CsBox .CsBoxMainArea {
width: 220px;
}

.CsJsOn .CsBox .CsBoxMainArea {
cursor: pointer;
}

.CsBox .CsBoxMainArea .CsBoxImageArea {
height: 137px;
}

.CsBox .CsBoxMainArea .CsBoxImageArea .CsBoxImageList,
.CsBox .CsBoxMainArea .CsBoxImageArea .CsBoxImagePreview {
display: none;
}

.CsBox .CsBoxMainArea .CsBoxTextArea {
height: 9em;
background-color: #fff;
border-bottom: solid 1px #d0d0d0;
overflow: hidden;
}

.CsJsOn .CsBox .CsBoxMainArea .CsBoxTextArea {
height: 6.5em;
/*height: 5.8em;*/
}

.CsBox .CsBoxMainArea .CsBoxTextArea h2 {
margin: 0;
padding: 8px 10px 5px;
border-top-style: none;
background: none;
font-size: 85%;
font-weight: bold;
line-height: 130%;
color: #202020;
}

.CsBox .CsBoxMainArea .CsBoxTextArea h2.CsHover {
color: #b1000e;
text-decoration: underline;
}

.CsBox .CsBoxMainArea .CsBoxTextArea p.CsBoxTextLead {
padding: 0 10px;
font-size: 77%;
color: #707070;
line-height: 130%;
}

.CsBox .CsBoxMainArea .CsBoxTextArea p.CsBoxTextBody {
display: none;
}

.CsBox .CsBoxDataArea {
width: 220px;
background: url('/case_studies/image/bg_data_area.gif') repeat-x #f0f0f0;
}


.CsBox .CsBoxDataArea ul.CsBoxTag {
height: 3em;
padding: 8px 10px 0 10px;
line-height: 130%;

/*
border-bottom: solid 1px #d0d0d0;
*/
overflow: hidden;
}

.CsBox .CsBoxDataArea ul.CsBoxTag li {
display: inline;
line-height: 130%;

}

.CsBox .CsBoxDataArea ul.CsBoxTag li a {
margin-right: 10px;
padding-left: 17px;
background: url('/case_studies/image/icon_tag.gif') no-repeat 0 4px;
font-size: 77%;
line-height: 130%;
}

.CsBox .CsBoxDataArea ul.CsBoxTag li a:link,
.CsBox .CsBoxDataArea ul.CsBoxTag li a:visited {
	color: #333;
	text-decoration: none;
}
.CsBox .CsBoxDataArea ul.CsBoxTag li a:hover,
.CsBox .CsBoxDataArea ul.CsBoxTag li a:active {
	color: #b1000e;
	text-decoration: underline;
}

.CsBox .CsBoxDataArea ul.CsBoxTag li.CsBoxProductsSub,
.CsBox .CsBoxDataArea ul.CsBoxTag li.CsBoxTopics,
.CsBox .CsBoxDataArea ul.CsBoxTag li.CsBoxIndustries {
display: none;
}

.CsBox .CsBoxDataArea .CsLanguage {
width: 220px;
height: 25px;
border-top: solid 1px #fafafa;
border-bottom: solid 1px #d0d0d0;
background: url('/case_studies/image/icon_language.png') no-repeat 10px 4px;
color: #4c4c4c;
line-height: 25px;
text-indent: 78px;
font-size: 77%;
}

.CsBox .CsBoxDataArea .CsBoxData {
width: 220px;
}

.CsBox .CsBoxDataArea .CsBoxData .CsSocial {
float: left;
width: 54px;
height: 28px;
border-top: solid 1px #fafafa;
border-right: solid 1px #fafafa;
background: url('/case_studies/image/bg_social.gif') no-repeat 10px 3px;
color: #4c4c4c;
font-size: 67%;
line-height: 26px;
text-align: center;
text-indent: 3px;
}

.CsBox .CsBoxDataArea .CsBoxData .CsDate {
float: left;
width: 92px;
height: 28px;
border-left: solid 1px #d0d0d0;
border-right: solid 1px #fafafa;
border-top: solid 1px #fafafa;
color: #4c4c4c;
font-size: 77%;
font-weight: bold;
line-height: 26px;
text-align: center;
}

.CsBox .CsBoxDataArea .CsBoxData .CsIcon {
position: relative;
float: left;
width: 70px;
height: 28px;
border-left: solid 1px #d0d0d0;
border-top: solid 1px #fafafa;
}

.CsBox .CsBoxDataArea .CsBoxData .CsIcon .CsMovie {
position: absolute;
display: block;
top: 5px;
left: 10px;
vertical-align :top;
}

.CsBox .CsBoxDataArea .CsBoxData .CsIcon .CsPDF {
position: absolute;
display: block;
top: 5px;
left: 39px;
vertical-align :top;
}

.CsBox .CsBoxDataArea .CsLanguage,
.CsBox .CsBoxDataArea .CsLangOption,
.CsBox .CsBoxDataArea .CsBoxData {
	display: none;
}

/*
.CsBox .CsBoxDataArea .CsLangOption,
.CsBox .CsBoxDataArea .CsBoxData .CsDate2,
.CsBox .CsBoxDataArea .CsBoxData .CsView,
.CsBox .CsBoxDataArea .CsBoxData .CsLatLng,
.CsBox .CsBoxDataArea .CsBoxData .CsPriority,
.CsBox .CsBoxDataArea .CsBoxData .CsCustomer,
.CsBox .CsBoxDataArea .CsBoxData .CsSolutions {
	display: none;
}
*/



/* [c6] Map View
=========================================================================================== */

#CsMapView {
position: absolute;
top: 0;
left: -9999px;
width: 965px;
height: 530px;
z-index: 5;
}

.gm-style {
font-size: 100% !important;
}

.CsGmapWin {
position: relative;
width: 380px;
height: 200px;
overflow: hidden;
}

.CsGmapWin .CsGmapWinImg {
float: left;
width: 136px;
margin-right: 14px;
padding-top: 20px;
text-align: right;
}

.CsGmapWin .CsGmapWinTxt {
float: left;
width: 210px;
padding-top: 18px;
}

.CsGmapWin .CsGmapWinTxt h2 {
margin: 0;
border-top-style: none;
font-size: 85%;
font-weight: bold;
line-height: 130%;
color: #000;
}

.CsGmapWin .CsGmapWinTxt p {
padding: 10px 0;
font-size: 77%;
color: #707070;
line-height: 130%;
}

.CsGmapWin ul.CsGmapWinTag {
position: absolute;
bottom: 3px;
left: 0;
width: 380px;
padding: 10px 0 8px 0;
background: url('/case_studies/image/bg_gmap_win.gif') repeat-x;
}

.CsGmapWin ul.CsGmapWinTag li {
display: inline;
float: left;
padding-left: 28px;
background: url('/case_studies/image/icon_tag_gmap.gif') no-repeat 13px 4px;
font-size: 77%;
line-height: 130%;
}

.CsGmapWin ul.CsGmapWinTag li a:link,
.CsGmapWin ul.CsGmapWinTag li a:visited {
	color: #333;
	text-decoration: none;
}
.CsGmapWin ul.CsGmapWinTag li a:hover,
.CsGmapWin ul.CsGmapWinTag li a:active {
	color: #b1000e;
	text-decoration: underline;
}

.CsGmapWin .CsGmapLanguage {
position: absolute;
bottom: 29px;
left: 0;
width: 380px;
height: 28px;
border-top: solid 1px #e4e4e4;
background: url('/case_studies/image/icon_language.png') no-repeat 10px 6px;
color: #707070;
line-height: 28px;
text-indent: 78px;
font-size: 77%;
}

.CsGmapWin .CsGmapWinData {
position: absolute;
bottom: 0;
left: 0;
width: 380px;
border-top: solid 1px #e4e4e4;
}

.CsGmapWin .CsGmapWinData .CsGmapSocial {
float: left;
width: 58px;
height: 28px;
border-right: solid 1px #e4e4e4;
background: url('/case_studies/image/bg_social.gif') no-repeat 10px 3px;
color: #707070;
font-size: 67%;
line-height: 26px;
text-align: center;
}

.CsGmapWin .CsGmapWinData .CsGmapDate {
float: left;
width: 92px;
height: 28px;
border-right: solid 1px #e4e4e4;
color: #707070;
font-size: 77%;
font-weight: bold;
line-height: 26px;
text-align: center;
}

.CsGmapWin .CsGmapWinData .CsGmapIcon {
position: relative;
float: left;
width: 70px;
height: 28px;
}

.CsGmapWin .CsGmapWinData .CsGmapIcon .CsMovie {
position: absolute;
display: block;
top: 5px;
left: 10px;
vertical-align :top;
}

.CsGmapWin .CsGmapWinData .CsGmapIcon .CsPDF {
position: absolute;
display: block;
top: 5px;
left: 39px;
vertical-align :top;
}



/* [c7] List View
=========================================================================================== */

#CsListView {
display: none;
padding: 13px;
}

#CsListView table {
width: 100%;
margin: 0;
background-color: #fff;
}

#CsListView table th {
padding: 6px 0;
border-top: 1px solid #d3d3d3;
border-bottom: 1px solid #cdcdcd;
background: url('/case_studies/image/bg_list_head.gif') no-repeat;
color: #2d2d2d;
text-align: center;
font-size: 77%;
font-weight: bold;
line-height: 1.2;
}

#CsListView table th.CsListWideCell {
border-left-style: none;
border-right-style: none;
background-position: left center;
}

#CsListView table th.CsListNarrowCell {
width: 130px;
border-left: 1px solid #d0d0d0;
border-right-style: none;
background-position: center center;
}

#CsListView table th.CsListRightCell {
background-position: right center !important;
}

#CsListView table td {
padding: 20px 15px;
border-top-style: none;
border-left-style: none;
border-right-style: none;
border-bottom: 1px solid #e1e1e1;
font-size: 100%;
}

#CsListView table td.CsListWideCell {
cursor: pointer;
}

.CsSortByView .CsListRank {
display: block !important;
}

#CsListView table td.CsListWideCell .CsListImageArea {
position: relative;
float: left;
width: 130px;
}

#CsListView table td.CsListWideCell .CsListImageArea .CsListNew {
position: absolute;
top: 5px;
left: 77px;
width: 34px;
height: 16px;
z-index: 100;
}

#CsListView table td.CsListWideCell .CsListImageArea .CsListRank {
display: none;
position: absolute;
top: 0;
left: 0;
width: 30px;
height: 30px;
z-index: 101;
}

#CsListView table td.CsListWideCell .CsListTextArea {
float: left;
width: 375px;
}

#CsListView table td.CsListWideCell .CsListTextArea h2 {
margin: 0;
padding: 0;
border-top-style: none;
font-size: 85%;
font-weight: bold;
line-height: 130%;
color: #202020;
}

#CsListView table td.CsListWideCell .CsListTextArea h2.CsHover {
color: #b1000e;
text-decoration: underline;
}

#CsListView table td.CsListWideCell .CsListTextArea p {
padding: 4px 0 0 0;
font-size: 77%;
color: #707070;
line-height: 130%;
}

#CsListView table td.CsListWideCell .CsListTextArea .CsListLanguage {
margin-top: 6px;
padding: 4px 0 4px 68px;
background: url('/case_studies/image/icon_language.png') no-repeat left center;
color: #4c4c4c;
line-height: 1;
font-size: 77%;
}

#CsListView table td.CsListNarrowCell {
border-left: 1px solid #e1e1e1;
color: #707070;
text-align: center;
font-size: 85%;
}

.CsSortByRecent table td.CsListDateCell {
background-color: #ebf1f7 !important;
}



/* [c8] Cover Story
=========================================================================================== */

#CsGridViewHead {
position: relative;
width: 965px;
height: 333px;
}

#CsGridViewHead ul#CsMainVisualImages li {
display: none;
position: absolute;
top: 0;
left: 0;
z-index: 10;
}

#CsGridViewHead ul#CsMainVisualImages li:first-child {
display: block;
}

#CsGridViewHead #CsMainVisualIndicator {
display: none;
position: absolute;
bottom: 0;
right: 0;
height: 40px;
padding: 0 12px;
background-image: url('/case_studies/image/bg_mainvisual_indicator.png');
z-index: 12;
}

#CsGridViewHead #CsMainVisualIndicator li {
float: left;
width: 24px;
height: 40px;
}

#CsGridViewHead #CsMainVisualIndicator li a {
display: block;
width: 24px;
height: 40px;
background: url('/case_studies/image/btn_mainvisual_indicator.png') no-repeat 0 0;
}

#CsGridViewHead #CsMainVisualIndicator li a#CsMainVisualIndPause {
background: url('/case_studies/image/btn_mainvisual_pause.png') no-repeat 0 0;
outline: 0;
text-indent: -9999px;
}

#CsGridViewHead #CsMainVisualIndicator li a.CsCurrent {
background-position: 0 -40px !important;
}

#CsGridViewHead #CsMainVisualBtnPrev {
display: none;
position: absolute;
top: 134px;
left: 0;
z-index: 13;
}

#CsGridViewHead #CsMainVisualBtnNext {
display: none;
position: absolute;
top: 134px;
right: 0;
z-index: 14;
}

#CsGridViewHead a {
outline: 0;
}

.CsJsOn #CsGridViewHead #CsMainVisualBtnPrev,
.CsJsOn #CsGridViewHead #CsMainVisualBtnNext,
.CsJsOn #CsGridViewHead #CsMainVisualIndicator {
display: block;
}



/* [c9] Preview
=========================================================================================== */

#CsPreviewBg {
position: fixed;
width: 100%;
height: 100%;
top: 0;
left: 0;
background-color: #000;
z-index: 10000;
}

#CsPreviewTransition {
position: fixed;
background-color: #fff;
z-index: 10001;
}

#CsPreviewContainer {
display: none;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
overflow: auto;
z-index: 10002;
}

#CsPreviewContainerPadding {
padding: 50px 0;
}

#CsPreview {
width: 965px;
margin: 0 auto;
padding: 20px 0;
background-color: #fff;
box-shadow: 0 0 20px rgba(0,0,0,1);
-moz-box-shadow: 0 0 20px rgba(0,0,0,1);
-webkit-box-shadow: 0 0 20px rgba(0,0,0,1);
}

#CsLoader {
display: none;
position: fixed;
left: 50%;
width: 32px;
height: 32px;
margin: 0 0 0 -16px;
z-index: 10100;
}

#CsPreview #CsPreviewBodyArea {
position: relative;
width: 925px;
height: 460px;
margin-left: 20px;
overflow: hidden;
}

#CsPreview #CsPreviewNavHead {
margin: 20px 0 0 20px;
color: #707070;
font-size: 77%;
font-weight: bold;
}

#CsPreview #CsPreviewNavArea {
width: 925px;
height: 110px;
margin: 8px 0 0 20px;
background: url('/case_studies/image/bg_preview_nav.gif') repeat-x;
}

#CsPreview #CsPreviewBodyArea #CsPreviewBody {
position: absolute;
top: 0;
left: 0;
width: 925px;
}

#CsPreview #CsPreviewBodyArea #CsPreviewBody #CsPreviewLeft {
float: left;
width: 50px;
padding-top: 120px;
}

#CsPreview #CsPreviewBodyArea #CsPreviewBody #CsPreviewText {
float: left;
width: 400px;
margin-right: 20px;
padding-bottom: 20px;
}

#CsPreview #CsPreviewBodyArea #CsPreviewBody #CsPreviewImage {
float: left;
width: 403px;
height: 330px;
margin-right: 21px;
}

#CsPreview #CsPreviewBodyArea #CsPreviewBody #CsPreviewRight {
float: left;
width: 31px;
text-align: center;
}

#CsPreview #CsPreviewBodyArea #CsPreviewBody #CsPreviewData {
clear: left;
width: 923px;
border: 1px solid #dcdcdc;
background-color: #f3f3f3;
}

#CsPreview #CsPreviewBodyArea #CsPreviewBody #CsPreviewText h2 {
margin: 0;
border-top-style: none;
color: #202020;
font-size: 182%;
font-weight: bold;
line-height: 120%;
}

#CsPreview #CsPreviewBodyArea #CsPreviewBody #CsPreviewText #CsPreviewLead {
padding: 10px 0 0 0;
color: #e41036;
font-size: 85%;
font-weight: bold;
line-height: 140%;
}

#CsPreview #CsPreviewBodyArea #CsPreviewBody #CsPreviewText p {
padding: 10px 0 0 0;
color: #707070;
font-size: 77%;
line-height: 160%;
}

#CsPreview #CsPreviewBodyArea #CsPreviewBody #CsPreviewText #CsPreviewLink {
padding: 10px 0 0 0;
}

#CsPreview #CsPreviewBodyArea #CsPreviewBody #CsPreviewText #CsPreviewLink form {
float: left;
margin-right: 16px;
font-size: 77%;
line-height: 36px;
}

#CsPreview #CsPreviewBodyArea #CsPreviewBody #CsPreviewText #CsPreviewLink form span {
padding-right: 8px;
color: #707070;
font-weight: bold;
}

#CsPreview #CsPreviewBodyArea #CsPreviewBody #CsPreviewImage ul#CsPvImages {
position: relative;
width: 403px;
height: 227px;
margin-top: 40px;
}

#CsPreview #CsPreviewBodyArea #CsPreviewBody #CsPreviewImage ul#CsPvImages li {
filter: alpha(opacity=0);
opacity: 0;
position: absolute;
top: 0;
left: 0;
z-index: 10010;
}

#CsPreview #CsPreviewBodyArea #CsPreviewBody #CsPreviewImage ul#CsPvImages li:first-child {
filter: alpha(opacity=100);
opacity: 1;
}

#CsPreview #CsPreviewBodyArea #CsPreviewBody #CsPreviewImage ul#CsPvIndicator {
display: none;
width: 403px;
height: 30px;
}

#CsPreview #CsPreviewBodyArea #CsPreviewBody #CsPreviewImage ul#CsPvIndicator li {
float: left;
width: 19px;
height: 30px;
}

#CsPreview #CsPreviewBodyArea #CsPreviewBody #CsPreviewImage ul#CsPvIndicator li a {
display: block;
width: 19px;
height: 30px;
background: url('/case_studies/image/btn_preview_indicator.gif') no-repeat 0 0;
}

#CsPreview #CsPreviewBodyArea #CsPreviewBody #CsPreviewImage ul#CsPvIndicator li a#CsPvIndPause {
background: url('/case_studies/image/btn_preview_pause.gif') no-repeat 0 0;
outline: 0;
text-indent: -9999px;
}

#CsPreview #CsPreviewBodyArea #CsPreviewBody #CsPreviewImage ul#CsPvIndicator li a.CsCurrent {
background-position: 0 -30px !important;
}

#CsPreview #CsPreviewBodyArea #CsPreviewBody #CsPreviewRight #CsPreviewClose {
height: 120px;
text-align: right;
}

#CsPreview #CsPreviewBodyArea #CsPreviewBody #CsPreviewData ul#CsPvDataTable {
min-height: 89px;
height: auto !important;
height: 89px;
padding-left: 30px;
border-bottom: 1px solid #ddd;
}

#CsPreview #CsPreviewBodyArea #CsPreviewBody #CsPreviewData ul#CsPvDataTable li {
float: left;
width: 140px;
margin-right: 8px;
padding: 10px 0;
}

#CsPreview #CsPreviewBodyArea #CsPreviewBody #CsPreviewData ul#CsPvDataTable li div {
color: #707070;
font-size: 77%;
font-weight: bold;
}

#CsPreview #CsPreviewBodyArea #CsPreviewBody #CsPreviewData ul#CsPvDataTable li p {
margin-top: 5px;
color: #202020;
font-size: 77%;
line-height: 140%;
}

#CsPreview #CsPreviewBodyArea #CsPreviewBody #CsPreviewData #CsPvData {
height: 38px;
padding: 0 0 0 30px;
border-top: 1px solid #fcfcfc;
}

#CsPreview #CsPreviewBodyArea #CsPreviewBody #CsPreviewData #CsPvData #CsPvIcon {
position: relative;
float: left;
width: 240px;
height: 38px;
border-right: solid 1px #ddd;
color: #707070;
font-size: 77%;
font-weight: bold;
line-height: 37px;
}

#CsPreview #CsPreviewBodyArea #CsPreviewBody #CsPreviewData #CsPvData #CsPvIcon .CsMovie {
position: absolute;
display: block;
top: 9px;
right: 60px;
}

#CsPreview #CsPreviewBodyArea #CsPreviewBody #CsPreviewData #CsPvData #CsPvIcon .CsPDF {
position: absolute;
display: block;
top: 9px;
right: 30px;
}

#CsPreview #CsPreviewBodyArea #CsPreviewBody #CsPreviewData #CsPvData #CsPvIcon img {
margin-left: 10px;
}

#CsPreview #CsPreviewBodyArea #CsPreviewBody #CsPreviewData #CsPvData #CsPvShareBtnTitle {
float: left;
height: 38px;
padding-left: 30px;
/*border-left: solid 1px #ddd;*/
color: #707070;
font-size: 77%;
font-weight: bold;
line-height: 37px;
}

#CsPreview #CsPreviewBodyArea #CsPreviewBody #CsPreviewData #CsPvData ul#CsPvShareButtons {
float: right;
width: 445px;
height: 38px;
padding-left: 16px;
}

#CsPreview #CsPreviewBodyArea #CsPreviewBody #CsPreviewData #CsPvData ul#CsPvShareButtons li {
float: right;
width: 115px;
padding-top: 8px;
}

#CsPreview #CsPreviewBodyArea #CsPreviewBody #CsPreviewData #CsPvData ul#CsPvShareButtons li.CsGplus {
width: 90px;
}

#CsPreview #CsPreviewBodyArea #CsPreviewBody #CsPreviewData #CsPvData ul#CsPvShareButtons li.CsIn {
width: 125px;
}

#CsPreview #CsPreviewBodyArea #CsPreviewBody #CsPreviewData #CsPvData ul#CsPvShareButtons li iframe.twitter-share-button {
width: 115px !important;
}

#CsPreview #CsPreviewNavArea #CsPvNavLeft {
float: left;
width: 51px;
}

#CsPreview #CsPreviewNavArea #CsPvNavCenter {
position: relative;
float: left;
width: 823px;
height: 110px;
overflow: hidden;
}

#CsPreview #CsPreviewNavArea #CsPvNavCenter ul#CsPvNavSlide {
position: absolute;
top: 19px;
left: 16px;
height: 72px;
}

#CsPreview #CsPreviewNavArea #CsPvNavCenter ul#CsPvNavSlide li {
float: left;
width: 116px;
height: 72px;
margin-right: 19px;
background-repeat: no-repeat;
}

#CsPreview #CsPreviewNavArea #CsPvNavCenter ul#CsPvNavSlide li a {
display: block;
position: relative;
width: 116px;
height: 72px;
background: url('/case_studies/image/btn_preview_nav_current.gif') no-repeat 0 0;
color: #fff;
text-decoration: none;
}

#CsPreview #CsPreviewNavArea #CsPvNavCenter ul#CsPvNavSlide li a .CsNew {
position: absolute;
top: 6px;
right: 6px;
width: 34px;
height: 16px;
}

#CsPreview #CsPreviewNavArea #CsPvNavCenter ul#CsPvNavSlide li a .CsCatch {
display: none;
position: absolute;
top: 0;
left: 0;
height: 66px;
padding: 6px 8px 0 8px;
background-color: #000;
color: #fff;
font-size: 77%;
line-height: 1.2;
}

#CsPreview #CsPreviewNavArea #CsPvNavRight {
float: left;
width: 51px;
}



/* [c21] Page Top Link
=========================================================================================== */

/* --- [c21] Page Top Link --- */

ul.PageTop {
	margin: 0 0 15px;
	padding-top: 10px;
	text-align: right;
	font-size: 76%;
}

ul.PageTop li {
	padding: 0;
	font-size: 100%;
	background-image: none;
}

ul.PageTop a {
	display: inline-block;
	padding: 0 20px 0 0;
	background-image: url(/image/en/r1/icon/icon_link_top.gif);
	background-repeat: no-repeat;
	background-position: right center;
	zoom: 1;
}
ul.PageTop a:link,
ul.PageTop a:visited {
	color: #c02;
	text-decoration: none;
}
ul.PageTop a:hover,
ul.PageTop a:active {
	color: #b1000e;
	text-decoration: underline;
}



/* [c24] Banner Area
=========================================================================================== */

/* --- [c24-1] Banner Area > 1 row --- */
/* --- [c24-2] Banner Area > 2 rows --- */

.FatBanner {
	clear: both;
	min-width: 965px;
	padding: 25px 0 10px;
	background-color: #f2f2f2;
	border-top: solid 1px #fff;
	overflow: hidden;
	zoom: 1;
}

.FatBanner:after {
	content: "";
	display: block;
	clear: both;
}

.FatBanner ul {
	width: 965px;
	margin: 0 auto;
}
*:first-child+html .FatBanner ul {margin: 0 auto 15px;}

.FatBanner li {
	float: left;
	width: 230px;
	margin: 0 0 15px 15px;
}

.FatBanner li.FirstItem {
	clear: both;
	margin: 0 0 15px;
}

.FatBanner a {
	display: block;
	line-height: 0;
	text-align: left;
}
.FatBanner a:link,
.FatBanner a:visited,
.FatBanner a:hover,
.FatBanner a:active {
	color: #fff;
	text-decoration: none;
}

.FatBanner strong {
	display: block;
	font-size: 90%;
	line-height: 120%;
	color: #fff;
	background-image: url(/image/en/r1/icon/icon_link_right_l_white.gif);
	background-repeat: no-repeat;
	background-position: right center;
}
* html .FatBanner strong {cursor: pointer;}
*:first-child+html .FatBanner strong {cursor: pointer;}

.FatBanner a:link strong,
.FatBanner a:visited strong {
	padding: 0 22px 0 15px;
	background-color: #e60027;
	border-right: solid 3px transparent;
}

.FatBanner a:hover strong,
.FatBanner a:active strong {
	padding: 0 24px 0 15px;
	background-color: #b1000e;
	border-right: solid 1px transparent;
}
* html .FatBanner a:link strong,
* html .FatBanner a:visited strong {
	padding: 0 24px 0 15px;
	background-position: 98.5% 50%;
	border-right: none 0;
}
* html .FatBanner a:hover strong,
* html .FatBanner a:active strong {
	padding: 0 24px 0 15px;
	background-position: 99.5% 50%;
	border-right: none 0;
}
*:first-child+html .FatBanner a:link strong,
*:first-child+html .FatBanner a:visited strong {
	padding: 0 24px 0 15px;
	background-position: 98.5% 50%;
	border-right: none 0;
}
*:first-child+html .FatBanner a:hover strong,
*:first-child+html .FatBanner a:active strong {
	padding: 0 24px 0 15px;
	background-position: 99.5% 50%;
	border-right: none 0;
}

.FatBanner span {
	display: table-cell;
	height: 3em;
	color: #fff;
	vertical-align: middle;
}

* html .FatBanner span {
	display: block;
	padding-top: 5px;
}

*:first-child+html .FatBanner span {
	display: block;
	padding-top: 5px;
}