@charset "utf-8";



/*
$Date: 2013-04-12 19:35:49 +0900 (閲? 12 4 2013) $
$Rev: 1070 $
*/



/* ---------- ---------- ----------
	::index::

 1. Cross Type Navigation
 2. Carousel
 3. Custom Pulldown
 4. Modal and Light Box
 5. Key Visual Slider
 6. Parametric Search
 7. Search Words Highlight
 8. Mega Menu
 9. Show or Hide Change
 10. DownloadList
 11. Product Finder Apps

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


/* 1. Cross Type Navigation
------------------------------------------------------------------------------------------ */
div#PBC_LocalNav p.PagerOption,
div#CrossTypeNav p.PagerOption {
position: absolute;
top: 5px;
right: 35px;
}
div#PBC_LocalNav div.SeriesContent.loading,
div#CrossTypeNavContent div#FrameCarouselWrap.loading {
	background: #fff url(../../img/common/modal/loading.gif) center center no-repeat;
}

div#PBC_LocalNav div.MoreSeries.loading {
	background: #fff url(../../img/common/modal/loading.gif) center center no-repeat;
}

div#CrossTypeNavContent div.CrossTypeNavContentBody.loading {
	background: #fff url(../../img/common/modal/loading.gif) 60% 55% no-repeat;
}

div#PBC_LocalNav div.SeriesContent div#FrameCarouselWrapLocal,
div#CrossTypeNavContent div.CrossTypeNavContentBody div.SeriesContent div#FrameCarouselWrap {
	min-height: 193px;
}

/* for IE7 */
.ie7 div#CrossTypeNav div#CrossTypeNavLabel { right: 97.5%; }
/* for IE8 */
.ie8 div#CrossTypeNav div#CrossTypeNavLabel {
	right: auto;
	left: -15px;
}



