/*index 更新情報エリア*/
.box-news{
    text-align: center;
}
.box-news a{
    color:#be0000;
}
.vcs_news time{
    margin-right:1em;
}

/*更新情報一覧ページ*/
ul.news-list{
    width:100%;
}
.news-list li{
    margin-bottom:2rem;
    padding:3rem;
}
.flex-area{
    display: flex;
}
.flex-left{
    justify-content: flex-start;
}
.flex-center{
    justify-content: center;
}
.news-list li h3{
    text-align: center;
    font-size: 2rem;
    color:#be0000;
    margin-bottom:1rem;
    padding-bottom:0.5rem;
    border-bottom:thin #be0000 solid;
}
.news-list li h3 span{
    font-size: 70%;
    margin-right:1rem;
}
.newstext{
    text-align: left;
    padding: 1rem;
}

@media (max-width: 540px){
    .flex-area{
        display: block;
    }
    .news-list li h3 span{
        display: block;
    }
}
/*コラムインデックス*/
.column-box{
    margin-top:80px;
    width:100%;
    max-width:1000px;
    font-size: 15px;
}
.column_index{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}
.column-box h3{
    
}

.column_card{
    width:100%;
    max-width:450px;
    border:thin solid #eee;
    border-radius: 10px;
    padding:1em;
    margin:0.5em;
    display: flex;
    box-sizing: border-box;
}
.column_thumb{
    width:120px;
    height:120px;
}
.column_thumb img{
    width:120px;
    height:120px;
    object-fit: cover;
}
.column_text_lead{
    width:360px;
    padding:0 0.5em;
}
.column_text_lead p{
    font-size:13px;
}
column_text_lead a{
    color:#be0000;
}
/*コラム記事*/
.pan {
  display: block;
  width: 100%;
  height: 30px;
  margin-top: 100px;
  padding: 0 50px;
  background: #be0000;
  color: #fff;
  font-size: 12px;
  line-height: 2.5;
  letter-spacing: 0.01em;
    position:fixed;
    z-index:100;
}
.pan a{
    color:#fff;
}
@media (max-width: 820px){
  .pan {
    height: 20px;
    font-size: 10px;
    line-height: 2;
    margin-top: 60px;
    padding: 0 20px;
    position:fixed;
    z-index:100;
  }
}


.column_kiji{
	font-family: "游ゴシック体", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
    font-size:clamp(14px, 2.5vw, 16px);
    padding:2em;
}

.column_kiji h1{
    display: block;
    padding-bottom: 1rem;
    margin: 2rem 0;
    font-size: clamp(1.3em, 2.5vw, 1.6em);
    color:#444;
}
.column_kiji h1::after{
    content:"";
    margin-top:2rem;
    display: block;
    border-bottom:5px #FFF4F4 solid;
    width:150px;
}

.column_kiji h2{
    margin:3rem 0;
    width:100%;
    font-size: clamp(1.2em, 2.5vw, 1.5em);
	background-color: #fff2f2;
	border-left:#be0000 3px solid;
	padding:1rem 1.5rem;
    color:#444;
}

.column_kiji h3{
    padding-bottom: 1rem;
    margin: 3rem 0;
    font-size: clamp(1.1em, 2.5vw, 1.2em);
    font-weight: bold;
    color:#be0000;
	border-bottom:#be0000 thin solid;
}

.column_kiji h4{
    padding:1rem 0;
    margin: 2rem 0 1rem;
    font-size: clamp(1em, 2.5vw, 1.1em);
    font-weight: bold;
    color:#444;
}

.column_kiji p{
	line-height:1.8;
	margin-bottom:2em;
}
.column_kiji img{
    width:inherit;
}
.column_kiji a{
	color:blue;
}

@media (max-width: 540px){

}

