@charset "utf-8";
/* CSS Document */

@media screen and (min-width : 1025px ) and (max-width : 1920px ){

    body{
        font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
    }
/*----------------------「神前式ページ」ここから---------------------*/
    .wedding01{
        width: 100%;
    }
    .wedding02{
        width: 100%;
        margin: 0em auto;
        background-image: url("../wedding/img/img02.jpg");
        background-repeat: none;
        background-size: cover;/* レスポンシブに必須 */
        aspect-ratio: 10 / 2; /* アスペクト比を保持してレスポンシブ */
    }
    .wedding02 img{
        display: block;
        width: 11%;
        margin: 0em auto;
    }
    .wedding03{
        display: flex;
        width: 100%;
        margin: 2em auto;
    }
    h1{
        font-size: 2em;
        width: 90%;
        margin: 0em auto 1em auto;
        text-align: center;
    }
    .wedding03 img{
        width: 50%;
        margin: 0em auto;
    }
    .wedding03 p{
        width: auto;
        margin: 0em 2.5em 0em 1.5em;
        font-size: 1.3em;
        line-height: 2;
    }
    .wedding04{
        display: flex;
        width: 100%;
        margin: 2em auto;
    }
    .wedding04 img{
        width: 100%;
    }
    .wedding05{
        display: flex;
        width: 70%;
        font-size: 1.8em;
        margin: 0 auto;
    }
    .wedding05 img{
        width: 40%;
    }
    .wedding05 p{
        object-fit: contain;
        margin: 4em auto;
    }
    .photo2 {
        display: flex;
        width:80%;
        margin: 2em auto 2em auto ;
        justify-content:space-between; /* 子要素を均等に配置・両端揃え */
    }
    .photo2 img{
        display: block;
        width: calc(97%/2);/*←画像を横に2つ並べる場合*/
    }
    .wedding06{
        width: 100%;
        margin: 0em auto 4em auto;
        background-image: url("../wedding/img/img11.jpg");
        background-repeat: none;
        background-size: cover;/* レスポンシブに必須 */
        aspect-ratio: 10 /6.5; /* アスペクト比を保持してレスポンシブ */
        text-align: left;
    }
    .wedding06 h2{
        font-size:2.7rem;
        width: 35%;
        float: right;
        margin: 2em auto .5em auto;
        text-shadow:
    3px 3px 3px  #fff, /* 右下 */
    -3px 3px 3px #fff, /* 左下 */
    -3px -3px 3px #fff, /* 左上 */
    3px -3px 3px #fff; /* 右上 */
    }
    .wedding06 p{
        clear: both;
        float: right; 
        width: 27%;
        object-fit: contain;
        font-size: 1.5em;
        line-height: 2.3em;
        text-shadow:
    1px 1px 5px  #fff, /* 右下 */
    -1px 1px 5px #fff, /* 左下 */
    -1px -1px 5px #fff, /* 左上 */
    1px -1px 5px #fff; /* 右上 */
    }
    .wedding07{
        display: flex;
        width: 90%;
        margin: 0 auto 5em auto;
        justify-content:space-between; /* 両端余白ナシ均等揃え */
    }
    .child1 { order: 1; } /* これが後に表示される 親にあるdisplay:flex とセット */
    .child2 { order: 2; } /* これが前に表示される */
    
    .wedding07-1{
        width:60%;
        margin: 0 auto 1em auto;
    }
    .wedding07-1 a{
        display: block;
        width: 100%;
        margin: 0;
    }
    .wedding07-1 a img{
        display: block;
        width: 100%;
    }
    .wedding08{
        width:45%;
        margin: 0em 2em 0em 0em;
        margin: 0em;
    }
    .wedding08 h1{
        font-size:1.6em;
        width:100%;
        text-align: start;
        margin: 0em ;
        line-height: 1.5em;
    }
    .wedding08 ul{
        width:90%;
        margin: 0em 2em 0em 1em;
    }
    .wedding08 ul li{
        list-style: disc;
        font-size: 1.1em;
    }
    .wedding08 ul li span{
        font-size: 1.2em;
        font-weight: 600;
    }
/*----------------------神前式ページここまで---------------------*/
}