/* 2. Carousel
------------------------------------------------------------------------------------------ */
/* Basic */
.jcarousel-skin-basic .jcarousel-container-horizontal {
	padding: 0 17px;
}
.jcarousel-skin-basic .jcarousel-clip { overflow: hidden; }
.jcarousel-skin-basic .jcarousel-item-placeholder {
    background: #fff;
    color: #000;
}
.jcarousel-skin-basic ul.ThumbList.ImgBordered {
	padding-top: 1px !important;
}
#DownloadList .jcarousel-skin-basic ul {
	padding-bottom: 1px !important;
}
/* Buttons */
.jcarousel-skin-basic .jcarousel-next-horizontal {
    cursor: pointer;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    width: 17px;
    background: url(../../img/common/mkr_arw_carousel_r.png) no-repeat 0 50%;
}
/* in Download List */
#DownloadList .jcarousel-skin-basic .jcarousel-next-horizontal {
    background: url(../../img/common/mkr_arw_cart_carousel_r.png) no-repeat 0 50%;
}
.jcarousel-skin-basic .jcarousel-next-horizontal:hover,
.jcarousel-skin-basic .jcarousel-next-horizontal:active,
#DownloadList .jcarousel-skin-basic .jcarousel-next-horizontal:hover,
#DownloadList .jcarousel-skin-basic .jcarousel-next-horizontal:active {
    background-position: -17px 50%;
	background-color:#e5e5e5;
}
#DownloadList .jcarousel-skin-basic .jcarousel-next-horizontal:hover,
#DownloadList .jcarousel-skin-basic .jcarousel-next-horizontal:active { background-color: #ccc; }
.jcarousel-skin-basic .jcarousel-next-disabled-horizontal,
.jcarousel-skin-basic .jcarousel-next-disabled-horizontal:hover,
.jcarousel-skin-basic .jcarousel-next-disabled-horizontal:focus,
.jcarousel-skin-basic .jcarousel-next-disabled-horizontal:active,
#DownloadList .jcarousel-skin-basic .jcarousel-next-disabled-horizontal,
#DownloadList .jcarousel-skin-basic .jcarousel-next-disabled-horizontal:hover,
#DownloadList .jcarousel-skin-basic .jcarousel-next-disabled-horizontal:focus,
#DownloadList .jcarousel-skin-basic .jcarousel-next-disabled-horizontal:active {
    cursor: default;
    background-position: -34px 50%;
    background-color: transparent;
}
.jcarousel-skin-basic .jcarousel-prev-horizontal {
    cursor: pointer;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 17px;
    background: url(../../img/common/mkr_arw_carousel_l.png) no-repeat -34px 50%;
}
/* in Download List */
#DownloadList .jcarousel-skin-basic .jcarousel-prev-horizontal {
    background: url(../../img/common/mkr_arw_cart_carousel_l.png) no-repeat -34px 50%;
}
#DownloadList .jcarousel-skin-basic .jcarousel-prev-horizontal:hover,
#DownloadList .jcarousel-skin-basic .jcarousel-prev-horizontal:active,
.jcarousel-skin-basic .jcarousel-prev-horizontal:hover,
.jcarousel-skin-basic .jcarousel-prev-horizontal:active {
    background-position: -17px 50%;
	background-color:#e5e5e5;
}
#DownloadList .jcarousel-skin-basic .jcarousel-prev-horizontal:hover,
#DownloadList .jcarousel-skin-basic .jcarousel-prev-horizontal:active { background-color: #ccc; }
.jcarousel-skin-basic .jcarousel-prev-disabled-horizontal,
.jcarousel-skin-basic .jcarousel-prev-disabled-horizontal:hover,
.jcarousel-skin-basic .jcarousel-prev-disabled-horizontal:focus,
.jcarousel-skin-basic .jcarousel-prev-disabled-horizontal:active,
#DownloadList .jcarousel-skin-basic .jcarousel-prev-disabled-horizontal,
#DownloadList .jcarousel-skin-basic .jcarousel-prev-disabled-horizontal:hover,
#DownloadList .jcarousel-skin-basic .jcarousel-prev-disabled-horizontal:focus,
#DownloadList .jcarousel-skin-basic .jcarousel-prev-disabled-horizontal:active {
    cursor: default;
    background-position: 0 50%;
    background-color: transparent;
}
.jcarousel-skin-basic ul.ThumbList .jcarousel-item-horizontal span.Text {
	height: 5.4em;
}
/* in DoubleMainSub.NoFrame */
div#ContentsLayout.DoubleMainSub.NoFrame .jcarousel-skin-basic ul.ThumbList .jcarousel-item-horizontal span.Text {
	height: 6.4em;
	padding-left: 0;
	background: none;
    font-size: 0.91em;
}
div#ContentsLayout.DoubleMainSub.NoFrame .jcarousel-skin-basic .jcarousel-prev-horizontal {
	background-image: url("../../img/common/mkr_arw_carousel_l_single.png");
}
div#ContentsLayout.DoubleMainSub.NoFrame .jcarousel-skin-basic .jcarousel-next-horizontal {
	background-image: url("../../img/common/mkr_arw_carousel_r_single.png");
}

/* Frame Skin */
#MainContentBody .jcarousel-skin-frame {
margin-bottom: 20px;
}
.jcarousel-skin-frame .jcarousel-container-horizontal {
    padding: 30px 23px 0;
    border: 1px solid #ccc;
}
#MainContentBody .jcarousel-skin-frame .jcarousel-container-horizontal {
    padding: 15px 23px 9px;
}
.jcarousel-skin-frame .jcarousel-clip { overflow: hidden; }
.jcarousel-skin-frame .jcarousel-item-placeholder {
    background: #fff;
    color: #000;
}

