@charset "UTF-8";
*{box-sizing: border-box;}
html{font-size:16px;}

body{
    font-size: 1em;
    color: #363636;
    margin: 0;
    padding: 0;
}
table{
    border-collapse: collapse;
}
img{
    display: block;
    max-width: 100%;
    height: auto;
}
hr {
  height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  border-top: 1px solid #bbb;
}
select,
input[type="text"],
input[type="date"],
input[type="time"],
input[type="tel"],
input[type="email"],
input[type="password"],
input[name="keyword"],
input[type="search"]{
    font-size:1.2em;
    margin: auto 0;
    padding: 0.2em 0.5em;
    border: 1px solid #3A4A9D;
    border-radius: 10px;
}
select,
input[type="tel"],
input[type="email"],
input[type="password"],
input[name="keyword"],
input[type="search"]{
    display: block;
    width:100%;
}
input[type="date"],
input[type="time"]{
    margin-bottom: 0.2em;
    margin-right: 0.2em;
}
textarea,
input[type="text"]{
    border: 1px solid #3A4A9D;
    padding: 0.2em 0.5em;
    display: block;
    width:100%;
    border-radius: 10px;
}
textarea{
    margin: auto 0;
    line-height: 1.2;
    height: 8em;
}
input[type="image"]{
    font-size:1.2em;
    display: block;
    height: 2.5em;
    width:auto;
    max-width: 100%;
    margin: 1em auto 0 auto;
}
input[type="image"].in-list-btn{
    display:inline-block;
    margin: 0.5em 0 0 0;
}
input[type="image"].small-btn{
    height: 2em;
}
.system-common input[type="image"]{
    margin: 0.5em auto 0 auto;
}
.multiple-btn input[type="image"]{
    display:inline-block;
    margin:0.5em !important;
}
.multiple-btn{
    text-align: center;
}
button{
    display: block;
    margin: 2em auto 1em auto;
    background-color: transparent;
    border: 1px solid transparent;
}
button img{
    height: 6em;
    width: auto;
}