/*----------------------神前式ページタブレットここから---------------------*/
body{
    font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
}

@media screen and (min-width : 600px ) and ( max-width : 1024px ){
    .wedding01{
        width: 100%;
    }
    .wedding02{
        width: 100%;
        margin: 0em auto;
        background-image: url("../wedding/img/img02.jpg");
        background-repeat: none;
        background-size: cover;/* レスポンシブに必須 */
        aspect-ratio: 10 / 1 ; /* アスペクト比を保持してレスポンシブ */
    }
    .wedding02 img{
        display: block;
        width: 13%;
        margin: 0em auto;
    }
    h1{
        width: 95%;
        margin: 0em auto 1em auto;
        text-align: center;
    }
    .wedding03{
        width: 90%;
        margin: 1em auto;
        text-align: center;
    }
    .wedding03 img{
        width: 90%;
     }
    .wedding03 p{
        width: 100%;
        margin: 1em auto;
        font-size: 1.3em;
        line-height: 2;
    }
    .wedding04{
        display: flex;
        width: 100%;
        margin: 2em auto;
    }
    .wedding04 img{
        width: 100%;
    }
    .photo2 {
        display: flex;
        width:95%;
        margin: 1em auto 2em auto ;
        justify-content:space-between; /* 子要素を均等に配置・両端揃え */
    }
    .photo2 img{
        display: block;
        width: calc(98%/2);/*←画像を横に2つ並べる場合*/
    }
    .wedding05{
        display: flex;
        width: 90%;
        font-size: 1.8em;
        margin: 0 auto;
    }
    .wedding05 img{
        width: 40%;
    }
    .wedding05 p{
        object-fit: contain;
        margin: 4em auto;
    }

    .wedding06{
        width: 100%;
        margin: 0em auto 2em auto;
        background-image: url("../wedding/img/img11.jpg");
        background-repeat: none;
        background-size: cover;/* レスポンシブに必須 */
        aspect-ratio: 10 /6.5; /* アスペクト比を保持してレスポンシブ */
        text-align: left;
    }
    .wedding06 h2{
        font-size:2em;
        width: 35%;
        float: right;
        margin: 1em auto .5em auto;
        text-shadow:
    3px 1px 5px  #fff, /* 右下 */
    -3px 1px 5px #fff, /* 左下 */
    -3px -1px 5px #fff, /* 左上 */
    3px -1px 5px #fff; /* 右上 */
    }
    .wedding06 p{
        clear: both;
        float: right; 
        width: 28%;
        object-fit: contain;
        font-size: 1.3em;
        line-height: 2em;
            text-shadow:
    1px 1px 5px  #fff, /* 右下 */
    -1px 1px 5px #fff, /* 左下 */
    -1px -1px 5px #fff, /* 左上 */
    1px -1px 5px #fff; /* 右上 */
    }
    .wedding07{
        clear: both;
        display: flex;
        width:90%;
        margin: 0 auto;
    }
    .wedding07-1{
        width:60%;
        margin: 0 auto 1em auto;
    }
    .wedding07-1 a{
        display: block;
        width: 100%;
        margin: 0;
    }
    .wedding07-1 a img{
        display: block;
        width: 100%;
    }
    .wedding08{
        width:45%;
        margin: 0em 2em 0em 0em;
        margin: 0em;
    }
    .wedding08 h1{
        font-size:1.6em;
        width:100%;
        text-align: start;
        margin: 0em ;
        line-height: 1.5em;
    }
    .wedding08 ul{
        width:90%;
        margin: 0em 2em 0em 1em;
    }
    .wedding08 ul li{
        list-style: disc;
        font-size: 1.1em;
    }
    .wedding08 ul li span{
        font-size: 1.2em;
        font-weight: 600;
    }
    .child1 { order: 1; } /* これが後に表示される display:flex とセット */
    .child2 { order: 2; } /* これが前に表示される */
/*----------------------神前式ページタブレットここまで---------------------*/
}


