@charset "UTF-8";
/* **************************************************

Name: modify.css

Description: Sub CSS

Create: 2014.07.03
Update: 2014.07.04

Copyright 2014 Hitachi, Ltd.

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


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

Modify Setting
[-] Src Box Setting

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



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

Modify Setting

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

/* Src Box Setting
=========================================================================================== */
/*
カードデザイン
*/
.card_box,
.card_box2,
.card_box3 {
box-sizing     : border-box;
 background     : #fff;
 border         : #ddd solid 1px;
 font-size      : 90%;
 line-height    : 160%;
 padding-bottom : 8px;
 margin-bottom	: 15px;
 margin-left	  : 0;
}
.card_box2 {
min-height:246px;
}
.card_box3 {
 min-height:195px;
}
.card_box.LastItem,
.card_box2.LastItem,
.card_box3.LastItem {
margin-right: 0;
}
.card_box h2,
.card_box2 h2,
.card_box3 h2 {
background     : none;
 font-weight    : bold;
 line-height    : 1.2;
 margin-bottom  : 0;
 padding        : 10px;
}
.card_box img,
.card_box2 img,
.card_box3 img {
background     : none;
 margin         : -1px 0 0 -1px;
 padding        : 0;
}
.card_box p {
background     : none;
 line-height    : 1.2;
 margin         : 0 13px 15px;
 padding        : 0;
}
.card_box2 p,
.card_box3 p {
background     : none;
 color			: #333;
 line-height    : 1.3;
 margin         : 15px 13px 7px;
 padding        : 0;
}
.card_box2 p span,
.card_box3 p span {
color			: #636262;
}
.card_box2 span.title,
.card_box3 span.title {
 font-weight: bold;
}
.card_box strong {
background     : #B1000E;
 color          : #fff;
 padding        : 2px 16px;
 margin-bottom  : 10px;
 display        : block;
 width          : 3em;
 text-align     : center;
}
.card_box2 strong {
background     : #ffffff;
 color          : #B1000E;
 padding        : 2px 16px;
 margin-top		: 5px;
 margin-left	: 5px;
 margin-bottom  : 5px;
 display        : block;
 width          : 3em;
 text-align     : center;
}
.card_box2 .thumnail,
.card_box3 .thumnail {
position:relative;
}
.card_box2 .thumimg,
.card_box3 .thumimg {
display: block;
}
.card_box2 .flagimg {
position:absolute;
	display: block;
	bottom: 0;
	left: 1px;
}
.card_box2 .flagtxt {
display: none;
}
.card_box.hide,
.card_box2.hide,
.card_box3.hide {
display        : none;
}

/*
カードソート＞領域部分
*/
ul.card .hide{
display           : none;
}
div.keyword_sort ul.portal_area {
margin            : 0 15px;
 padding           : 0;
}
div.keyword_sort ul.portal_area li {
float             : left;
 display           : block;
 width             : 32.1925133%;
 height            : 0;
 padding-top       : 4.0641711%;
 margin-right      : 1.7112299%;
 cursor            : pointer;
 text-indent       : 100%;
 white-space       : nowrap;
 overflow          : hidden;
 background-size   : contain;
 background-repeat : no-repeat;
}
div.keyword_sort ul.portal_area li.csi {
background-image : url(/rd/image/keyword_sort/btn_area1.gif);
}
div.keyword_sort ul.portal_area li.csi.on {
background-image : url(/rd/image/keyword_sort/btn_area1_on.gif);
}
div.keyword_sort ul.portal_area li.csi.off {
background-image : url(/rd/image/keyword_sort/btn_area1_off.gif);
}
div.keyword_sort ul.portal_area li.cti {
background-image : url(/rd/image/keyword_sort/btn_area2.gif);
}
div.keyword_sort ul.portal_area li.cti.on {
background-image : url(/rd/image/keyword_sort/btn_area2_on.gif);
}
div.keyword_sort ul.portal_area li.cti.off {
background-image : url(/rd/image/keyword_sort/btn_area2_off.gif);
}
div.keyword_sort ul.portal_area li.cer {
background-image : url(/rd/image/keyword_sort/btn_area3.gif);
}
div.keyword_sort ul.portal_area li.cer.on {
background-image : url(/rd/image/keyword_sort/btn_area3_on.gif);
}
div.keyword_sort ul.portal_area li.cer.off {
background-image : url(/rd/image/keyword_sort/btn_area3_off.gif);
}
div.keyword_sort ul.portal_area li.off {
cursor            : default;
}
div.keyword_sort ul.portal_area li.LastItem {
margin-right      : 0;
}