/* Buttons */
.jcarousel-skin-frame .jcarousel-next-horizontal {
    cursor: pointer;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    width: 23px;
    background: url(../../img/common/mkr_arw_carousel2_r.gif) no-repeat 0 50%;
}
.jcarousel-skin-frame .jcarousel-next-horizontal:hover,
.jcarousel-skin-frame .jcarousel-next-horizontal:active {
    background-position: -23px 50%;
}
.jcarousel-skin-frame .jcarousel-next-disabled-horizontal,
.jcarousel-skin-frame .jcarousel-next-disabled-horizontal:hover,
.jcarousel-skin-frame .jcarousel-next-disabled-horizontal:focus,
.jcarousel-skin-frame .jcarousel-next-disabled-horizontal:active {
    cursor: default;
    background-position: -46px 50%;
}
.jcarousel-skin-frame .jcarousel-prev-horizontal {
    cursor: pointer;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 23px;
    background: url(../../img/common/mkr_arw_carousel2_l.gif) no-repeat -46px 50%;
}
.jcarousel-skin-frame .jcarousel-prev-horizontal:hover {
    background-position: -23px 50%;
}
.jcarousel-skin-frame .jcarousel-prev-horizontal:active { background-color: #fff; }
.jcarousel-skin-frame .jcarousel-prev-disabled-horizontal,
.jcarousel-skin-frame .jcarousel-prev-disabled-horizontal:hover,
.jcarousel-skin-frame .jcarousel-prev-disabled-horizontal:focus,
.jcarousel-skin-frame .jcarousel-prev-disabled-horizontal:active {
    cursor: default;
    background-position: 0 50%;
}

/* Option Styles */
.ViewAll {
	margin-top: 2px;
	text-align: right;
}

/* News Carousel */
div#MainContent div.HomeNewsBox div.CarouselWrap .NewsCarouselWrapper {
	position: relative;
	padding: 0 21px;
}

ul.NewsCarousel {
	margin: 0;
}

ul.NewsCarousel li { width: 545px; }

#NewsCarouselPrev {
    cursor: pointer;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 18px;
    border-right: 1px solid #bbb;
    background:#fff url(../../img/common/mkr_arw_news_carousel_l.png) no-repeat -36px 50%;
    z-index: 10;
}

#NewsCarouselPrev:hover,
#NewsCarouselPrev:active {
    background-position: -18px 50%;
    background-color: #e5e5e5;
}
#NewsCarouselPrev .disabled {
    cursor: default;
    background-position: 0 50%;
    background-color: transparent;
}

#NewsCarouselNext {
    cursor: pointer;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    width: 18px;
    border-left: 1px solid #bbb;
    background:#fff url(../../img/common/mkr_arw_news_carousel_r.png) no-repeat 0 50%;
    z-index: 10;
}
#NewsCarouselNext:hover,
#NewsCarouselNext:active {
    background-position: -18px 50%;
    background-color: #e5e5e5;
}

#NewsCarouselNext .disabled {
    cursor: default;
    background-position: -36px 50%;
    background-color: transparent;
}



/* 3. Custom Pulldown
------------------------------------------------------------------------------------------ */
.FormSelectPullDown { z-index:999; }
#kpi_boxLoadedContent { position: relative; zoom: 1; }



