@charset "Shift_JIS";

/************************　モジュール*/

#relation > *{
box-sizing: border-box;
}

/************************　製品情報セクション*/

.product-info-box {
border: 1px solid #ccc;
padding: 20px;
margin-bottom: 20px;
}

.product-info-list {
margin-bottom: 0;
}

/************************　relation*/

#relation .br-sm{
display: none;
}

#relation .br-pc{
display: block;
}



#relation .relation-01 .ColumnSet,
#relation .relation-02 .ColumnSet{
margin-bottom: 10px;
margin-top: 20px;
}

#relation .relation-01 .ColumnSet .FirstItem,
#relation .relation-02 .ColumnSet .FirstItem{
width: 30%;
margin: 0 20px 0 0;
background-image: url("/products/it/bigdata/platform/pentaho/productinfo/images/icon_arrow.png");
background-repeat: no-repeat;
background-position: right center;
}


#relation .relation-01 .ColumnSet .FirstItem ul,
#relation .relation-02 .ColumnSet .FirstItem ul{
width: 80%;
}

#relation .relation-01 .ColumnSet .FirstItem ul li,
#relation .relation-02 .ColumnSet .FirstItem ul li{
background-color: #eee;
border: solid thin #ccc;
border-radius: 10px;
text-align: center;
padding: 10px;
margin-bottom: 10px;
}


#relation .relation-01 .ColumnSet .LastItem,
#relation .relation-02 .ColumnSet .LastItem{
width: 65%;
margin: 0 0 0 10px;
}



#relation .relation-01 .ColumnSet .LastItem{
display: flex;
justify-content: space-between;
align-items: center;
}


#relation .relation-01 .ColumnSet .LastItem dl,
#relation .relation-02 .ColumnSet .LastItem dl{
padding: 10px;
border-radius: 10px;
background-color: #5970BE;
color: #fff;
}

#relation .relation-01 .ColumnSet .LastItem dl dt{
text-align: center;
padding: 10px;
}

#relation .relation-02 .ColumnSet .LastItem dl dt{
text-align: left;
padding: 10px;
}


#relation .relation-01 .ColumnSet .LastItem dl dt strong,
#relation .relation-02 .ColumnSet .LastItem dl dt strong{
border-bottom: dotted thin #fff;
padding-bottom: 0.5em;
display: block;
}

#relation .relation-01 .ColumnSet .LastItem dl:first-child{
width: 65%;
}

#relation .relation-01 .ColumnSet .LastItem dl:first-child strong,
#relation .relation-02 .ColumnSet .LastItem dl:first-child strong{
color: #fff;
}

#relation .relation-01 .ColumnSet .LastItem dl:first-child dd,
#relation .relation-02 .ColumnSet .LastItem dl:first-child dd{
padding: 10px;
}

#relation .relation-01 .ColumnSet .LastItem dl:first-child dd ul li,
#relation .relation-02 .ColumnSet .LastItem dl:first-child dd ul li{
list-style: disc;
margin:  0 0 1em 1em;;
}


#relation .relation-01 .ColumnSet .LastItem dl dd .TextStyle2,
#relation .relation-02 .ColumnSet .LastItem dl dd .TextStyle2{
margin: 0px;
}


#relation .relation-01 .ColumnSet .LastItem dl:first-child dd ul li:last-child{
margin-bottom: 0em;
}


#relation .relation-01 .ColumnSet .LastItem dl:last-child{
border: solid 2px #5970BE;
border-radius: 10px;
background-color: #fff;
margin-left: 10px;
}

#relation .relation-01 .ColumnSet .LastItem dl:last-child strong{
color: #5970BE;
}

#relation .relation-01 .ColumnSet .LastItem dl:last-child ul li{
text-align: center;
background-color: #5970BE;
border-radius: 100px;
color: #fff;
padding: 0 8px;
margin-bottom: 10px;
}

#relation .relation-02 .ImgOnlyStyle{
margin-top: 30px;
}



/* [-] レスポンシブ対応
=========================================================================================== */


/* for - 1280px
=========================================================================================== */
@media screen and (max-width: 1280px) {
}

/* for - 845px
=========================================================================================== */
@media screen and (max-width: 845px) {
}
/* for - 768px
=========================================================================================== */
@media screen and (max-width: 768px) {


/************************　モジュール*/


#relation .br-sm{
display: block;
}

#relation .br-pc{
display: none;
}

/************************　relation*/

#relation .relation-01 .ColumnSet,
#relation .relation-02 .ColumnSet{
margin-bottom: 50px;
margin-top: 10px;
}


#relation .relation-01 .ColumnSet .FirstItem,
#relation .relation-02 .ColumnSet .FirstItem{
width: 100%;
margin: 0 0 20px 0;
padding-bottom: 40px;
background-image: url("/products/it/bigdata/platform/pentaho/productinfo/images/icon_arrow_02.png");
background-repeat: no-repeat;
background-position: center bottom;
}

#relation .relation-01 .ColumnSet .FirstItem ul,
#relation .relation-02 .ColumnSet .FirstItem ul{
width: 100%;
}

#relation .relation-01 .ColumnSet .FirstItem ul li,
#relation .relation-02 .ColumnSet .FirstItem ul li{
margin-bottom: 10px;
}


#relation .relation-01 .ColumnSet .LastItem,
#relation .relation-02 .ColumnSet .LastItem{
width: 100%;
margin: 0 0 0 0;
}

#relation .relation-01 .ColumnSet .LastItem{
display: block;
}

#relation .relation-01 .ColumnSet .LastItem dl:first-child{
width: auto;
margin-bottom: 10px;
}

#relation .relation-01 .ColumnSet .LastItem dl:last-child{
margin-left: 0px;
}



}
/* for - 579px
=========================================================================================== */
@media screen and (max-width: 579px) {
}
/* for - 399px
=========================================================================================== */
@media screen and (max-width: 399px) {
}