@charset "UTF-8";

/* 1280px以上 */
@media only screen and (min-width:1281px) {
.ec {
background-size:cover;
background-position:right center; /*横×縦*/
background-repeat:no-repeat;
border-bottom:1px dotted #ccc;
}
.ec-w960 {
width:98%;
padding:0 1%;
max-width:970px;
height:260px;
margin:0 auto;
position:relative;
display: flex; /*v-align-center*/
align-items: center; /*v-align-center*/
}
.bg-screen {background:url("img/bg-dot-w.png"); z-index:1;}
}

h1{position:relative;}
h1:before {
content: "";
position: absolute;
background:#3399ff;
width:70px;
height:70px;
border-radius:50%;
top:50%;
left:-4px;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
z-index: -1;
}

/* 1280px以下 */
@media only screen and (max-width:1281px) {
.ec {
background-size:cover;
background-position:center center; /*横×縦*/
background-repeat:no-repeat;
}
.ec-w960 {
width:98%;
padding:0 1%;
max-width:960px;
height:220px;
margin-left:auto;
margin-right:auto;
position:relative;
display: flex; /*v-align-center*/
align-items: center; /*v-align-center*/
}
.bg-screen {background:url("img/bg-dot-w.png"); z-index:1;}
}

/*480px以下 */
@media only screen and (max-width:480px) {
.ec {
background-size:cover;
background-position:right 0px center; /*--横の位置 縦の位置--*/
background-repeat:no-repeat;
}
.ec-w960 {
width:96%;
padding:0 2%;
max-width:641px;
height:190px;
margin:0 auto;
position:relative;
display: flex; /*v-align-center*/
align-items: center; /*v-align-center*/
}
.bg-screen {background:url("img/bg-dot-w.png"); z-index:1;}
}
/*480px以下*/