@charset "UTF-8";


p{
margin:0;
}

.sub_index{
display:block;
width:100%;
margin-top:60px;
padding:15px 5px;
background:#eeeeee;
border-left:solid 5px orange;
font-size:26px;
font-weight:bold;

}

.sample_frame_mobile{
display:block;
width:350px;
height:500px;
border:solid 1px gray;
margin:20px auto 0;
}

.sample_frame{
display:block;
width:100%;
height:500px;
border:solid 1px gray;
margin:20px auto 0;
}

.content_title{
display:block;
width:100%;
margin:30px 0px 10px;
padding:3px 5px;
background:#eeeeee;
border-left:solid 5px #0000ff;
}

.content_title_sub_underline{
margin-top:70px;
}

/*■■■codecontainer■■■*/

pre{
width:100%;
overflow-x:scroll;
/*marginとpaddingを入れることでズレ解消*/
margin:0;
padding:0;
}

.code{
width:100%;

}

.text{
display:flex;
align-items:center;
width:700px;
height:21px;
padding:0 0 0 5px;
margin:0;

}

.textodd{
background:#fff;
}

.texteven{
background:whitesmoke;
}

.code_container{
margin:5px 0 0 0;
padding:0 10px;
border:solid 1px #000;
max-width:900px;
background:#FFFFF0;

}

.code_code{
font-family: 'Noto Sans JP', sans-serif;
line-height:1.3;
}

/*通常サイズのイメージ*/
.img_common{
display:block;
width:100%;
max-width:468px;
margin:20px auto;
}

/*画面最大サイズのイメージ*/
.img_unique{
display:block;
width:100%;
margin:30px auto;
}


/*■■■■■■■■■■スマホ■■■■■■■■■■*/

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

.content_title{
width:98%;

}



}/*スマホ終了タグ*/