
/*--------------------------
         article
------------------------------*/

* {
    word-break:normal;
}


.article-wrapper{
    width: 1000px;
    margin: 0 auto;
    max-width: 90%;
}

.content h1{
    font-size:30px;
    border-bottom:0.5px solid #a9a9a9;
    margin-bottom: 20px;
    padding-bottom:15px;
    padding-top: 30px;
}

.content p{
    padding:20px 0 ;
    line-height:2.3;
}

.content h2{
  border:0.5px solid #a9a9a9;
  border-left:6px solid #0577c9;
  padding:20px  0 20px 20px;
  font-size:20px;
  margin-top: 50px;
}




/*-----------------
インターネット仕組み
-----------------*/


.mechanism-container{
    width: 100%;
    position: relative;

}

.wrappermechanism { 
    width: 1250px;
    margin: 0 auto;
    margin-top:100px;
    max-width: 90%;
    margin-bottom: 100px;
}

.img-internet{
    position: relative;
    left: -2%;
    width: 650px; 
    z-index:2;
    max-width: 60%;
}

figure{
    position: relative;
}

.p{
    font-size: 16px;  /*11/16にフォントサイズを15から16に変更*/
    position: absolute;
    left: 60%;
}





.p-data_center,.en-p-data_center{
    position: absolute;
    z-index: 1;
    top: 2%; /*変更前は10*/

}

.p-pacific_crossing,.en-p-pacific_crossing{
    position: absolute;
    z-index: 1;
    top: 25%;
}

.p-network_center,.en-p-network_center{
    position: absolute;
    z-index: 1;
    top: 44%;
}

.p-base_station,.en-p-base_station{
    position: absolute;
    z-index: 1;
    top: 64%;
}

.p-smartphone,.en-p-smartphone{
    position: absolute;
    z-index: 1;
    top: 91%;
}



.pacific{
    position: absolute;
    z-index: 0;
    top: 19.35%;
    height: 16.45%;
    width: 100vw;
    background-color: rgb(124, 203, 255);
    
}

@media screen and (max-width: 767px){
    .p p{
    font-size: 11px;
    line-height: 1.6;
    }
    h3{font-size: 12.5px;}
    .content p{
    padding: 5px;
    }
    .pc{
        display: none;
    }

    .en-p-data_center{
        position: absolute;
        z-index: 1;
        top: 0%; /*変更前は10*/
    
    }
    
    .en-p-pacific_crossing{
        position: absolute;
        z-index: 1;
        top: 20.5%;
    }
    
    .en-p-network_center{
        position: absolute;
        z-index: 1;
        top: 36.5%;
    }
    
    .en-p-base_station{
        position: absolute;
        z-index: 1;
        top: 61%;
    }
    
    .en-p-smartphone{
        position: absolute;
        z-index: 1;
        top: 91%;
    }

}

@media screen and (max-width: 369px){
    .en-p-data_center{
        position: absolute;
        z-index: 1;
        top: -12%; /*変更前は10*/
    
    }
    
    .en-p-pacific_crossing{
        position: absolute;
        z-index: 1;
        top: 15.5%;
    }
    
    .en-p-network_center{
        position: absolute;
        z-index: 1;
        top: 36.5%;
    }
    
    .en-p-base_station{
        position: absolute;
        z-index: 1;
        top: 66.5%;
    }
    
    .en-p-smartphone{
        position: absolute;
        z-index: 1;
        top: 102.5%;
    }

}