/* 〜599px　神前式ページ　モバイルここから------------------------------ */

@media screen and (max-width : 599px ){
    *{
        font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
    }
    .wedding01{
        width: 100%;
    }
    .wedding02{
        width: 100%;
        margin: 0em auto;
        background-image: url("../wedding/img/img02.jpg");
        background-repeat: none;
        background-size: cover;/* レスポンシブに必須 */
        aspect-ratio: 10 / 2 ; /* アスペクト比を保持してレスポンシブ */
    }
    .wedding02 img{
        display: block;
        width: 15%;
        margin: 0em auto;
    }
    h1{
        width: 95%;
        margin: 0em auto 1em auto;
        text-align: center;
        font-size: 1.5em;
    }
    .wedding03{
        width: 90%;
        margin: 1em auto;
    }
    .wedding03 img{
        width: 100%;
     }
    .wedding03 p{
        width: 100%;;
        font-size: 1.1em;
        line-height:1.7;
    }
    .wedding04{
        width: 100%;
        margin: 2em auto;
    }
    .wedding04 img{
        width: 100%;
    }
    .photo2 {
        width:90%;
        margin: 2em auto 2em auto ;
    }
    .photo2 img{
        width:100%;
        display: block;
        margin: 2em auto 0em auto ;
    }
    .wedding05{
        width: 90%;
        font-size: 1.2em;
        margin: 0 auto;
    }
    .wedding05 img{
        width: 100%;
        margin: 0 auto;
    }
    .wedding05 p{ 
        margin: 2em auto;
        text-align: center;
    }
    .wedding06{
        width: 100%;
        margin: 0em auto 2em auto;
        background-image: url("../wedding/img/img11.jpg");
        background-repeat: none;
        background-size: cover;/* レスポンシブに必須 */
        aspect-ratio: 10 /6.5; /* アスペクト比を保持してレスポンシブ */
    }
    .wedding06 h2{
        text-align: right;
        font-size:1.1em;
        width: 85%;
        margin: 0 auto;
        color: #000; /* 文字の色 */
        text-shadow: 
            1px 1px 5px #fff, /* 右下 */
            -1px 1px 5px #fff, /* 左下 */
            -1px -1px 5px #fff, /* 左上 */
            1px -1px 5px #fff; /* 右上 */
    }
    .wedding06 p{
        width: 90%;
        object-fit: contain;
        font-size: 1em;
        text-align: right;
        color: #000; /* 文字の色 */
        text-shadow:
            1px 1px 3px  #fff, /* 右下 */
            -1px 1px 3px #fff, /* 左下 */
            -1px -1px 3px #fff, /* 左上 */
            1px -1px 3px #fff; /* 右上 */
    }
     .wedding07{
        width:90%;
        margin: 0 auto 1em auto;
    }   
    .wedding07-1{
        width:100%;
        margin: 0 auto 0em auto;
    } 
    .wedding07-1 a{
        display: block;
        width: 100%;
        margin: 0;
    }
    .wedding07-1 a img{
        display: block;
        width: 100%;
    }
    .wedding08{
        width:100%;
        margin: 0em auto;
    }
    .wedding08 h1{
        font-size:1.3em;
        width:100%;
        text-align: start;
        margin: 1em 0em 0em 0em;
        line-height: 1.5em;
    }
    .wedding08 ul{
        width:100%;
        margin: 0em 0em 0em 1em;
    }
    .wedding08 ul li{
        list-style: disc;
        font-size: 1em;
    }
    .wedding08 ul li span{
        font-size: 1.2em;
        font-weight: 600;
    }
/*----------------------神前式ページモバイルここまで---------------------*/

}



