div.box_content_sp {
clear: both;
overflow: hidden;
background-image: url('../upload/layout/background-box-content-startpage-001.jpg');
background-repeat: no-repeat;
background-size: cover;
box-shadow: 0.3em 0.3em 0.3em #444444;
}
div.box_content_sp_col_1 {
float: left;
width: 10%;
text-align: center;
margin-top: 10em;
margin-bottom: auto;
}
div.box_content_sp_col_1 img {
max-width: 100%;
height: auto;
}
div.box_content_sp_col_2 {
float: left;
width: 20%;
color: #ffffff;
font-weight: 900;
}
div.box_content_sp_col_2_row_1 {
height: 7em;
}
div.box_content_sp_col_2_row_2 {
font-size: 2em;
}
div.box_content_sp_col_3 {
float: right;
width: 69%;
}
div.box_content_sp_col_3_row_1 {
height: 4em;
font-size: 1.5em;
color: #ffffff;
margin-top: 1em;
}
div.box_content_sp_col_3_row_2 {
background-color: #ffffff;
margin-bottom: 8em;
border-top: 1px solid #777777;
border-left: 1px solid #777777;
}
div.box_content_sp_teaser_news {
overflow: hidden;
}
div.box_content_sp_teaser_news_col_1 {
float:left;
padding: 2%;
width: 5%;
}
div.box_content_sp_teaser_news_col_1 img {
width: 1.5em;
height: 1.5em;
}
div.box_content_sp_teaser_news_col_2 {
float:left;
padding: 2%;
width: 85%;
overflow: hidden;
color: #333333;
}
div.box_content_sp_teaser_news_col_2 h2 {
margin: 0em;
font-size: 1.5em;
color: #333333;
}

/****** size 2 ******/
@media only screen and (max-width: 60em) {
div.box_content_sp_col_2_row_1 {
height: 8em;
}
div.box_content_sp_col_2_row_2,
div.box_content_sp_col_3_row_1 {
font-size: 1.5em;
}
div.box_content_sp_teaser_news_col_1 img {
width: 1.5em;
height: 1.5em;
}
div.box_content_sp_teaser_news_col_2 h2 {
font-size: 1.5em;
}
}
/****** size 3 ******/
@media only screen and (max-width: 40em) {
div.box_content_sp_col_2_row_1 {
height: 6em;
}
div.box_content_sp_col_2_row_2,
div.box_content_sp_col_3_row_1 {
font-size: 1.2em;
}
div.box_content_sp_teaser_news_col_1 img {
width: 1.2em;
height: 1.2em;
}
div.box_content_sp_teaser_news_col_2 h2 {
font-size: 1.2em;
}
div.box_content_sp_teaser_news_col_2 p {
font-size: 0.9em;
}
}
/****** size 4 ******/
@media only screen and (max-width: 30em) {
div.box_content_sp_col_1,
div.box_content_sp_col_2 {
display:none;
}
div.box_content_sp_col_3 {
width: 90%;
}
div.box_content_sp_col_3_row_1 {
font-size: 1em;
}
div.box_content_sp_teaser_news_col_1 img {
width: 1em;
height: 1em;
}
div.box_content_sp_teaser_news_col_2 h2 {
font-size: 1em;
}
}