/* 4. Modal and Light Box
------------------------------------------------------------------------------------------ */
/*
kmodalbox Core Style:
The following CSS is consistent between example themes and should not be altered.
*/
#kpi_modalbox, #kpi_boxOverlay, #kpi_boxWrapper{position:absolute; top:0; left:0; z-index:99999; overflow:hidden;}
#kpi_boxOverlay{position:fixed; width:100%; height:100%;}
#kpi_boxMiddleLeft, #kpi_boxBottomLeft{clear:left;}
#kpi_boxContent{position:relative;}
#kpi_boxLoadedContent{overflow:auto;}
#kpi_boxTitle{margin:0;}
#kpi_boxLoadingOverlay, #kpi_boxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#kpi_boxPrevious, #kpi_boxNext, #kpi_boxClose, #kpi_boxSlideshow{cursor:pointer;}
.kpi_boxPhoto{float:left; margin:auto; border:0; display:block; max-width:none;}
.kpi_boxIframe{width:100%; height:100%; display:block; border:0;}
#kpi_modalbox, #kpi_boxContent, #kpi_boxLoadedContent{box-sizing:content-box;}
#kpi_boxOverlay{background:url(../../img/common/modal/overlay.png) repeat 0 0;}
#kpi_modalbox{}
#kpi_boxTopLeft{width:1px; height:1px; background-color: #5a5a5a;}
#kpi_boxTopRight{width:1px; height:1px; background-color: #5a5a5a;}
#kpi_boxBottomLeft{width:1px; height:1px; background-color: #5a5a5a;}
#kpi_boxBottomRight{width:1px; height:1px; background-color: #5a5a5a;}
#kpi_boxMiddleLeft{width:1px; background-color: #5a5a5a;}
#kpi_boxMiddleRight{width:1px; background-color: #5a5a5a;}
#kpi_boxTopCenter{height:1px; background-color: #5a5a5a;}
#kpi_boxBottomCenter{height:1px; background-color: #5a5a5a;}
#kpi_boxContent{background:#f4f4f4; overflow:hidden;}
#kpi_boxError{padding:50px; background:#fff; border-top:1px solid #c3c3c3;}
.kpi_boxIframe{background:#fff;}
#kpi_boxTitle{position:absolute; top:15px; left:15px; text-align:left; width:100%; font-size: 1.16em; color:#000; font-weight: bold;}
#kpi_boxClose{position:absolute; top:10px; right:10px; background:url(../../img/common/modal/controls.png) no-repeat -25px 0; width:25px; height:25px; text-indent:-9999px;}
#kpi_boxClose:hover{background-position:-25px -25px;}
#kpi_boxLoadedContent{margin-top:44px; background-color: #fff; border-top:1px solid #c3c3c3;}

#kpi_boxCurrent{position:absolute; top:4px; left:58px; color:#949494;}
#kpi_boxSlideshow{position:absolute; top:4px; right:30px; color:#0092ef;}
#kpi_boxPrevious{position:absolute; top:0; left:0; background:url(../../img/common/modal/controls.png) no-repeat -75px 0; width:25px; height:25px; text-indent:-9999px;}
#kpi_boxPrevious:hover{background-position:-75px -25px;}
#kpi_boxNext{position:absolute; top:0; left:27px; background:url(../../img/common/modal/controls.png) no-repeat -50px 0; width:25px; height:25px; text-indent:-9999px;}
#kpi_boxNext:hover{background-position:-50px -25px;}
/*#kpi_boxLoadingOverlay{background:url(../../img/common/modal/loading_background.png) no-repeat center center;}*/
#kpi_boxLoadingGraphic{background:#fff url(../../img/common/modal/loading.gif) no-repeat center center;}

/*
  The following fixes a problem where IE7 and IE8 replace a PNG's alpha transparency with a black fill
  when an alpha filter (opacity change) is set on the element or ancestor element.  This style is not applied to or needed in IE9.
  See: http://jacklmoore.com/notes/ie-transparency-problems/
*/
.kpi_boxIE #kpi_boxTopLeft,
.kpi_boxIE #kpi_boxTopCenter,
.kpi_boxIE #kpi_boxTopRight,
.kpi_boxIE #kpi_boxBottomLeft,
.kpi_boxIE #kpi_boxBottomCenter,
.kpi_boxIE #kpi_boxBottomRight,
.kpi_boxIE #kpi_boxMiddleLeft,
.kpi_boxIE #kpi_boxMiddleRight {
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);
}



/* 5. Key Visual Slider
------------------------------------------------------------------------------------------ */
div#KeyVisual div.KeyVisualList p.Image { margin: 0; }

body#Home div#HomeKeyVisual div.HomeKeyVisualList { text-align: center; }

div#HomeKeyVisual ul.SliderBullets,
div#HomeKeyVisual p#PlayStopBtn {
    position: absolute;
    padding: 0;
    left: 0;
    bottom: 27px;
    list-style: none;
    z-index: 99;
    zoom: 1;
}

div#KeyVisual ul.SliderBullets,
div#KeyVisual p#PlayStopBtn {
    position: absolute;
    padding: 0;
    left: 20px;
    bottom: -5px;
    list-style: none;
    z-index: 99;
    zoom: 1;
}

