@charset "utf-8";
/* CSS Document */





#service-box{
margin: 0 auto;
max-width: 1200px;
padding: 60px 3% 100px;
}



.service-block{
float: left;
width: 30.3%;
margin: 0 1.5% 100px;
padding: 60px 3% 50px;
box-sizing: border-box;
position: relative;
background-color: #FFFFFF;
}

.block-theme{
position: absolute;
top: -35px;
left: 5%;
font-family: 'Raleway', sans-serif;
font-weight: 400;
font-size: 20px;
letter-spacing: 5px;
line-height: 1.4;
background-color: #333333;
color: #FFFFFF;
padding: 10px 30px;
}

h2,h3,h4,h5{
font-weight: bold;
margin-bottom: 5px;
}

.block-line{
width: 0;
border-bottom: 4px solid;
margin-bottom: 15px;
transition: 1s;
-moz-transition: 1s;
-webkit-transition: 1s;
-o-transition: 1s;
-ms-transition: 1s;
}

#line-web{
color: #28ACAA;
}

#line-print{
color: #C98586;
}

#line-planning{
color: #54B067;
}

#line-branding{
color: #152967;
}

#line-school{
color: #CCC55F;
}












/*tablet*/
@media(min-width: 768px) and (max-width: 991px){









}



@media(max-width: 767px){




.service-block{
float: none;
width: 96%;
margin: 0 2% 100px;
padding: 60px 5% 50px;
}

.block-theme{
font-size: 18px;
}

.block-line{
border-bottom: 3px solid;
}


}