.column-list{
    margin:2em 0 4em;
}
.column-list h2{
    font-size:1.2em;
    margin:0.5em 0 0.5em;
    padding:0.2em 0 0.2em 0.5em;
    background-color: #fff2f2;
    display: flex;
    align-items: center;
}
.column-list h2 i{
    margin-right: 1em;
}
.column-list h2 i img{
    width:50px;
}
.column-list h2 p{
}

.column-list li{
    display: flex;
    justify-content: flex-start;
    border-bottom:thin #eee dotted;
    padding:0.5rem;
    margin-left:2rem;
}
.column-list li h3{
    font-size:1.1em;
    margin:0.5em 0;
}
.column_date{
    font-weight: lighter;
    font-size:0.9em;
}
.column-list li > div{
    padding:0.5rem;
}
.column-list li img{
    width:100px;
    height:100px;
    object-fit: cover;
    object-position: center center
}

#sidebar-column .sidebar-column a{
    font-size:0.9em;
    line-height: 1.8;
    color:blue;
    
}

/*フォーム部品confirm調整用*/
.form-ml{
    margin-left: 40px;
}

input.count{
    text-align: center;
    font-size: 18px;
}
input.count::-webkit-inner-spin-button,
input.count::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
    -moz-appearance:textfield;
}
.minus{
    cursor: pointer;
    font-size: 18px;
}

h1.mypage-ttl small{
    font-size:80%;
}


/*lineup　スマホでの検索ボックス*/
@media (max-width: 540px){
.checkbox-group{
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
}
.checkbox-group .checkbox-and-label{
    margin-right:1em;
    white-space: nowrap;
}
.checkbox-group .checkbox-and-label:last-child{
    margin-right: 0;
}
#map-lineup .inner-content{
    height: auto;
    min-height:750px;    
    }
.search-box .search {
        width:50px
    }
.flex-01 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: flex-start;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
}
    
/*商品詳細のテーブル*/
#map-item .topic-area .table-area .table_2 tr:nth-child(1) {
  background: #fff;
}
#map-item .topic-area .table-area .table_2 tr:nth-child(1) td {
  border-right: solid 1px #e7c2c2;
}
#map-item .topic-area .table-area .table_2 td, #map-item .topic-area .table-area .table_2 th {
    border-right: solid 1px #e7c2c2;
    vertical-align: middle;
}
#map-item .topic-area .table-area table td,#map-item .topic-area .table-area table th {
    text-align: center;
    white-space: nowrap;
    border-collapse: collapse;
    padding: 5px 15px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

/*ショッピングカートの内容確認*/

.confirm_css{
    font-size: 15px;
}
.confirm_css div{
    box-sizing: border-box;
}
.shopping_cart_confirm{
    display: flex;
    justify-content: space-between;
    padding:1rem;
    border-bottom:#efefef 2px dotted;
    box-sizing: border-box;
}
.shopping_cart_confirm_flex{
    display: flex;
    flex-grow:2
}
.cart_confirm_img{
    width:100px;
    padding:0 10px;
    text-align: center;
}
.cart_confirm_img img{
    width:100px;
}
.cart_confirm_foodinfo{
	margin-left:1rem;
}
.foodname{
    font-size:clamp(14px, 3vw, 16px);
    font-weight: bold;
}
.foodprice{
    font-size:clamp(0.8em, 3vw, 0.9em);
    line-height: 1.4;
}
.touroku_status span.done{
    background-color:#0acc85;
    color:#fff;
    padding:0.2em 0.5em;
}

.kounyu-keitai{
    margin:0.5em 0;
}

.kounyu-keitai span.normal{
    background-color:#00AFEF;
    color:#fff;
    padding:0.2em 0.5em;
}
.kounyu-keitai span.subscription{
    background-color:#CE3388;
    color:#fff;
    padding:0.2em 0.5em;
}


.shopping_cart_confirm_flex_suuchi{
    display: flex;
    justify-content: flex-end;
    flex-grow:1
}
.cart_confirm_kosuuhyouji{
    padding:0 0.5em;
    width:8em;
    flex:1
}
.cart_confirm_kosuuhyouji > div{
    margin-right:1em
}