/*
カードソート＞キーワード部分
*/
div.keyword_sort {
background-image    : url(/rd/image/keyword_sort/bg_keyword_sort.gif);
 background-position : center bottom;
 background-repeat   : no-repeat;
 padding-bottom      : 15px;
}
div.keyword_sort h2 {
display             : none;
}
div.keyword_sort dl.keyword:after,
div.keyword_sort dl.keyword dd:after {
content             : "";
 display             : block;
 clear               : both;
}
div.keyword_sort dl.keyword {
padding             : 15px 0 0;
 margin              : 0 15px;
}
div.story,
div.story dl.keyword {
padding-top:0;
}
div.keyword_sort dl.keyword dt {
float               : left;
 width               : 215px;
 background          : url(/rd/image/keyword_sort/bg_keyword.png) no-repeat 0 0;
 font-size           : 90%;
 color               : #fff;
 font-weight         : bold;
 margin-top          : 16px;
 padding             : 6px 0;
 text-align          : center;
}
div.keyword_sort dl.keyword dd {
padding             : 15px 0 7px 230px;
 border-top          : 1px solid #ccc;
}

div.story dl.keyword dd.products {
border-top          : none;
}

div.keyword_sort dl.keyword dd ul {
margin              : 0;
}
div.keyword_sort dl.keyword dd ul li {
background          : #fff;
 border              : 1px solid #ccc;
 color               : #666;
 float               : left;
 font-size           : 90%;
 font-weight         : bold;
 margin              : 0 8px 8px 0;
 padding             : 6px;
 cursor              : pointer;
}
div.keyword_sort dl.keyword dd ul li.off {
color               : #ccc;
cursor:default;
}
div.keyword_sort dl.keyword dd ul li.on {
background          : #B1000E;
 border              : 1px solid #B1000E;
 color               : #fff;
}

/*
カードソート＞ホバー
*/
.card_box a:active,
.card_box2 a:active,
.card_box3 a:active {
color           : #666;
 text-decoration : none;
}
.card_box a:hover,
.card_box2 a:hover,
.card_box3 a:hover {
color           : #666;
 text-decoration : none;
}
.card_box a:link,
.card_box2 a:link,
.card_box3 a:link {
color           : #666;
 text-decoration : none;
}
.card_box a:visited,
.card_box2 a:visited,
.card_box3 a:visited {
color           : #666;
 text-decoration : none;
}
.card_box:hover,
.card_box2:hover,
.card_box3:hover {
background      : #f2f0f2;
}
.card_box:hover h2,
.card_box2:hover h2,
.card_box3:hover h2 {
text-decoration : underline;
}
.card_box:hover img,
.card_box2:hover img,
.card_box3:hover img {
filter          : alpha(opacity=50);
 -moz-opacity    : 0.5;
 opacity         : 0.5;
}

/*
各コンテンツ＞領域・キーワード
*/
.Grid1 .portal_area ul li {
margin-bottom   : 15px;
}
.Grid1 .portal_area ul li.hide {
filter          : alpha(opacity=15);
-moz-opacity    : 0.15;
opacity         : 0.15;
}
.Grid1 .BoxPatternC.keyword {
padding        : 10px 0 0;
}
.Grid1 dl.keyword {
padding        : 0 0 2px 10px;
}
.Grid1 dl.keyword dt {
background      :url(/rd/image/keyword_sort/icon_check.png) no-repeat 0 5px;
 padding         : 0 0 5px 28px;
 font-weight     : bold;
 clear           : both;
}
.Grid1 dl.keyword dd {
margin-right: 10px;
}
.Grid1 dl.keyword dd:after {
content         : "";
 display         : block;
 clear           : both;
}
.Grid1 dl.keyword dd.products {
border-bottom   : 2px solid #ccc;
 padding-bottom  : 2px;
 margin-bottom   : 8px;
}
.Grid1 dl.keyword dd ul {
margin          : 0;
 padding         : 0;
}
.Grid1 dl.keyword dd ul li {
border-right    : 2px solid #ccc;
 color           : #666;
 float           : left;
 font-size       : 90%;
 font-weight     : bold;
 margin-bottom   : 6px;
 padding         : 0 10px;
}



