@import url('https://fonts.googleapis.com/css2?family=Sorts+Mill+Goudy&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP&display=swap');
<style > @import url("https://use.typekit.net/mmz2ceg.css");

</style > :root {
    --ff-serif: 'Noto Serif JP', serif;
    --ff-sansserif: 'Noto Sans Japanese', sans-serif;
    --ff-en: 'Sorts Mill Goudy', serif;
    --color-blue: #08587B;
}

/*2022SS topys saleここから*/
/*2022SS topys saleここから*/

#ss22 {
    max-width: 1920px;
    margin: 0 auto;
    color: #454545;
    letter-spacing: .14em;
    margin-top: 180px;
    font-family: var(--ff-serif);
}

#ss22 img {
    width: 100%;
}

.loading {
    width: 100vw;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 100;
    background-color: #fff;
}

.loading img {
    padding-top: 156px;
    width: 200px !important;
}

.fade1 {
    animation: fadeIn 1.5s ease 0s 1 normal;
}


@keyframes fadeIn {

    /*animetion-nameで設定した値を書く*/
    0% {
        opacity: 0;
    }

    /*アニメーション開始時は不透明度0%*/
    100% {
        opacity: 1;
    }

    /*アニメーション終了時は不透明度100%*/
}

.ss22mv {
    padding-top: 80px;
    padding-bottom: 80px;
}

.l-container {
    max-width: 1024px;
    box-sizing: border-box;
    margin: 0 auto;
}

.ss22mv__img {
    position: relative;
    top: 37px;
}

.ss22lead__container {
    padding: 115px 150px 90px 150px;
}

.ss22lead__text {
    margin-top: 80px;
    font-size: 18px;
    line-height: 2.22;
    text-align: center;
    letter-spacing: 0.12em;
}

.ss22pick_sale {
    padding-top: 50px;
    padding-bottom: 150px;
    display: flex;
    justify-content: center;
    flex-direction: column;
}

.col_yew {
    background-color: #FFFAED;
}

.col_wh {
    background-color: #ffffff;
}

.section_inner {
    max-width: 1024px;
    margin: 0 auto;
    padding: 0 20px;
}

.flex {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.colum {
    display: flex;
    flex-direction: column;
    margin-bottom: 15px;
}

.flex .imgBox {
    width: 320px;
    margin-bottom: 0.5em
}

.ttl_text{
    margin: 0 auto;
    text-align: center;
    font-size: 22px;
    line-height: 1.5em;
    font-family: Noto Serif JP;
}

.sub_ttl_center{
    display: flex;
    justify-content: center;
    margin: 80px auto 80px;
}

.sub_ttl_center_off{
    display: flex;
    justify-content: center;
    margin: 60px auto 80px;
}

.sub_ttl_newitem{
    max-width: 310px;
}

.sub_ttl_off{
    max-width: 386px;
}

.ss22pick__ttl__img01 {
    max-width: 785px;
    margin: 0 auto;
}

.ss22pick__ttl__img02,
.ss22pick__ttl__img03 {
    max-width: 871px;
    margin: 0 auto;
}

.ss22pick__ttl__img04 {
    max-width: 745px;
    margin: 0 auto;
}

.ss22pick__ttl__img05 {
    max-width: 664px;
    margin: 0 auto;
}