.cart_confirm_price{
    width:100px;
    text-align: right;
    font-size: clamp(1em, 3vw, 1.1em);
    flex:1;
}

.shopping_cart_goukei{
    text-align: right;
    padding:0rem 1.5rem;
    background-color:#fff;
    border-radius: 25px;
    width:100%;
}
.shopping_cart_goukei h6{
    font-size: clamp(1em, 3vw, 1.1em);
    margin:1rem 0;
    font-weight: inherit;
    text-align: left;
    border-bottom:#f29600 thin solid;
}
.cart_confirm_price_goukei{
    font-size: clamp(1em, 3vw, 1.1em);
    font-weight: bold;
    text-align: right;
    padding-bottom:1rem;
}
.cart_confirm_price_goukei span{
    font-size: clamp(0.9em, 3vw, 1em);
    font-weight: lighter;
}
.cart_confirm_price_sougoukei{
    font-size: clamp(1.2em, 3vw, 1.4em);
    padding:1rem 0 0 0;
    font-weight: bold;
    border-top:double 4px #f29600;
    display: flex;
    justify-content: flex-end;
}
.midashi_sougoukei{
    margin-right:2em;
}
.shohizei{
    font-size:1rem;
    font-weight: bold;
    padding-bottom: 0.5em;
}
.shopping_cart_payment{
    padding:0rem 1.5rem;
    background-color:#fff;
    border-radius: 25px;
}
.shopping_cart_payment h6{
    font-size: clamp(1rem, 3vw, 1.1rem);
    margin:1rem 0;
    font-weight: inherit;
    text-align: left;
    border-bottom:#f29600 thin solid;
}
.shopping_cart_payment .midashi{
    font-size: clamp(0.9rem, 3vw, 1rem);
    font-weight: bold;
    margin-left:-1rem;
}
.shopping_cart_payment_info_text{
    padding:1rem;
}
.shopping_cart_payment_info_text > div{
    padding-left:1rem;
}
.shopping_cart_payment_info{
    padding:1rem;
}
.shopping_cart_payment_info > div span{
    white-space: nowrap;
}
.shopping_cart_payment_info > div{
    padding-left:1rem;
}
.cart_btn_saikeisan{
    margin:0 auto;
}
.cart_btn_saikeisan button{
    background-color:#f29600;
    border-radius: 10px;
    border:thin solid #f29600;
    padding:0.2rem 0;
    text-align: center;
    color:#fff;
    margin:0.5rem 0;
    width:176px;
}
.cart_btn_saikeisan button:hover{
    background-color:#fff;
    border:thin solid #f29600;
    color:#f29600;
}

/*商品個数spinner*/

.spinner-down, .spinner-up{
    width:45px;
    height: 45px;
    cursor: pointer;
}

.count input{
    line-height: 2.1;
    font-weight: 500;
}

/*.price {
    width: 100%;
    margin: 0 auto 30px;
    justify-content: space-between;
    padding:0 10px;
    box-sizing: border-box;
}*/


/*注文状況ステータス*/
.activearea{
    color: #000;
    border-bottom: solid 5px #be0000;
}

@media (max-width: 820px){
    .foodname{
    width:;
    padding-right:1rem;
}
    
}
@media (max-width: 540px){
    
    .shopping_cart_confirm{
    display: inherit;
    padding:1rem;
}
    .cart_confirm_img{
    width:150px;
    padding:0 10px;
    text-align: center;
        margin:0 auto;
}
    .cart_confirm_img img{
    width:150px;
}
    .flex_right{
        justify-content: flex-end;
        padding:0 1em;
}
    
    .shopping_cart_meisai{
    width:98%;
    margin:2px auto;
    padding:0;
}
    .cart_btn_saikeisan{
    width:12em;
}
    .shopping_cart_goukei{
    width:98%;
    margin:2px auto;
    padding:1em;
}
    .cart_confirm_foodinfo{
    flex-grow: inherit;
}
    .cart_confirm_price{
    flex-grow: inherit;
}
    
    .foodname{
    padding-right:0;
}
}

