/*     BODY     */
body {
    font-family: "游ゴシック","YuGothic","zurich-bt","游明朝", "YuMincho","ヒラギノ角ゴ ProN W3","HiraKakuProN-W3","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,"ＭＳ Ｐゴシック","helvetica","arial",sans-serif;
    font-size: 17px;
    color: #333;
    line-height: 26px;
}

/*　　　　　HEADER, FOOTER　　　　　*/
header {
    text-align: left;
}

footer {
    text-align: center;
    font-size: 10px;
    line-height: 1em;
    margin-top: 10px;
    margin-bottom: 10px;
}

.home {
    height: 50px;
    margin: 15px 0 0 -20px;
}

/*     DIV     */
/*indexページ上部*/
.top {
    background:rgba(139,170,189,0.1);
    font-weight: bold;
    text-align: center;
}

/*indexページ下部と操作ページ*/
.feature, .operation {
    margin-top: 50px;
    margin-left: auto;
    margin-right: auto;
    width: 360px;
    }

.top .feature {
    margin-top: 0;
}

.image {
    text-align: center;
    }

/*　　　　　画像（通常画像、小サイズ画像）　　　　　*/
img {
    width: 200px;
    }

.small {
    width: 100px;
}

/*　　　　　見出し　　　　　*/
h1 {
    font-size: 35px;
    font-weight: bold;
    }

h2 {
    font-size: 28px;
    font-weight: bold;
    }

.image h2 {
    margin-bottom: 20px;
}

h3 {
    font-size: 23px;
    font-weight: bold;
    }

.operation h3 {
    margin-top: 50px;
    }

hr {
    color:#333;
    margin: 0 0 50px 0;
    }

/*　　　　　注記　　　　　*/
.note {
    font-size: 14px;
    line-height: 23px;
    margin: 0;
}

p:first-of-type{
    margin-bottom: 0;
}

p:nth-of-type(2){
    margin-bottom: 0;
}

/*　　　　　補足　　　　　*/
/*見出し*/
.bold {
    font-weight: bold;
}

/*　　　　　「上へ」　　　　　*/
.backToTop {
    text-align: right;
    font-weight: bold;
    margin: 0;
}

/*　　　　　リンク　　　　　*/
a {
    text-decoration:none;
    color: rgb(0, 0, 205);
    }

a:hover {
    text-decoration:underline;
    }

a:active {
    text-decoration:none;
    }

h1 a {
    color: #333;
}

/*　　　　　箇条書き（目次、操作説明）　　　　　*/
/*目次：左寄せ中央揃え*/
ul {
    display: table;
    text-align: left;
    margin-left: auto;
    margin-right: auto;
    padding: 0;
}

.top ul{
    padding-bottom: 20px;
    margin-top: 0;
}

.operation ul {
    padding-left: 20px;
}

/*　　　　　操作手順（大手順：丸数字、手順：連番）　　　　　*/
ol {
    padding-left:25px;
}

.noStyle li {
    list-style: none;
}

.step {
    list-style: none;
    font-size: 20px;
    font-weight: bold;
    margin-left: 0px;
    padding-left: 0px;
}

ol li {
    margin-bottom: 50px;
}

ol li p {
    font-weight: normal;
    font-size: 17px;
    margin: 0;
}

.step ol {
    list-style: decimal;
    font-weight: normal;
    font-size: 17px;
}

ol img {
    display:block;
    margin: auto;
    margin-top: 10px;
}



/*　　　　　タブレット～PC　　　　　*/
@media screen and (min-width:900px) { 
footer {
    text-align: right;
    margin-right: 10px;
}

.feature, .operation {
    width: 900px;
}
    
.feature {
    display: flex; 
    column-gap: 20px;
    justify-content:center;
    align-items:center;
    
}

.feature:nth-child(even) {
    flex-flow: row-reverse;
}

.top .feature {
    margin-top: 3px;
}

.top ul {
    margin-left: 20px;
    margin-bottom: 0;
}

.image {
    padding: 0;
    margin: 0;
}

h1, h2 {
    margin: 0;
    padding: 0;
    }

.image h2 {
    text-align: left;
}

.top .text {
    text-align: left;
}

.text {
    padding: 0 10px 10px 0px;
    width: 700px;
}

.image {
    width: 200px;
}

.operation img {
    margin-left: 50px;
    margin-bottom: 10px;
}

img.small {
    margin-left: 100px;  
}
}



