@charset "utf-8";


/*-------------------------------------------------------------------------
#
-------------------------------------------------------------------------*/

#contents_outer {
    background: #fff!important;
}
#contents {
    width: auto;
    padding-bottom: 0;
}
.base * {
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 15px;
    color    : #333;
    line-height: 1.46;
    box-sizing: border-box;
    outline: none;
}
img {
    vertical-align: top;
}
a:hover {
    text-decoration: none;
}
::placeholder {
    color: #999;
}
.wrap {
    width: 950px;
    margin: auto;
}
.section {
    padding: 71px 0 70px;
}
.section.-bg {
    background-color: #f6eeec;
}
.section__ttl {
    display       : flex;
    align-items   : center;
    flex-direction: column;
    margin: 0 0 36px;
    font-size  : 23px;
    font-weight: 700;
    letter-spacing: .1em;
}
    .section__ttl-img {
        margin: 0 0 7px;
    }
.section__btn {
    background-color: #e36349;
    border-radius: 50px;
    width: 300px;
    height: 40px;
    margin: 40px auto 0;
    display        : flex;
    align-items    : center;
    justify-content: center;
    font-weight: 700;
    color      : #fff;
    letter-spacing: .1em;
}
.section__btn:hover {
    color: #fff;
    text-decoration: none;
    opacity: .8;
}
.ui-fit-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.ui-hover-item {
    transition: .2s ease;
}
.ui-hover-item:hover {
    transform: scale(1.03);
}
.card {
    overflow: hidden;
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 0 1px 5px rgb(0 0 0 / 20%);
    display: block;
}
.card__contents {
    padding: 15px 15px 24px;
}

/*-------------------------------------------------------------------------
#
-------------------------------------------------------------------------*/

.mainview {
    margin: -50px 0 0;
    height: 495px;
}
    [class*="mainview__items--"]{
        background-repeat  : no-repeat;
        background-position: center 0;
        text-align: center;
        min-height: 495px;
    }
    .mainview__items--item1 {
        background-image: url("../images/top/bg_slide1.png");
        padding: 137px 0 0;
    }
    .mainview__items--item2 {
        background-image: url("../images/top/bg_slide2.png");
        padding: 195px 0 0;
    }
    .mainview__items--item3 {
        background-image: url("../images/top/bg_slide3.png");
        padding: 68px 0 0;
    }
    .mainview__items--item4 {
        background-image: url("../images/top/bg_slide4.png");
        padding: 80px 470px 0 0;
    }
    .mainview__items--item5 {
        background-image: url("../images/top/bg_slide5.png");
        padding: 68px 0 0;
    }
/* ライブラリ
--------------------------- */
.mainview .slick-slide img {
    display: inline!important;
}
.mainview .slick-dots {
    display        : flex;
    align-items    : center;
    justify-content: center;
    position: relative;
    top: -67px;
}
    .mainview .slick-dots li {
        margin: 0 5px;
    }
        .mainview .slick-dots button {
            width: 8px;
            height: 8px;
            background-color: #fff;
            border       : none;
            border-radius: 50%;
            margin: 0;
            padding: 0;
            font-size: 0;
            color    : transparent;
        }
        .mainview .slick-dots .slick-active button {
            background-color: #1f6dab;
        }

/*-------------------------------------------------------------------------
#
-------------------------------------------------------------------------*/