/* ==========================================================================
     mypage
========================================================================== */
#map-mypage-detail .select{
    
}
#pet-add{
    background-color: #be0000;
    color: #fff;
}
.form-add{
    display:block;
    margin:0.5rem 0;
}
#form_block span.close{
    font-size:20px;
    margin:0.5rem;
    color:#be0000;
}

/*新規会員登録*/
#map-member .Form-Item {
    max-width:750px;
    margin:0 auto;
}

@media (max-width: 820px){
#map-member .select select {
    width: 75px;
}
}

/*ペットを追加するボタン*/
.label-caution{
    font-size: 12px;
    font-weight:lighter;
    display: block;
    margin-top:0.5em;
}
#map-member .addblock{
    position:relative;
    margin:0.5em 0;
}
#map-member .pet-more {
    text-align: left;
    margin-top: 10px;
    margin-left:40px;
    cursor: pointer;
    color: #be0000;
  }
#map-member .form-add span.close{
    font-size:25px;
    color: #be0000;
    position: absolute;
    right:-25px;
    top:0px;
}
#map-member .border-b {
    border-bottom: 1px dashed #e7c2c2;
}

/*ペット情報*/
.img_upload{
    border: 1px #be0000 solid;
    padding:0.5em 1em;
}
@media (max-width: 820px){
    #map-member .pet-more {
    margin-left:0px;
    }
    
    #map-mypage-pet-detail .Form-Item{
        display: inherit;
    }
}
@media (max-width: 540px){
.seibetsu-box{
    width:95px;
}
}

/*ログイン　パスワード案内*/
.caution-login-pass{
    width:330px;
    padding:0 20px;
    margin:0 auto;
    text-align: left;
    line-height: 1;
    box-sizing: border-box;
}
#map-login .login-form-container .caution-login-pass span {
    font-size: 12px;
    margin-top: 10px;
    display:inline-block;
    color: #868686;
    font-weight: 400;
    }
@media screen and (max-width: 1024px) {
    .caution-login-pass{
        width: 90%;
    }
}

/*パスワードリセット*/
#map-login .login-form-container .box-pass-reset,#map-login .login-form-container .box-pass-resetpage {
    padding-bottom: 2em;
    width:500px;
}
#map-login .login-form-container .box-pass-resetpage .input-wrapper:before {
  content: "\f023";
}
.area-pass-reset{
    background-color:#FFF4F4;
    padding:30px 0 10px;
    width:90%;
    margin:30px auto;
}
.area-pass-reset h2{
    font-size: clamp(15px,2.5vw,18px);
    margin-bottom:18px;
}
.box-pass-reset{
    width: 90%;
    max-width:450px;
    margin:0 auto;
}
.area-pass-reset input{
    width:100%;
    border-bottom: 1px solid #be0000;
    background: #efefef;
    padding-left: 1em;
    padding-right: 1em;
    height: 40px;
    box-sizing: border-box;
}

@media screen and (max-width: 1024px) {
    #map-login .login-form-container .box-pass-reset{
        width: 90%;
    }
}

/*支払い情報の変更ページmypage_payment*/
.card-info{align-items: flex-start!important;}
.card-info label{margin-right:20px;}
.card-info .Form-Item{justify-content: space-between;}

@media screen and (max-width: 1024px) {
    .card-info{
    display: inherit!important;
    }
}

/* ==========================================================================
     second page/privacy/company
========================================================================== */

.h1_img a{
    text-align: left;    
}

.h1_img img{
    height: 50px;
    display: inline-block;
    text-align: left;
}
.law_section_inner h2{
    font-size: clamp(1.2em, 2vw, 1.3em);
    font-weight:  inherit;
    border-bottom: #be0000 1px solid;
    line-height: 1.6;
    margin-bottom: 1em;
}
.law_section_inner h2 span{
    display: inline-block;
}
.law_section_inner h3{
    font-size: clamp(1.1em, 2vw, 1.2em);
    font-weight: bold;
    margin:1em 0;
}