@media screen and (max-width:1304px){
.card_box2,
.card_box3 {
 	border: none;
	margin-bottom: 20px !important;
/*	width: 33% !important;*/
}
.card_box2.LastItem,
.card_box3.LastItem {
	margin-right: 0 !important;
}
.card_box2 img,
.card_box3 img{
	max-width: 100%  !important;
}
}



@media screen and (max-width:994px){
.ColumnSet.js_cards {
margin-left: 0;
}
}



@media screen and (max-width:767px){
div.keyword_sort {
padding-top: 0;
	padding-bottom: 0;
	background-color: #666;
	background-image: none;
}
div.keyword_sort h2 {
display: block;
	margin: 0;
	padding: 15px 15px 10px;
	color : #fff;
	font-weight: bold;
	background: url(/rd/image/keyword_sort/icon_minus.gif) no-repeat right center;
}
div.keyword_sort h2.close {
background: url(/rd/image/keyword_sort/icon_plus.gif) no-repeat right center;
}

div.keyword_sort ul.portal_area {
border-top: 1px solid #ccc;
	padding-top: 15px;
}
div.keyword_sort ul.portal_area li {
width: auto;
	height: auto;
	margin: 0 8px 0 0;
	padding: 6px;
	text-indent: inherit;
	white-space: normal;
	overflow: visible;
	font-size: 90%;
	color : #666;
	font-weight: bold;
	background-image: none !important;
	background-color: #fff;
	border: 1px solid #ccc;
}
div.keyword_sort ul.portal_area li.on {
color: #fff;
	background-color: #039;
}
div.keyword_sort ul.portal_area li.off {
color: #ddd;
	background-color: #888;
}

div.keyword_sort dl.keyword dt {
float: none;
	width: 100%;
	padding-top: 10px;
	font-size: 100%;
	text-align: left;
	background: none;
	border-top: 1px solid #ccc;
}
div.keyword_sort.story dl.keyword dt {
margin-top: 0;
}
div.keyword_sort dl.keyword dd {
padding: 0 0 7px 0;
	border-top: none;
}
div.keyword_sort dl.keyword dd ul {
padding: 0; }

.card_box,
.card_box2,
.card_box3 {
width: 100% !important;
	margin: 0 !important;
	background: #eee;
	border-top: none;
	border-right: none;
	border-bottom: 2px solid #fff;
	border-left: none;
}
.card_box2,
.card_box3 {
min-height:0px !important;
}
.card_box a,
.card_box2 a,
.card_box3 a {
display: block;
	box-sizing: border-box;
	width: 100%;
	padding: 15px 30px 15px 15px !important;
	background: url(/rd/image/keyword_sort/icon_arrow.png) no-repeat right center;
}
.card_box a:after,
.card_box2 a:after,
.card_box3 a:after {
display: block;
	clear: both;
	content: "";
}
.card_box img,
.card_box2 img,
.card_box3 img {
float: left;
	width: 40%;
	height: auto;
}
.card_box2 img.flagimg {
display: none !important;
}
.card_box2 .flagtxt {
display: block !important;
}
.card_box span,
.card_box2 span,
.card_box3 span {
display: block;
	margin-left: 45%;
}
.card_box span h2,
.card_box2 span h2,
.card_box3 span h2 {
padding-top: 0;
}
.card_box span p,
.card_box2 span p,
.card_box3 span p {
margin: 0 10px 0 0;
}
.card_box2 span p span.RdBlockWord,
.card_box3 span p span.RdBlockWord {
margin-left: 0;
}

.Grid1 .portal_area ul li {
float: left;
	width: 31.2075983%;
	margin-right: 2.1%;
}
.Grid1 .portal_area ul li.LastItem {
margin-right: 0;
}
}



@media screen and (max-width:579px){
.Grid1 .portal_area ul li {
float: none;
	width: 100%;
	margin-right: 0;
	text-align: left;
}
.Grid1 .portal_area ul li.csi {
background-color: #6f45ba; }
.Grid1 .portal_area ul li.cti {
background-color: #3967c6; }
.Grid1 .portal_area ul li.cer {
background-color: #287928; }
}