/* LAYOUT
--------------------------- */
.search {
    background-color: #f6eeec;
    padding: 0 0 68px;
}
    /* 上部 */
    .search__top {
        background-color: #fff;
        border-radius: 13px;
        border: 15px;
        box-shadow: 0 1px 4px rgba(0,0,0,.1);
        width: 580px;
        height: 70px;
        margin: 0 auto;
        display        : flex;
        align-items    : center;
        justify-content: space-between;
        position: relative;
        top: -35px;
        padding: 0 16px 0 26px;
    }
    /* 中部 */
    .search__middle {
        display        : flex;
        justify-content: space-between;
        margin: 0 0 39px;
    }
        .search__middle-left {
            width: 668px;
            border-right: 2px dotted #fff;
            padding: 0 16px 0 0;
        }
            .search__block {
                display        : flex;
                justify-content: space-between;
                margin: 0 0 13px;
            }
            .search__block:last-child {
                margin-bottom: 0;
            }
                .search__ttl {
                    display: inline-block;
                    margin: 0 0 6px;
                    padding: 0 0 2px;
                    border-bottom: 1px solid #333;
                    font-size  : 20px;
                    font-weight: 700;
                    letter-spacing: .05em;
                }
        .search__middle-right {
            width: 266px;
        }
        .search__top-left label {
            cursor: pointer;
        }
    /* 下部 */
    .search__bottom {
        display        : flex;
        align-items    : center;
        justify-content: center;
        padding: 0 58px 0 0;
    }
        .search__num {
            font-size  : 18px;
            font-weight: 700;
            display: flex;
            align-items: baseline;
            margin: -7px 0 0;
        }
            .search__num-item {
                font-size  : 35px;
                font-weight: inherit;
                color      : #d42b09;
                /* margin: 0 12px 0 0; */
            }
            .search__num-unit {
                font-size  : inherit;
                font-weight: inherit;
                color      : #d42b09;
                margin: 0 0 0 4px;
            }
        [class*="search__submit--"]{
            border       : none;
            border-radius: 20px;
            height: 40px;
            color      : #fff;
            cursor: pointer;
        }
        .search__submit--search {
            background-color: #d42b09;
            width: 352px;
            margin: 0 34px;
            font-weight: 700;
            letter-spacing: .1em;
        }
        .search__submit--search:before {
            content: url("../images/top/icn_glass2.png");
            position: relative;
            margin: 0 10px 0 0;
            top: 6px;
            left: 3px;
        }
        .search__submit--clear {
            background-color: #999;
            width: 120px;
            font-weight: 500;
        }

.walk .select--normal select{
    width: 120px;
}
/* OBJECT
--------------------------- */
.search__type-label {
    margin: 0 14px 0 0;
}

/* PRICE
--------------------------- */
.search__price {
    width: 294px;
}
    .search__price-contents {
        display    : flex;
        align-items: center;
        justify-content: space-between;
    }
        .select__price {
            width: 132px;
            height: 40px;
            font-size: 12px;
        }

/* WORD
--------------------------- */
.search__word {
    width: 316px;
}
    .search__word-contents {
        position: relative;
    }
        .search__word-input {
            width: 100%;
            height: 40px;
            background-color: #fff;
            border       : none;
            border-radius: 10px;
            padding: 0 0 0 13px;
        }
        .search__word-submit {
            background: none;
            border: none;
            position: absolute;
            top     : 8px;
            right   : 8px;
        }

/* MADORI
--------------------------- */
.madori__contents {
    background-color: #fff;
    border-radius: 10px;
    display        : flex;
    justify-content: space-between;
    padding: 1px 0;
}
    .madori__block {
        padding: 16px 0 16px;
    }
    .madori__block:not(:last-child){
        border-right: 2px dotted #bbb;
    }
        .madori__head {
            margin: 0 0 14px;
            text-align: center;
        }
        [class*="madori__list"] {
            display        : flex;
            flex-wrap      : wrap;
            justify-content: center;
            margin: 0 0 -9px;
        }
        .madori__list--1 {
            width: 196px;
        }
        .madori__list--2 {
            width: 198px;
        }
        .madori__list--3 {
            width: 256px;
            padding-left: 21px;
            justify-content: left;
        }

/* #
--------------------------- */
.type {
    width: 295px;
}
.popular {
    display        : flex;
    flex-wrap      : wrap;
    justify-content: space-between;
}
    .popular__items {
        width: 131px;
        margin: 0 0 4px;
    }
        .popular__label.-small {
            font-size: 12px;
        }

/*-------------------------------------------------------------------------
FORM
-------------------------------------------------------------------------*/
.popular input[type="checkbox"]{
    display: none;
}
.kodawari_list input[type="checkbox"]{
    display: none;
}
/* RADIO
--------------------------- */