div#HomeKeyVisual ul.SliderBullets li,
div#KeyVisual ul.SliderBullets li {
    cursor: pointer;
	display: inline-block;
	width: 18px;
	height: 18px;
	margin: 0 5px 0 0;
	padding: 0;
	line-height: 18px;
	text-align: center;
	font-weight: bold;
	color: #fff;
	background: #313435;
	-webkit-border-radius: 9px;
	-moz-border-radius: 9px;
	border-radius: 9px;
	/*behavior: url("/js/common/PIE.htc");*/
	zoom: 1;
}

div#HomeKeyVisual ul.SliderBullets li a,
div#KeyVisual ul.SliderBullets li a { color: #fff; text-decoration: none; }

div#HomeKeyVisual ul.SliderBullets li:hover,
div#KeyVisual ul.SliderBullets li:hover { background-color: #545657; }

div#HomeKeyVisual ul.SliderBullets li.Current,
div#KeyVisual ul.SliderBullets li.Current { background-color: #c00; }

p#PlayStopBtn span {
    cursor: pointer;
	display: inline-block;
	width: 18px;
	height: 18px;
	padding: 0;
	line-height: 18px;
	text-align: center;
	color: #fff;
	-webkit-border-radius: 9px;
	-moz-border-radius: 9px;
	border-radius: 9px;
	/*behavior: url("/js/common/PIE.htc");*/
	zoom:1;
}

p#PlayStopBtn span.Pause { background: #313435 url("../../img/common/icon_play.png") 53% 50% no-repeat; }
p#PlayStopBtn span.Pause { background-position: 60% 50% }

p#PlayStopBtn span.Active { background: #313435 url("../../img/common/icon_pause.png") 65% 50% no-repeat; }
p#PlayStopBtn span.Active { background-position: 50% 50% }

/* for IE7 */
.ie7 div#HomeKeyVisual ul.SliderBullets li,
.ie7 div#KeyVisual ul.SliderBullets li { float: left; }



/* 6. Parametric Search
------------------------------------------------------------------------------------------ */
div#MainContent div#ParametricSearch div.ResultCount p span.NumText.Lt50 { color: #ebbc00; }
div#MainContent div#ParametricSearch div.ResultCount p span.NumText.Lt20 { color: #12aa0b; }
div#MainContent div#ParametricSearch div.ResultCount p span.NumText.Lt10 { color: #0087d5; }



/* 7. Search Words Highlight
------------------------------------------------------------------------------------------ */
#SearchTarget span.HighLight {
	background-color: #ebbc00;
}



/* 8. Mega Menu
------------------------------------------------------------------------------------------ */
div#MegaMenu.Hidden { visibility: hidden; }
div#MegaMenu div#MegaMenuInner { overflow: hidden; }



/* 9. Show or Hide Change
------------------------------------------------------------------------------------------ */
div#MainContent div.Show,
div#MainContent tr.Show { display: block; }
div#MainContent div.Hide,
div#MainContent tr.Hide { display: none; }



/* 10. DownloadList
------------------------------------------------------------------------------------------ */
div#DownloadListLinks div.ErrorMessage,
div#RecentlyDownloadedItems { display: none; }



/* 11. Product Finder Apps
------------------------------------------------------------------------------------------ */
#RollAreaWrap {
    position: relative;
    width: 968px;
    margin: 0 -29px 25px;
    overflow: hidden;
}

#RollAreaInner {
    position: relative;
    width: 970px;
    height: 474px;
    margin: 0 -1px;
    background: url("../../img/common/rollarea/back_main.gif") no-repeat scroll 0 0 transparent;
}

#RollArea a.RollAreaNext {
    position: absolute;
    top: 285px;
    left: 270px;
    float: left;
    outline: medium none;
    z-index: 999;
}
#RollArea a.RollAreaPrev {
    position: absolute;
    top: 285px;
    left: 612px;
    float: left;
    outline: medium none;
    z-index: 999;
}
#RollArea .RollAreaTitle {
    position: absolute;
    top: 445px;
    left: -5px;
    width: 970px;
    text-align: center;
}