.btn-tel{
    display: block;
}
.btn-tel img{
    height: 6em;
    width:auto;
    margin: 1em auto 0 auto;
}
button:active img,
input[type="image"]:active,
input[type="image"][disabled]{
    filter: contrast(80%) grayscale(100%);
}
.photo-choice:hover,
label img:hover,
button:not([disabled]):hover img,
img[onclick]:not([disabled]):hover,
input[type="image"]:not([disabled]):hover{
    filter: brightness(120%);
}
input[type="image"][disabled]{
    cursor: not-allowed;
}
.photo-choice,
button:not([disabled]),
img[onclick]:not([disabled]),
input[type="image"]:not([disabled]),
select:not([disabled]){
    cursor: pointer;
}
select {
    margin: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-appearance: none;
    -moz-appearance: none;
}
main:not(.front-search) select {
    background-image:
        url('../image/arrow-down-white.svg'),
        linear-gradient(to right, #3A4A9D, #3A4A9D);
    background-position:
        right center,
        100% 0;
    background-size:
        40px auto,
        40px 100%;
    background-repeat: no-repeat;
}
select:-moz-focusring {
    color: transparent;
    text-shadow: 0 0 0 #363636;
}
select[disabled]{
    color: #ccc;
    border: 1px solid #ccc;
    background-color: #fff;
    background-image:
        url('../image/arrow-down-white.svg'),
        linear-gradient(to right, #ccc, #ccc);
}
[required]:not([disabled]){
    background-color:beige;
}
.required-mark{
    color: crimson;
    font-size: 0.8em;
}
.ex{
    color:darkolivegreen;
    font-size: 0.8em;
}
.page-wrapper{
    width:100%;
    max-width: 750px;
    margin: 0 auto 50px auto;
}
.index-wrapper.page-wrapper main{
    margin-top:50px;
}
.index-wrapper main{
    padding-top: 50px;
}
body.index-body{
    background-image: url(../image/header-bg-image-00.png);
    background-position: top center;
    background-repeat: repeat-x;
    background-size: auto 250px;
}
.page-wrapper.index-wrapper main{
    /*margin-top:112px;*/
}

main,
article,
nav{
    display: block;
}
main{
    padding: 20px;
}
.auto-br{
    display: inline-block;
}


.index-body .site-header{
    margin: 0 0.5em;
    position: absolute;
    top:0;
    height: 50px;
}

body:not(.index-body) .site-header{
    margin: 0 0.5em;
    height: 50px;
}
.nav-header{
    display: flex;
    justify-content:space-between;
}
.site-footer{
    text-align: center;
    font-size: 0.8em;
    margin: 0 0.5em 0.5em 0.5em;
    padding-top: 0.5em;
    border-top: 1px solid #ccc;
}
.site-header a{
    display: block;
    margin: 0 auto;
}
body:not(.index-body) .site-header a{
    display: inline-block;
    margin: 0;
}
.site-logo-header{
    width: auto;
    height: 45px;
    margin-top: 10px;
    display: block;
}
.site-back-header{
    width: auto;
    height: 20px;
    margin-top: 20px;
    margin-left: 5px;
    display: block;
}
.page-title{
    margin: 0.5em 0;
    padding: 0;
    font-size: 1.5em;
    text-align: center;
    color: #3A4A9D;
}
.section-title{
    background-color: #3A4A9D;
    padding: 0.2em;
    color: #fff;
    font-size: 1.2em;
    text-align: center;
}
.sub-section-title{
    border-bottom: 2px solid #3A4A9D;
    font-size: 1em;
}
li .first-letter,
.sub-section-title .first-letter{
    color: #3A4A9D;
}
.citation-first-letter,
li .first-letter{
    display: inline-block;
    font-weight: 900;
    background-color: #ccd4ff;
    border-radius: 5px;
    padding: 0 0.2em;
}
.citation-first-letter{
    background-color: #ccc;
}
.item-name{
    margin-right: 0.5em;
}
.tag-sale{
    height: 2em;
    width: auto;
}
.list-tags{
    margin: 0.5em 0;
    padding: 0;
}
.list-tags img{
    height: 1.5em;
    width: auto;
    display: inline-block;
    margin-right: 0.2em;
}
.breadcrumb{
    font-size: 0.8em;
}
.link-footer{
    margin: 0.25em 1em;
}
.link-footer img{
    height: 2rem;
    width: auto;
    display: inline-block;
    margin: 0 1em;
}
li{
    padding:0.5em 0;
}
ol{
    counter-reset: cnt;
}
ol > li{
    list-style-type:none;
    list-style-position:inside;
    counter-increment: cnt;
}
ol > li::before{
    display: marker;
    /*content: counter(cnt) ". ";*/
    content: counter(cnt);
    color: #3A4A9D;
    font-weight: 900;
    background-color: #ccd4ff;
    border-radius: 5px;
    padding: 0 0.5em;
    margin-right: 0.2em;
}
li ol{
    padding:0 0 0 2em;
    margin:1em 0 0.5em 0;
}
li ol > li::before{
    content: "(" counter(cnt) ") ";
}
.faq{
    margin: 0.5em 0;
    border: 1px solid #ccc;
    padding: 0.5em;
    border-radius: 5px;
}
.f-q,
.f-a{
    background-position: top left;
    background-repeat: no-repeat;
    background-size: 20px;
}
.f-q{
    padding-bottom: 0.25em;
    border-bottom: 1px dotted #ccc;
    background-image: url(../image/icn-q.svg);
}
.f-a{
    margin-top: 0.25em;
    background-image: url(../image/icn-a.svg);
}
.f-q p,
.f-a p{
    padding-left: 2em;
    margin: 0;
}
/* --------------------------------------
HOME */
.link-footer-home{
    margin: 0.25em 0 0 0;
}
.inline-center{
    text-align: center;
}
.link-footer.inline-center{
    margin-top: 1em;
}
.link-footer.inline-center img{
    height: 2.2rem;
}
.home-title{
    margin: 0;
    padding: 0;
}



.front-search select,
.front-search input[name="keyword"]{
    font-size:1em;
    margin: auto 0;
    padding: 0.1em 0.5em;
    border: 1px solid #ccc;
    border-radius: 20px;
}
#kensaku{
    width: 80%;
    margin: 55px auto 40px auto;
}
.btn-index-search{
    margin: 0 auto;
}
.btn-index-search img{
    height: 40px;
}


.form-column{
display: -webkit-flex;
display: flex;
    align-items:center;
}
.home-input{
    width: 100%;
}
.form-column:first-child .home-input:first-child{
    padding-right: 0.5em;
}
.home-input select,
.home-input input{
    padding: 2px 0.5em;
    height: 30px;
}
select[name="municipality"]{
    margin-top: 0.5em;
    margin-bottom: 0.5em;
}
.sub-title-home{
    margin: 1em 0 0 0;
}
.wrapper-feature a{
    width: 280px;
}
@media(max-width:499px){
    .wrapper-feature,
    .cartoon{
        scroll-snap-type: x proximity;
        display:block;
        width: 100%;
        white-space: nowrap;
        overflow-x: scroll;
        -webkit-overflow-scrolling: touch;
        overflow-y : hidden;
    }
    .cartoon-col{
        display:inline-block;
        white-space: nowrap;

    }
    .wrapper-feature a,
    .cartoon-col a{
        display: inline-block;
        vertical-align: top;
        height: auto;
        max-width: inherit;
    }
    .cartoon-col a{
        width: 220px;
    }
    .wrapper-feature a,
    .cartoon-col a{
        scroll-snap-align: start;
    }
    .wrapper-feature a:last-child,
    .cartoon-col + .cartoon-col a:last-child{
        scroll-snap-align: end;
    }
    /*
    .cartoon-col img:not(:first-child),
    .cartoon-col + .cartoon-col img{
        scroll-snap-align: start;
    }
    */
    ..wrapper-feature a:not(:last-child),
    .cartoon-col a:not(:last-child){
        margin-right: 0.2em;
    }
}
@media(min-width:500px){
    .wrapper-feature a{
        display: block;
        margin: 0 auto;
    }
    .wrapper-feature img{
        display: block;
    }
    .cartoon{
    margin: 1em 0 0 0;
}
    .cartoon-col{
        display: -webkit-flex;
        display: flex;
        align-items:flex-start;
        /*border: 1px solid #ccc;*/
    }
    .cartoon-col:not(:last-of-type){
        border-bottom: 0 solid transparent;
    }
    .cartoon-col a{
        max-width: 100%;
        width: calc(100% / 3);
    }
    .cartoon-col a:not(:last-child){
        margin-right: 2px;
        /*border-right: 1px solid #ccc;*/
    }
    .cartoon-col-bumpy{
        /*border: 0 solid transparent;*/
    }
    .cartoon-col-bumpy .koma-2{
        margin: 2px 0 2px 2px;
        /*border: 1px solid #ccc;
        border-right: 0 solid transparent !important;*/
    }
    .cartoon-col-bumpy .koma-3{
        margin:2px 2px 0 2px;
        /*border: 1px solid #ccc;
        border-bottom: 0 solid transparent !important;*/
    }
}
/* --------------------------------------
LIST */
.search-info{
    font-size: 0.8em;
}
@media(min-width:400px){
    .list-item{
        display: -webkit-flex;
        display: flex;
    }
    .list-item-content{
        width: 65%;
        padding-left: 0.5em;
    }
    .list-item-img{
        width: 35%;
    }
}
.list-item{
    margin: 0.25em 0;
    padding: 0.5em;
    border: 1px solid #ccc;
    border-radius: 5px;
}
.list-item-title{
    margin: 0;
    font-size: 1.2em;
}
.list-shop-name{
    margin: 0 0 0.5em 0;
}
.pagination{
    display: -webkit-flex;
    display: flex;
    justify-content: center;
    margin-top: 1em;
}
.page-previous,
.page-next{
    margin: 0 20px;
    background-size: 20px;
    background-repeat: no-repeat;
}
.page-previous{
    padding-left: 20px;
    background-image: url(../image/arrow-left-gray.svg);
    background-position: left center;
}
.page-next{
    padding-right: 20px;
    text-align: right;
    background-image: url(../image/arrow-right-gray.svg);
    background-position: right center;
}
/* --------------------------------------
ITEM */
.item-title{
    text-align: center;
    font-size: 1.5em;
    margin: 0.5em 0;
}
.item-images{
    text-align: center;
    width: 100%;
}
.item-image-large,
.item-images .tag-sale{
    margin: 0 auto;
}
.item-image-register{
    width: 100%;
}
.system-common label{
    display: inline-block;
    margin-bottom: 0.5em;
}
.system-common .btn-this-area-delivery-label,
.system-common .tag-sale{
    margin: 0;
    display: inline-block;
    vertical-align: middle;
}
input[type="checkbox"]:not(:checked) ~ .tag-sale,
input[type="radio"]:not(:checked) ~ .tag-sale{
    filter: contrast(80%) grayscale(100%);
}
.item-image-large{
    max-width: 100%;
    margin-bottom: 0.5em;
}
.details-table{
    width: 100%;
    border-top: 1px solid #ccc;
}
.details-table td,
.details-table th{
    padding: 0.5em 0;
}
.details-table th,
.details-table td,
.details-table tr{
    border-bottom: 1px solid #ccc;
}
.details-table th{
    background: rgb(240,240,240);
    width: 25%;
    padding-right: 0.2em;
    padding-left: 0.2em;
}
.details-table td{
    padding-left: 0.5em;
    width: 75%;
}
.front-item .details-table{
    font-size: 1.2em;
}
.press .details-table,
.press .details-table th,
.press .details-table td,
.press .details-table tr{
    border:none !important;
}
.press .details-table th,
.press .details-table td{
    font-size: 0.8em;
    padding: 0.2em;
    width:auto !important;
}
.list-area-tags{
    margin: 0 0 0.2em 0;
}
.area-tag{
    border: 1px solid #ccc;
    border-radius: 3px;
    font-size: 0.8em;
    line-height: 1;
    padding: 0.1em 0.3em;
    margin: 0 0.2em 0.2em 0;
    background-color:antiquewhite;
}
.front-item .tag-sale{
    height: 2.5em;
}
.front-item .list-tags img{
    height: 2em;
}
.select-area{
    border: 2px solid #CCC;
    padding: 0.5em;
    margin-bottom: 0.5em;
}
.select-area :not(:last-child){
    margin-bottom: 0.5em;
}
.add-area,
.delete-area{

}
.register-postalcode input,
.register-price input
{
    display: inline-block;
}
.register-postalcode input,
.register-price input{
    width: 40%;
}
.register-postalcode input{
    margin-bottom: 0.5em;
}
/* --------------------------------------
LOGIN */
.form-login{
    max-width: 300px;
    margin: 0 auto;
}
.form-reg input,
.form-login input{
    margin-bottom: 0.5em;
    padding-left: 25px;
    background-position: left center;
    background-size: 23px auto;
    background-repeat: no-repeat;
}
.form-reg input[type="email"],
.form-login input[type="email"]{
    background-image: url(../image/icn-mail.svg);
}
.form-login input[type="password"]{
    background-image: url(../image/icn-key.svg);
}
.index-menu{
    width: 200px;
    margin: 2em auto;
}
.index-menu a{
    display: block;
    margin-bottom: 0.5em;
}
.index-menu img{
    display: inline-block;
    height: 2em;
}
/* --------------------------------------
OTHER */
.strong-text{
    font-size: 1.5em;
    text-align: center;
    font-weight: 900;
}
.press-article ol,
.press-article ol li{
    margin-left: 0;
}
.sub-sub-section-title{
    background: #ccc;
    padding: 0.5em;
}
.sub-sub-section-title::before{
    content: "■";
}
.em-text{
    color: #3A4A9D;
}
em{
    text-decoration-line: underline;
    font-style: normal;
}
.emem-text{
    display: inline-block;
    margin-left: auto;
    margin-right: auto;
    color: #3A4A9D;
    border-bottom: 3px double #3A4A9D;
    font-weight: bold;
}
main p{
    line-height: 1.7;
}
.press-header{
    border: 2px solid #363636;
    padding: 0.5em;
    text-align: center;
}
.sub-press-title,
.press-header p{
    margin: 0;
}
.sub-press-title{
    margin-bottom: 0.5em;
}
.press-header .add-info{
    margin-top: 0.5em;
    font-size: 0.8em;
    line-height: 1.2;
}
.photo-choice{
    height: 3em;
    width: auto;
}
.system-message{
    text-align: center;
    margin: 3em 0;
}
.system-message ol{
    text-align:left;
    max-width: 500px;
    margin-left: auto;
    margin-right: auto;
}
.index-menu-under{
    margin-top: 3em;
    width: 100%;
    text-align: center;
}
.index-menu-under br{
    display: none;
}
.index-menu-under a,
.index-menu-under img{
    display: inline-block;
}
.index-menu-under a{
    margin: 0 2em;
}
.ul-capsule{
    margin: 0;
    padding: 0;
    border: 1px solid #ccc;
    border-radius: 5px;
    list-style: none;
    margin-top: 1em;
}
.press .ul-capsule{
    margin-top: 0.5em;
}
.ul-capsule li{
    padding: 0.5em;
}
.ul-capsule li:not(:last-child){
    border-bottom: 1px dashed #ccc;
}
.press article > ol,
.terms-of-use article > ol{
    padding-left: 0;
}
.press-index{
    /*font-size: 1.2em;*/
}
.press-index img{
    display: inline-block;
    height: 1.5em;
    width: auto;
    margin-right: 0.2em;
    vertical-align: text-bottom;
}
.press-index p a{
    display: block;
    background-image: url('../image/icn-press.svg');
    background-repeat: no-repeat;
    background-position: left top;
    background-size: auto 1.5em;
    padding-left: 1.5em;
    padding-top: 0.2em;
    line-height: 1.2;
}
.select-area:first-of-type{
    background-color:beige;
}
form#login input[type="email"],
form#login input[type="password"]{
    padding-top: 0.7em;
    padding-bottom: 0.7em;
    margin-bottom: 1.2em;
}
.add-new-delivery input[type="email"],
.add-new-shop input[type="email"]{
    padding-top: 0.7em;
    padding-bottom: 0.7em;
}
.add-new-delivery label,
.add-new-shop label{
    display: inline-block;
    margin: 0.7em 0;
}
.add-new-delivery input[type="image"],
.add-new-shop input[type="image"]{
    height: 4em;
}
.add-new-delivery .page-title::before,
.add-new-shop .page-title::before{
    content: "";
    display: inline-block;
    background-repeat: no-repeat;
    background-position: left center;
    background-size: contain;
}
.add-new-delivery .page-title::before{
    width: 35px;
    height: 25px;
    background-image: url(../image/icn-add-new-delivery.svg);
}
.add-new-shop .page-title::before{
    width: 25px;
    height: 25px;
    background-image: url(../image/icn-add-new-shop.svg);
}
.wrapper-campaign{
    margin: 1em 0 1em 0;
}
.campaign{
    display: block;
    border-radius: 5px;
    padding: 0.5em;
    background-color: #fff;
    text-decoration: none;
    color: #363636;
}
.campaign:hover{
    border: 1px solid #3A4A9D;
}
.campaign-image{
    margin-bottom: 0.2em;
}
.campaign-image img{
    max-width: 100%;
    height: auto;
    margin: 0 auto;
}
.campaign-text p{
    margin: 0;
    padding: 0;
}
.campaign-title{
    text-align: center;
    font-weight: bold;
}
.campaign-title span{
    padding-right: 0.2em;
    padding-left: 0.2em;
}
.campaign-content{
    font-size: 0.8em;
    line-height: 1.2em;
}
.bnr-images img{
    display: inline-block;
}
@media(max-width:499px){
    .wrapper-campaign{
        scroll-snap-type: x proximity;
        display:block;
        width: 100%;
        white-space: nowrap;
        overflow-x: scroll;
        overflow-y : hidden;
        -webkit-overflow-scrolling: touch;
    }
    .campaign{
        display: inline-block;
        vertical-align: top;
        height: auto;
        width: 280px;
        max-width: inherit;
        border: 1px solid #666;
        /*filter: drop-shadow(3px 3px 0 #666);*/
    }
    .campaign{
        scroll-snap-align: start;
    }
    .campaign:last-child{
        scroll-snap-align: end;
    }
    /*.campaign:not(:first-child){
        scroll-snap-align: start;
    }*/
    .campaign:not(:last-child){
        margin-right: 0.3em;
    }
}
@media(min-width:500px){
    .campaign{
        width: 300px;
        max-width: 100%;
        margin: 1em auto;
        margin: 1em auto;
        border: 1px solid #ccc;
        /*filter: drop-shadow(3px 3px 0 #ccc);*/
    }
}
.dl-icn img{
    max-width: 25px;
    vertical-align: bottom;
    margin-right: 0.2em;
}
.bnr-view{
    margin: 0.5em 0;
    padding: 0.5em;
    text-align: center;
}
.bnr-view + .bnr-view{
    margin-top: 2em;
}
.bnr-view > img{
    border: 1px solid #ccc;
}
.qr-omisebin{
    display: block;
    width: 300px;
    margin: 1em auto;
}
.qr-omisebin img{
    width: 100%;
    height: auto;
}
.error-description,
.error-detail{
    margin: 0;
}
.error-description{
    font-size: 1.5em;
}
.error-description strong{
    border-bottom: 1px solid #3A4A9D;
}
.error-detail{
    font-size: 1em;
}
.error-link{
    text-align: center;
}
.error-link a{
    display:inline-block;
    margin: 0.5em auto;
}
.error-link img{
    display:inline-block;
    height:3em;
}
.error-link::before{
    content: "";
    display: inline-block;
    border-top: 3em solid #ccd4ff;
    border-right: 3em solid transparent;
    border-bottom: 3em solid transparent;
    border-left: 3em solid transparent;
}
.inline-right img,
.inline-left img,
.inline-center img{
    display: inline-block;
    min-height: 2em;
}
.inline-right{
    text-align: right;
}
.inline-left{
    text-align: left;
}
.inline-center{
    text-align: center;
}
.btn-this-area-delivery{
    height:3.5em;
    width: auto;
}
.btn-this-area-delivery-label{
    height:2em;
    width: auto;
}
.item-details{
    background-color: #000;
    color: #fff;
    padding: 0.2em 0.5em;
}
.item-caution{
    border: solid 2px red;
    padding: 0;
    text-align: center;
}
.item-caution h4{
    background-color: red;
    margin: 0 !important;
    padding: 0.2em 0.5em;
    color: #fff;
}
.item-caution p{
    margin: 0.5em;
}
.ueno-li{
    min-height: 100px;
}
.ueno-item{
    display:block;
    width:80px;
    height:100px;
    margin-right:1.5em;
    float:left;
}
.ueno-img{
    width:auto;
    height:100px;
    margin: 0 auto;
    filter: drop-shadow(5px 5px 5px #aaa);
}
.ueno-clear{
    display:block;
    width:0;
    height:0;
    clear:left;
}
.wrapper-pickup-item{

}
.pickup-item{
    margin-top: 0.5em;
    display: flex;
}
.pickup-item-image{
    width: 20%;
}
.pickup-item-text{
    width: 80%;
    padding-left: 0.2em;
    font-size: 0.8em;
}
.ueno-point{
    margin: 0 0.2em;
    padding: 2px 0.5em;
    font-size: 0.7em;
    background-color: cornflowerblue;
    border-radius: 20px;
    color: #fff;
}
/*---------add 2022.4.13*/
a.bnr-sdgs{
	display: block;
	width:95%;
	max-width: 380px;
	margin:20px auto 50px;
}
a.bnr-sdgs img{
	border:1px solid #8DD1E6;
}