.law_text{
    font-size:clamp(0.9em, 2vw, 1em);
    text-align: justify;
    margin-bottom:2em;
}
.text_p{
    padding:0.5em 1em;
}
.midashi-bold{
    font-size:clamp(0.9em, 2vw, 1em);
    font-weight: bold;
    margin-top:1em;
}
/*company*/
.law_section_inner table{
    width: 95%;
    margin:0 auto;
    background: #ddd;
    border-spacing: 1px;
}
.law_section_inner table tbody{
    background: #ddd;
}
.law_section_inner table th, .law_section_inner table td{
    background:#fff;
    text-align: left;
    padding:1em;
    border:thin solid #252525;
}

@media (max-width: 540px){
    .law_section_inner h1{
    height: inherit;
}
.h1_img img{
    height: auto;
    width: 100%;
}
}

/*定休日カレンダー*/


.vcs-calender{
    width:100%;
    font-size:13px;
    padding:5px;
    margin:5px;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
}
.calendar-box{
    flex:1;
    margin:1rem;
    box-sizing: border-box;
    max-width:450px;
    padding:1rem;
}
.vcs-calender h4{
    text-align: center;
    margin:5px 0;
}
.vcs-calender table{
    width:100%;
}
.vcs-calender table td, .vcs-calender table th{
    text-align: center;
    padding:5px;
}
.vcs-calender table th{
    background-color:#eee;
}
.vcs-calender table td:first-child{
    color:red;
}
.closed{
    background-color:#aaa;
    color:#eee!important;
}
.holiday{
    color:red;
}
.vcs-calender caption{
    text-align: center;
    font-size: 12px;
    padding-bottom:0.2rem;
}
.hanrei{
    display: flex;
    align-items: center;
}
.shikaku{
    width:15px;
    height:15px;
    background-color:#aaa;
    display: inline-block
    
}
@media (max-width: 540px){
    .vcs-calender{
    display:inherit;
}
}
/*-----------------------
        お問い合わせ
-------------------------*/

.contact_form{
    width:100%;
    max-width:800px;
    margin:1rem auto;
    padding:1rem;
    box-sizing: border-box;
}
.contact_form h3{
    font-size:18px;
    margin-bottom:1rem;
}
.contact_form a{
    color:#be0000;
    text-decoration: underline;
}

.contact_form ul{
    margin:10px auto;
}
.contact_form li{
    line-height: 180%;
}

.toi_koumoku{
    margin-left:1rem
}
.form_confirm{
    background-color:#fff4f4;
    padding:0.3rem;
    margin-bottom:10px;
}
.toi_koumoku input[type=checkbox] {
    position: relative;
    width: 20px;
    height: 20px;
    border: 1px solid #000;
    border-radius: 3px;
    vertical-align: -8px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.toi_koumoku input[type=checkbox]:checked:before {
  position: absolute;
  top: 1px;
  left: 5px;
  -webkit-transform: rotate(50deg);
  transform: rotate(50deg);
  width: 6px;
  height: 10px;
  border-right: 2px solid #be0000;
  border-bottom: 2px solid #be0000;
  content: "";
}
.toi_koumoku input[type=text], .toi_koumoku input[type=email]{
    width:100%;
    max-width:400px;
    height:30px;
    padding:0.3rem;
    border: 1px solid #000;
    border-radius: 3px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.toi_koumoku textarea{
    width:100%;
    height:80px;
    padding:0.3rem;
    border: 1px solid #000;
    border-radius: 3px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}




/*ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/
/*システムメッセージ関係*/
/*ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/
.message{
    font-size: 15px;
    color:#585858;
}
.red{
    color:red;
}

/*オートコンプリート*/
.ui-autocomplete {
	position: absolute;
	top: 0;
	left: 0;
	cursor: default;
    z-index:1001 !important;
}