input[type="radio"] + label {
    position: relative;
    padding: 0 0 0 19px;
}
input[type="radio"] + label:before,
input[type="radio"]:checked + label:after {
    content: "";
    border-radius: 50%;
    position: absolute;
}
input[type="radio"] + label:before {
    width: 12px;
    height: 12px;
    border: 1px solid #b3b3b3;
    top : 4px;
    left: 0;
}
input[type="radio"]:checked + label:after {
    width: 8px;
    height: 8px;
    background-color: #333;
    border-radius: 50%;
    top : 7px;
    left: 3px;
}

/* SELECT
--------------------------- */
select {
    background-color: #fff;
    border       : none;
    border-radius: 10px;
    padding: 0 0 0 10px;
    height: 40px;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
}

select::-ms-expand {
    display: none;
}
[class*="select--"]{
    position: relative;
}
[class*="select--"]:after {
    content: "";
    border-width: 9px 5px 0 5px;
    border-style: solid;
    position: absolute;
    top     : 18px;
    right   : 8px;
}
.select--price:before {
    content: "";
    border-width: 9px 5px 0 5px;
    border-style: solid;
    position: absolute;
    top     : 18px;
    left   : 108px;
}
.select--top:after    { border-color: #999 transparent transparent;}
.select--price:before { border-color: #a0301b transparent transparent;}
.select--price:after  { border-color: #a0301b transparent transparent;}
.select--normal:after { border-color: #333 transparent transparent;}
.select--price select {
    width: 130px;
}
.select__top {
    width: 300px;
    border       : 1px solid #ccc;
    border-radius: 5px;
}
.select__item150 {
    width: 120px;
}
.select__wide {
    width: 265px;
}
.popup--normal a{
    background-color: #fff;
    width: 265px;
    height: 40px;
    display: flex;
    align-items: center;
    border-radius: 9px;
    padding-left: 15px;
}
.popup--normal a:hover {
    color: #333;
}
.select_last_wrap {
    width: 250px;
    display: flex;
    justify-content: space-between;
}
/* CHECK
--------------------------- */
.madori__radio-label {
    cursor: pointer;
}
.madori__label input {
    display: none;
}
.madori__label {
    position: relative;
    display    : flex;
    align-items: center;
    width: 71px;
    margin: 0 0 9px;
    cursor: pointer;
}
.madori__label:before,
.madori__label:after {
    content: "";
}
.madori__label:before {
    width: 10px;
    height: 10px;
    border       : 1px solid #d3d3d3;
    border-radius: 1px;
    margin: 0 5px 0 0;
    cursor: pointer;
}
.madori__label.is-select:after {
    width: 11px;
    height: 4px;
    transform: rotate(-41deg);
    border-left  : 1px solid #d42b09;
    border-bottom: 1px solid #d42b09;
    position: absolute;
    top     : 7px;
    left    : 2px;
}
.check-label {
    background-color: #fff;
    border-radius: 9px;
    display        : flex;
    align-items    : center;
    justify-content: center;
    height: 40px;
    cursor: pointer;
}
.check-label.is-select{
    background-color: #333;
    color: #fff;
}
.type__label {
    padding: 0 13px;
}
.type__label input[type="checkbox"]{
    display: none;
}


/*---------------------------------------------------------
モーダル
---------------------------------------------------------*/

.popup__bg{
    height: 200vh;
    position: absolute;
    width: 100%;
    margin: 0 auto;
    /* z-index: 10; */
}
.kodawari-popup {
    display: none;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 10;
    width: 100%;
}
.popup__content{
    position: relative;
    background: #fff;
    padding: 40px 30px 110px;
    position: absolute;
    top: 380px;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 950px;
    border-radius: 20px;
    overflow-y: scroll;
    border: 1px solid #EEE;
    -ms-overflow-style: none;
    scrollbar-width: none;
    height: 440px;
    box-shadow: rgb(122 122 122 / 6%) 0px 0px 6px 3px;
    -webkit-box-shadow: rgb(122 122 122 / 6%) 0px 0px 6px 3px;
    -moz-box-shadow: rgba(122, 122, 122, 0.0588235) 0px 0px 6px 3px;
}
#popup01 .popup__content{
    height: 550px;
}
.popup__content::-webkit-scrollbar {
  display: none;
}

#popup01 .js-popup-close-btn {
    position: absolute;
    left: 32%;
    color: #404040;
    font-size: 18px;
    width: 170px;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 50px;
    border-radius: 20px;
    border: 1px solid #404040;
}

.close_btn .js-popup-close:hover {
    background-color: #404040;
    color: #fff!important;
}
.search_btn a:hover {
    background-color: #fff;
    color: #404040!important;
    border: 1px solid #404040;
}

.popup_ttl {
    color: #333;
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    margin-bottom: 20px;
}
.kodawari_box {
    display: flex;
    width: 790px;
    margin: 0 auto 30px;
}
.kodawari_box dt {
    font-weight: bold;
    margin-top: 10px;
    margin-right: 21px;
    width: 90px;
    text-align: right;
    color: #333;
}
.kodawari_list {
    display: flex;
    width: 670px;
    flex-wrap: wrap;
    margin: 0 auto;
}
.kodawari_list li:not(:last-child){
    margin-right: 5px;
}
.kodawari_list li:not(:nth-child(5n)){
    margin-right: 5px;
}
.kodawari_list .check-label {
    font-size: 14px;
    color: #404040;
    background-color: #fff;
    width: 125px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #404040;
    border-radius: 9px;
    text-align: center;
}
.kodawari_list .check-label:hover {
    background-color: #f7f7f7;
}
.kodawari_list .check-label {
    margin-bottom: 10px;
}
.kodawari_list .check-label.is-select{
    background-color: #404040;
    color: #fff;
}
.popup_btn_wrap {
    display: flex;
    margin-top: 20px;
}
.search_btn a {
    color: #fff;
    background-color: #404040;
    position: absolute;
    left: 52%;
    font-size: 18px;
    width: 200px;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 50px;
    border-radius: 20px;
}
/*-------------------------------------------------------------------------
#
-------------------------------------------------------------------------*/

.voice_slide {
    margin-bottom: 70px;
}
.voice {
    display        : flex;
    justify-content: space-between;
    padding: 0 25px;
    position: relative;
}
    .voice__items {
        padding: 0 25px;
        width: 300px;
    }
    .voice .voice__img:hover {
        opacity: .8;
    }
        .voice__img {
             width: 250px;
             height: 180px;
             display: flex;
             justify-content: center;
             align-items: center;
             margin: 0 0 5px;
        }
        .voice__img img {
            max-width: 250px;
            max-height: 180px;
        }
        .voice__name {
            border-bottom: 1px solid #333;
            margin: 0 0 6px;
            padding: 0 0 4px;
            font-size: 18px;
            letter-spacing: .025em;
        }
.voice .slick-arrow {
    position: absolute;
    top     : 100px;
    width: 20px;
    height: 20px;
    background: none;
    border      : none;
    border-top  : 3px solid #e36349;
    border-right: 3px solid #e36349;
    font-size  : 0;
    color      : transparent;
}
.voice .slick-prev {
    transform: rotate(-135deg);
    left: 0;
}
.voice .slick-next {
    transform: rotate(45deg);
    right: 0;
}
.kuchikomi_banner {
    width: 850px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
}
.kuchikomi_banner a{
    display: flex;
}
.sns_bnr_group{
    width: 850px;
    margin: 40px auto;
    display: flex;
    justify-content: space-between;
}
.sns_bnr_group a{
    display: flex;
}
/*-------------------------------------------------------------------------
#
-------------------------------------------------------------------------*/

.blog {
    display        : flex;
    align-items    : center;
    justify-content: center;
}
    .blog__items {
        width: 302px;
        margin: 0 11px;
    }
        .blog__img {
            height: 177px;
            width: 302px;
            display: flex;
            justify-content: center;
            align-items: center;
        }
        .blog__img img {
            max-width: 302px;
            max-height: 177px;
        }
        .blog__name {
            text-overflow: ellipsis;
            overflow     : hidden;
            white-space  : nowrap;
            margin: 0 0 5px;
            font-size  : 18px;
            font-weight: 700;
            text-align: center;
            letter-spacing: .1em;
        }
.card__contents {
    height: 133px;
}
/*-------------------------------------------------------------------------
#
-------------------------------------------------------------------------*/
select {
    cursor: pointer;
}
.select {
    display        : flex;
    flex-wrap      : wrap;
    align-items    : center;
    justify-content: center;
    width: 972px;
    margin: auto;
    cursor: pointer;
}
    .select__items {
        margin: 0 11px 24px;
    }
        .select__text {
            padding: 6px 11px 9px;
            font-weight: 500;
            letter-spacing: .1em;
            position: relative;
        }
        .select__text:after {
            content: "";
            width: 5px;
            height: 5px;
            border-top  : 1px solid #333;
            border-right: 1px solid #333;
            transform: rotate(45deg);
            position: absolute;
            top: 14px;
            right: 11px;
        }

/*-------------------------------------------------------------------------
#
-------------------------------------------------------------------------*/

.bkn {
    display        : flex;
    align-items    : center;
    justify-content: center;
}
    .bkn__items {
        width: 214px!important;
        margin: 3px 9px;
        letter-spacing: .025em;
    }
        .bkn__img {
            display: flex;
            justify-content: center;
            align-items: center;
            width: 224px;
            height: 157px;
        }
        .bkn__img img {
            max-width: 224px;
            max-height: 166px;
        }
        .bkn__block {
            padding: 11px 20px 17px;
        }
            .bkn__price {
                margin: 0 0 1px;
                font-size  : 18px;
                font-weight: 700;
                color      : #d53617;
                letter-spacing: .025em;
            }
                .bkn__price .price {
                    font-size  : 22px;
                    font-weight: inherit;
                    color      : inherit;
                }
            .bkn__name,
            .bkn__text {
                text-overflow: ellipsis;
                overflow     : hidden;
                white-space  : nowrap;
            }
            .bkn__name {
                margin: 0 0 6px;
                font-weight: 700;
            }
            .bkn__text {
                margin: 0 0 7px;
                font-size: 13px;
            }
            .bkn__text:last-child {
                margin-bottom: 0;
            }
.new .slick-arrow {
    position: absolute;
    top: 150px;
    width: 20px;
    height: 20px;
    background: none;
    border      : none;
    border-top  : 3px solid #e36349;
    border-right: 3px solid #e36349;
    font-size  : 0;
    color      : transparent;
    z-index: 1;
}
.new .slick-prev {
    transform: rotate(-135deg);
    left: -25px;
}
.new .slick-next {
    transform: rotate(45deg);
    right: -20px;
}
.pickup .slick-dots,
.new .slick-dots{
    margin-top: 10px;
}
.new__wrap{
    width: 950px;
    margin: auto;
}
.pickup .slick-arrow {
    position: absolute;
    top: 150px;
    width: 20px;
    height: 20px;
    background: none;
    border      : none;
    border-top  : 3px solid #e36349;
    border-right: 3px solid #e36349;
    font-size  : 0;
    color      : transparent;
    z-index: 1;
}
.pickup .slick-prev {
    transform: rotate(-135deg);
    left: -25px;
}
.pickup .slick-next {
    transform: rotate(45deg);
    right: -20px;
}
.pickup__wrap{
    width: 950px;
    margin: auto;
}
.slick-dots {
    display        : flex;
    align-items    : center;
    justify-content: center;
}
    .slick-dots li {
        margin: 0 5px;
    }
        .mainview .slick-dots button {
            background-color: #fff;
        }
        .slick-dots button {
            width: 10px;
            height: 10px;
            background-color: #999;
            border       : none;
            border-radius: 50%;
            margin: 0;
            padding: 0;
            font-size: 0;
            color    : transparent;
        }
        .slick-dots .slick-active button {
            background-color: var(--blue);
        }
/*-------------------------------------------------------------------------
#
-------------------------------------------------------------------------*/

.news__list {
    border-top: 1px dashed #cdcdcd;
    padding: 27px 0 31px;
    display: flex;
}
.news__list:last-child {
    border-bottom: 1px dashed #cdcdcd;    
}
    .news__date {
        min-width: 110px;
        font-weight: 700;
    }
    .news__text {
        text-overflow: ellipsis;
        overflow     : hidden;
        white-space  : nowrap;
    }

/*-------------------------------------------------------------------------
#
-------------------------------------------------------------------------*/

.staff {
    display        : flex;
    align-items    : center;
    justify-content: center;
}
    .staff__items {
        width: 224px;
        margin: 0 9px;
    }
        .staff__img {
            height: 166px;
            width: 224px;
            display: flex;
            justify-content: center;
            align-items: center;
        }
        .staff__img img {
            max-width: 224px;
            max-height: 166px;
        }
        .staff__block {
            padding: 14px 22px 23px;
            height: 141px;
        }
            .staff__name {
                margin: 0 0 6px;
                font-size  : 18px;
                font-weight: 700;
                letter-spacing: .2em;
            }
            .staff__text {
                font-size: 13px;
                letter-spacing: .025em;
            }

/*-------------------------------------------------------------------------
#
-------------------------------------------------------------------------*/

.shop {
    display        : flex;
    justify-content: space-between;
}
    .shop__left {
        width: 250px;
        text-align: center;
    }
        .shop__img {
            margin: 0 0 10px;
            width: 254px;
            height: 164px;
        }
        .shop__name {
            margin: 16px 0 14px;
            font-size  : 17px;
            font-weight: 900;
        }
        .shop__info {
            font-size: 14px;
            line-height: 1.5;
        }
    .shop__right {
        background-color: #fff;
        box-shadow: 0 0 10px rgba(0 0 0 / 30%);
        border-radius: 10px;
        padding: 26px 15px 26px 26px;
        width: 672px;
    }
        .shop__text {
            margin: 0 0 26px;
            line-height: 1.73;
        }
        .shop__text:last-child {
            margin-bottom: 0;
        }

/*-------------------------------------------------------------------------
#
-------------------------------------------------------------------------*/

.reason {
    display        : flex;
    justify-content: space-between;
    margin: 0 0 71px;
}
    .reason__items {
        width: 182px;
    }
        .reason__block {
            padding: 16px 9px 25px;
        }
            .reason__bold {
                margin: 0 0 15px;
                font-weight: 700;
                text-align: center;
                white-space: nowrap;
            }
            .reason__text {
                font-size: 13px;
            }
.top-menu {
    display        : flex;
    flex-wrap      : wrap;
    justify-content: space-between;
}
    .top-menu__items {
        margin: 0 0 10px;
    }

    /*-------------------------------------------------------------------------
#スタッフブロク
-------------------------------------------------------------------------*/
.staffblog {
    display        : flex;
    align-items    : center;
    padding: 0 25px;
    justify-content: center;
}
    .staffblog__items {
        width: 250px;
        margin: 0 11px;
        overflow: hidden;
        display: block;
    }
        .staffblog__img {
            width: 250px;
            height: 180px;
            display: flex;
            justify-content: center;
            align-items: center;
        }
        .staffblog__img img {
            max-width: 250px;
            max-height: 180px;
        }
        .staffblog__name {
            text-overflow: ellipsis;
            overflow     : hidden;
            white-space  : nowrap;
            margin: 0 0 5px;
            font-size  : 18px;
            font-weight: 700;
            letter-spacing: .1em;
        }
        .staffblog__contents {
            height: 133px;
            padding: 9px 0;
        }
        .staffblog .slick-arrow {
            position: absolute;
            top     : 145px;
            width: 20px;
            height: 20px;
            background: none;
            border      : none;
            border-top  : 3px solid #e36349;
            border-right: 3px solid #e36349;
            font-size  : 0;
            color      : transparent;
        }
        .staffblog .slick-prev {
            transform: rotate(-135deg);
            left: 0;
        }
        .staffblog .slick-next {
            transform: rotate(45deg);
            right: 27px;
        }