body {
margin:0;
padding: 0;
}
@media screen and (max-width: 1024px){ .review_contents_wrap {
font-size: 14px !important;  
}
}
@media screen and (max-width: 480px){ .under_review_contents {
padding-bottom: 45px !important;
}
.review_contents_wrap {
font-size: 12px !important;  
margin-left: 0 !important;
padding: 20px;
}
.rating {
margin-right: 10px !important;
}
.review_body_header .ymd, .review_body_header .name {
margin-left: 10px !important;
font-size: 0.8rem !important;
}
.review_body_area p {
font-size: 0.8rem !important;
}
.rating {
font-size: 0.8rem !important;
}
.rate {
font-size: 0.8rem !important;
}
.rating_wrapper .label { 
font-size: 0.8rem !important;
}  .sp_none {
display: none;
}
.review_header_contents .speach_baloon {
left: 5%;
}
.baloon_for_contents {
display:none;
}
}
.review_parts_top {
position: relative;
}
.review_parts_top::before {
position: absolute;
content: '';
display: inline-block;
top: -180px;
left: 0;
width: 30px;
height: 100%;
background-color: #fff;
animation: lightAnimation 3s ease-in-out infinite;
}
.review_for_header {
height: 56px;
width: 100%;
background-color: #85c322; position: relative;  }
.review_header_contents {
max-width: 980px;
margin:0 auto;
position: relative;
display: flex;
align-items: center;
height: 100%;
}
.speach_baloon  {
box-sizing: border-box;
width: 70px;
background: #fff;
padding: 6px 8px 5px;
left: 0%;
top: 25%;
margin-right: 3px;
position: absolute;
border-radius: 30px;
-webkit-transform-origin:center; -webkit-animation: move_baloon 4s ease-in-out infinite;
} @-webkit-keyframes move_baloon{
5% { -webkit-transform: rotate(-10deg); }  
10% { -webkit-transform: rotate(6deg); }
15% { -webkit-transform: rotate(-3deg); }   
20% { -webkit-transform: rotate(3deg); }    
25% { -webkit-transform: rotate(-2deg); }
30% { -webkit-transform: rotate(1deg); }
35% { -webkit-transform: rotate(-1deg); }
40% { -webkit-transform: rotate(1deg); }
45% { -webkit-transform: rotate(-1deg); }
50% { -webkit-transform: rotate(0deg); }
}
.baloon_wrapper {
width: 100px;  
}
.speach_baloon::before {
content: '';
border: 14px solid transparent;
border-bottom-color: #FFF;
position: absolute;
top: 8px;
left: -12px;
transform: rotate(-23deg);
z-index: 1;
}
.review_body_header .ymd, .review_body_header .name {
font-size: 1.1rem;
}
.rating {
font-size: 1.1rem;
}
.rate {
font-size: 1.1rem;
}
.review_total {
font-weight: bold;
background: #ff2323;
color: #fff;
padding: 3px;
font-size: 0.8rem;
display: inline-block;
line-height: 1em;
border-radius: 10px;
position: absolute;
border: solid 1px #fff;
top: -8px;
right: -7px;
min-width: 1em;
text-align: center;
}
.rating {
margin-right: 20px;
}
.rating_wrapper {
display: flex;
align-items: center;
}
.rating_wrapper .label {
font-weight: bold;
color: #FFF;
margin-right: 25px;
font-size: 1.1rem;
}
.fa {
color: #666;
}
.checked {
color: #fff000;
}
.review_contents {
max-width: 980px;
margin:0 auto;
margin-top: 10px;
margin-bottom: 20px;
}
.review_contents_header {
height: 100px;
}
.review_contents_header p{
margin: 0;
}
.baloon_for_contents {
left: 20px;
top: 27%;
}
.review_contents_wrap {
margin-left: 20px;
}
.review_contents_wrap p{
color: #FFF;
font-size: 1.3rem;
}
.rate {
color: #FFF;
font-weight: bold;
}
.review_contents_total {
color: #FFF;
}
.review_contents_wrap {
font-size: 1.3rem;
font-weight: bold;
}
.review_body_header {
margin-top: 20px;
display: flex;
align-items: center;
}
.review_body_header .ymd,
.review_body_header .name{
margin-left: 20px;
}
.review_contents_body {
padding: 20px;
border: solid #eee 1px;
border-top: none;
box-shadow: 0px 0px 7px 0px #efefef inset;
}
.review_body_area p{
font-size: 1.1rem;
}
.review_row {
border-bottom: 1px dashed #ccc;
margin-bottom: 20px;
}
.review_row:last-of-type {
border-bottom: none;
}
#main .sec08 {
padding-bottom: 30px;
}
.under_review_contents {
padding-bottom: 112px;
}
@keyframes lightAnimation {
0% { -webkit-transform: scale(0) rotate(45deg); opacity: 0; }
80% { -webkit-transform: scale(0) rotate(45deg); opacity: 0.5; }
81% { -webkit-transform: scale(12) rotate(45deg); opacity: 1; }
100% { -webkit-transform: scale(90) rotate(45deg); opacity: 0; }
}
@-webkit-keyframes lightAnimation {
0% { -webkit-transform: scale(0) rotate(45deg); opacity: 0; }
80% { -webkit-transform: scale(0) rotate(45deg); opacity: 0.5; }
81% { -webkit-transform: scale(12) rotate(45deg); opacity: 1; }
100% { -webkit-transform: scale(90) rotate(45deg); opacity: 0; }
}
@media screen and (max-width: 768px){
.lightAnimation { background-color: #fff;}
@keyframes lightAnimation {
0% { transform: scale(0) rotate(45deg); opacity: 0; }
80% { transform: scale(0) rotate(45deg); opacity: 0.5; }
81% { transform: scale(12) rotate(45deg); opacity: 1; }
100% { transform: scale(90) rotate(45deg); opacity: 0; }
}
@-webkit-keyframes lightAnimation {
0% { -webkit-transform: scale(0) rotate(45deg); opacity: 0; }
80% { -webkit-transform: scale(0) rotate(45deg); opacity: 0.5; }
81% { -webkit-transform: scale(4) rotate(45deg); opacity: 1; }
100% { -webkit-transform: scale(50) rotate(45deg); opacity: 0; }
}