/*お知らせ共通書式*/
#oshirase {
    margin-left: 50px;
    margin-right: 50px;
    padding-bottom: 100px;    
}

#oshirase p {
    margin-top: 0;
    margin-bottom: 0;
}

#oshirase h3 {
    margin-top: 1em;
    margin-bottom: 0;
}

.indent-1 {
    margin-left: 1em;
}

.indent-2 {
    margin-left: 2.5em;
}

.indent-3 {
    margin-left: 3em;
    padding-bottom: 0.5em;
}

.burasage-1 {
    text-indent: -1.5em;
    padding-left: 1.5em;
}


#date {
    text-align: right;
}

#to-1 {
    margin-left: 1em;
}

#to-2 {
    margin-left: 2em;
}

#send-1 {
    text-align: right;
    margin-right: 2em;
}

#send-2 {
    text-align: right;
    margin-right: 1em;
}

.center {
    margin-top: 1em;
    margin-bottom: 1em;
    text-align: center;
}

.center > h1 {
    font-size: 50px;
}

#kagamibun p {
    text-indent: 1em;
}

.katakana {
    margin-top: 0;
    margin-bottom: 0;
}

.katakana li {
    list-style: none;
    text-indent: -2em;
    margin-left: 1.5em;
}

.katakana li:nth-of-type(1)::before {
    content: "ア";
    margin-right: 1em;
}

.katakana li:nth-of-type(2)::before {
    content: "イ";
    margin-right: 1em;
}

.katakana li:nth-of-type(3)::before {
    content: "ウ";
    margin-right: 1em;
}

.katakana li:nth-of-type(4)::before {
    content: "エ";
    margin-right: 1em;
}

.katakana li:nth-of-type(5)::before {
    content: "オ";
    margin-right: 1em;
}

.katakana li:nth-of-type(6)::before {
    content: "カ";
    margin-right: 1em;
}

.katakana li:nth-of-type(7)::before {
    content: "キ";
    margin-right: 1em;
}

.katakana li:nth-of-type(8)::before {
    content: "ク";
    margin-right: 1em;
}

.katakana li:nth-of-type(9)::before {
    content: "ケ";
    margin-right: 1em;
}

.katakana li:nth-of-type(10)::before {
#detail     content: "コ";
    margin-right: 1em;
}

.kakko li {
    list-style: none;
    text-indent: -2em;
    margin-left: 1em;
    margin-bottom: 10px;
}

.kakko li:nth-of-type(1)::before {
    content: "（１）";
    margin-right: 0;
}

.kakko li:nth-of-type(2)::before {
    content: "（２）";
    margin-right: 0;
}

.kakko li:nth-of-type(3)::before {
    content: "（３）";
    margin-right: 0;
}

.kakko li:nth-of-type(4)::before {
    content: "（４）";
    margin-right: 0;
}

.kakko li:nth-of-type(5)::before {
    content: "（５）";
    margin-right: 0;
}

.kakko li:nth-of-type(6)::before {
    content: "（６）";
    margin-right: 0;
}

.kakko li:nth-of-type(7)::before {
    content: "（７）";
    margin-right: 0;
}

.kakko li:nth-of-type(8)::before {
    content: "（８）";
    margin-right: 0;
}

.kakko li:nth-of-type(9)::before {
    content: "（９）";
    margin-right: 0;
}

.kakko li:nth-of-type(10)::before {
    content: "（10）";
    margin-right: 0;
}

.maru {
    list-style: none;
    padding-left: 1.5em;
    margin-top: 0;
}

.maru li {
    padding-left: 2.5em;
    text-indent: -2em;
}

.maru li::before {
    font-size: 20px;
    padding-right: 0.5em;
}

.maru li:nth-of-type(1)::before {
    content: "①";
}

.maru li:nth-of-type(2)::before {
    content: "②";
}

.maru li:nth-of-type(3)::before {
    content: "③";
}

.maru li:nth-of-type(4)::before {
    content: "④";
}

.maru li:nth-of-type(5)::before {
    content: "⑤";
}

.kome {
    margin-left: 2em;
    padding: 0;
    list-style: none;
}

.kome li {
    margin-left: 2em;
    margin-bottom: 5px;
    text-indent: -2em;
}

.kome li:before {
    content: "※";
    margin-right: 1em;
}

.dot {
    list-style: none;
    margin: 0 0 0 1.5em;
    padding: 0;
}

.dot li {
    text-indent: -1.5em;
    margin-left: 1.3em;
}

.dot li:before {
    content: "・";
    margin-right: 0.3em;
}

#detail h3 {
    font-weight: 500;
}

#detail > h3 > span {
    margin-left: 1.2em;
    display: inline-block;
    text-align-last: justify;
}

#detail h4 {
    font-weight: normal;
    margin-top: 10px;
    margin-bottom: 5px;
}

.contact {
    text-align: right;
}

.contact > div {
    display :inline-block;
    border: solid 1px #000000;
    padding: 0 30px 10px 30px;
    margin:50px;
}

.contact h3 {
    margin: 0;
    text-align: left;
}

.contact dl {
    display: flex;
    flex-direction: row;
    margin-top: 0;  
    margin-bottom: 0;
}

.contact dt {
    display: inline-block;
    flex-shrink: 0;
    flex-basis: 4.6em;
    text-align-last: justify;
}

.contact dt > span {
    letter-spacing: 2px;
}

.contact dd {
    text-align: left;
    margin-left: 2em;
    overflow-wrap: break-word; /* 長い単語を折り返す */
    word-break: break-word; /* 必要なら適用 */\
}

#attachment {
    margin-top: 50px;
    text-align: center;
}

#attachment > div {
    border: solid 3px navy;
    border-radius: 20px;
    display: inline-block;
    padding: 10px 50px 10px 50px;
    min-width: 700px;
}

#attachment ul {

}

#attachment li {

    text-align : left;
}

.photo img {
    height: 215px;
    object-fit: cover; /* 画像のアスペクト比を保持しつつフィットさせる */
}

.photo img.h180 {
    height: 180px;
}

.photo img.h200 {
    height: 200px;
}

.photo img.h250 {
    height: 250px;
}

.photo img.h300 {
    height: 300px;
}

.photo img.h350 {
    height: 350px;
}

.photo img.h400 {
    height: 400px;
}

.photo img.h500 {
    height: 500px;
}

.photo img.h600 {
    height: 600px;
}

.photo img.h700 {
    height: 700px;
}

.photo span {
    display: block;
}


/* 画面幅が767px以下のとき */
@media screen and (max-width: 767px) {
    #oshirase {
        margin-left: 30px;
        margin-right: 30px;
        padding-bottom: 100px;    
    }
    
    .contact {
        text-align: center;
    }

    .contact > div {
        display: block;
        margin-left: 0;
        margin-right: 0;
    }

    .contact dt > span {
        letter-spacing: 2px;
    }

    .contact dt {
        text-align-last: justify;
    }

    .contact dd {


    }

    #attachment > div {
        display: block;
        min-width: auto;
        width: 100%;
    }

    .photo img {
        width: 100%;
    }
    
    .photo img.h180 {
        height: auto;
    }
    
    .photo img.h200 {
    }
    
    .photo img.h250 {
        height: auto;
    }
    
    .photo img.h300 {
        height: auto;
    }
    
    .photo img.h350 {
        height: auto;
    }
    
    .photo img.h400 {
        height: auto;
    }

    .photo img.h500 {
        height: auto;
    }
    
    .photo img.h600 {
        height: auto;
    }

    .photo img.h700 {
        height: auto;
    }

    .photo img.tatemuki {
        width: 70%;
    }
}