@charset "utf-8";
@import url(https://fonts.googleapis.com/css?family=Roboto:400,700,500);
@import url(https://fonts.googleapis.com/css?family=Raleway:400,500);

* { margin: 0; padding: 0; }
img { max-width:100%; }
iframe { max-width:100%;}

.clear { clear: both; }

.page_title {
    text-align: center;
    font-size: 34px;
    color: #f55907;
    font-weight: bold;
    text-transform: uppercase;
    padding :25px 0;
    font-family: 'Roboto', sans-serif;
    background: url(../png/scrum-pattren.png) repeat;
    border-bottom: 5px solid #f55907;
    margin-top: 0px;
    margin-bottom: 0;
}
.page_title span { color: #424242; }

.GrayCover { background: #f8f8f8; margin: 56px 0 0 0; border: 1px solid #f1f1f1; padding: 12px; }
.GrayCoverInner { background: #fff; border: 1px solid #ececec; margin: 0px; padding: 10px 15px 15px 15px; }

/*PressSection*/
.media-box-wrapper {
    width: 33%;
    float: left;
    border-top: 7px solid #f8f8f8;
}
.media-box-wrapper:nth-child(1), .media-box-wrapper:nth-child(2), .media-box-wrapper:nth-child(3) {
    border-top: none;
}
.media-box-wrapper:nth-child(3n+1) {
    clear: both;
}
/*PressPart*/
.media-box {
    padding: 10px 0;
    margin: 10px;
}
.media-box img {
    border: 4px solid #e7e7e7;
    width: 100%;
}
/*PressDescription*/
.media-description {
    font-family: 'Droid Sans', sans-serif; 
}
.media-description img {
    border: none; float:left; width: 15%; 
}
.media-description p { font-size:14px; color:#5a5a5a; line-height:21px; float: left; width: 80%; padding-left: 5%; }
.media-description p span { color:#f6490d; font-weight:bold;}
.media-description .date { clear: both; font-size:12px; display: inline-block; color:#7b7b7b; width: 80%; padding: 8px 0 0 20%; }

@media screen and (max-width:1024px) {
}

@media screen and (max-width:990px) {
}

@media screen and (max-width:897px) {
}

@media screen and (max-width:767px) {
    .media-box-wrapper { width: 100%; float: none; }
    .media-description img {
        width: 8%; 
    }
    .media-description p { width: 50%; padding-left: 2%; }
    .media-description .date { width: 100%; padding-left: 10%; }
}

@media screen and (max-width:480px){
    .media-description img {
        width: 15%; 
    }
    .media-description p { width: 60%; padding-left: 5%; }
    .media-description .date { padding-left: 20%; }
}