@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Template:   cocoon-master
Version:    0.0.5
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
table th{
background-color: #f1f1f1;
}
table th, table td{
border: 1px solid #d0cece;
padding: 2px;
font-weight: 500;
text-align: center;
}
.chart{
width:100%;
}
.rcside{
float:left;
width:45%;
}
.rcdata{
float:left;
width:55%;
margin: 10px 0 20px;
}
.clear{
clear:both;
}
.review-rating{
margin-bottom:5px;
}
.ratings{
display: inline;
background-color: #fafbfc;
border: 1px solid #d0cece;
border-radius: 4px;
padding: 0 5px;
margin-right: 10px;
}
.hosoku{
padding: 10px;
margin-top: -10px;
background-color: #f4f5f7;
}
.hosoku p{
font-size: 16px;
margin:0;
}
.otoku{
position: relative;
top: -2px;
left: 4px;
font-style: italic;
font-size: 13px;
font-weight: bold;
background-color: #798fbb;
color: #fff;
padding: 1px 3px;
border-radius: 4px;
}
.tsujou{
font-weight: 100;
color: #696969;
text-decoration: line-through;
}

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1240px以下*/
@media screen and (max-width: 1240px){
  /*必要ならばここにコードを書く*/
}

/*1030px以下*/
@media screen and (max-width: 1030px){
  /*必要ならばここにコードを書く*/
}

/*768px以下*/
@media screen and (max-width: 768px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
.rcside{
float:unset;
width:100%;
}
.rcdata{
float:unset;
width: auto;
}
.otoku{
top:0;
font-size: 11px;
}
}