/* カスタマイズ用CSS */

.pc{
    display: none;
}
.sp{
    display: block;
}

#header-logo{
    border-bottom: solid 3px #bf1b17;
    width: 100%;
}

.header-in{
    display: flex;
    flex-wrap: wrap;
    width: 90%;
    max-width:1200px;
    margin: 0 auto;
    height: 60px;
    justify-content: space-between;
    align-items: center;
}

.header-in p:first-child{
    width: 35%;
    max-width: 350px;
    min-width: 190px;
    margin-left: 5vw;
}

.header-in p:first-child img{
    width: 100%;
}

#header-logo .header-contact{
    display: block;
    color: white;
    width: fit-content;
    padding: 0.4em 1.5em 0.3em;
    border-radius: 9999px;
    background-color: #bf1b17;
    font-size: 16px;
}

#header-logo .header-contact img{
    width: 1.3em;
    padding-bottom: 0.1em;
    padding-right: 0.2em;
}

#header-logo .header-contact .header-contact-t{
    display: none;
}

.ec-layoutRole__header .ec-headerNaviRole{
    width: 85%;
    max-width: 1200px;
}
.ec-headerSearch .ec-headerSearch__category .ec-select.ec-select_search{
    background-color: #bf1b17;
}

.ec-cartNaviWrap .ec-cartNavi{
    background-color: transparent;
}

.ec-headerNaviRole__search .ec-headerSearch .ec-headerSearch__keyword{
    background-color: #fcf0f2;
}

.visual{
    width: 90%;
    margin: 0 auto;
}

.visual img{
    width: 100%;
}

.fa-classic, .fa-regular, .fa-solid, .far, .fas {
    font-size: 30px;
}

.siteFooter{
    background-color: #000;
    padding-top: 20px;
}

.siteFooter #footer-logo{
    width: 35%;
    max-width: 400px;
    min-width: 310px;
    margin: 0 auto;
}

.siteFooter #footer-logo img{
    width: 100%;
}

.siteFooter .siteFooter__subnav{
    width: fit-content;
    margin: 20px auto 0;
}

.siteFooter .siteFooter__subnav a{
    color: #fff;
    padding:0 0.5em;
}

.siteFooter small{
    display: block;
    text-align: center;
    color: #fff;
    padding: 10px;
}


/*下層ページロゴ*/
.another_logo{
    text-align: center;
    margin: 2em 0;
}

.another_logo img{
    width: 50%;
    min-width: 270px;
    
}



@media only screen and (max-width: 420px) {
    
.header-in p:first-child{
    margin-left: 10vw;
}
    
#header-logo .header-contact{
    padding:  0.4em 0.7em 0.3em;;
}

.sp-no{
    display: none;
}

.ec-layoutRole__header .ec-headerNaviRole{
    width: 100%;
}
    
}

@media only screen and (min-width: 768px) {
    
.pc{
    display: block;
}

.sp{
    display: none;
}

.header-in{
    height: 80px;
}
    
.header-in p:first-child{
    margin-left: 0;
}
 
#header-logo .header-contact{
    font-size: 17px;
}


.ec-cartNaviWrap .ec-cartNavi{
    background-color: #fcf0f2;
}

.visual{
    width: 85%;
    max-width: 1200px;
}

/*下層ページロゴ*/

.another_logo img{
    width: 35%;
    max-width: 450px;
}

.ec-categoryRole .ec-categoryRole__list {
        flex-wrap: wrap;
        justify-content: space-between;
}

.ec-categoryRole .ec-categoryRole__listItem:not(:last-of-type) {
        margin-right: 0px; 
}

.ec-categoryRole .ec-categoryRole__listItem {
        width: 32%;
}

}