html,
button,
input,
select,
textarea {
    color: #444;
}

li{list-style: none;}
a{transition: all  0.2s ease;
    cursor: pointer;
    text-decoration: none;
    color:#eb6363}
a:visited{color:#eb6363;}
a:hover{color:#f29600;cursor: pointer;}

.bnr a:hover{
    filter: drop-shadow(0 0 0.2rem #e6dfd5);
    cursor: pointer;
}
div{box-sizing: border-box;}

.pc-only{display:inherit;}
.sp-only{display: none;}

.index-pc-only{display: inherit;}
.index-sp-only{display: none;}
.index-tb-only{display: none;}

ul,li{margin:0;padding:0;}

hr{border:none;
    border-top:#ddd thin solid;}

/*コンテンツ*/

h1 span,h2 span,h3 span,h4 span,h5 span,h6 span{
    display: inline-block;
}

.flex-area{
    display: flex;
}

/*幅共通のバナー横並び（spでflex解除）*/
.banner-area{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    width:100%;
    max-width: 550px;
}
.banner-area > div.double{
    flex-grow:2;
    margin:0 5px;
}
.banner-area > div.single{
    flex-grow:1;
    margin:0 5px;
    height: auto;
    text-align: center;
}
.banner-area > div.double img{
    width:100%;
    max-height:140px;
}
.banner-area > div.single img{
    width:100%;
    max-width:246px;
    max-height:140px;
}

/*幅共通のバナー横並び（spでflex解除）幅広700px*/
.banner-area-wide{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    width:98%;
    max-width: 1000px;
    margin:0 auto
}
.banner-area-wide > div.double{
    flex:2;
    margin:0 1rem;
}
.banner-area-wide > div.single{
    flex:1;
    margin:0 1rem;
}
.banner-area-wide > div img{
    width:100%;
}
.flex-center{justify-content: center;}
.flex-left{justify-content: flex-start;}
.flex-right{justify-content:flex-end;}
.flex-between{justify-content: space-between;}
.flex-around{justify-content: space-around;}

@media (max-width: 820px){
.index-pc-only{display: none;}
.index-tb-only{display: inherit;}
.index-sp-only{display: none;}
}

@media (max-width: 540px){
.pc-only{display: none;}
.sp-only{display: inherit;}
.flex-area{display: block;}
.banner-area{display: inherit;}
.index-tb-only{display: none;}
.index-sp-only{display: inherit;}
.banner-area > div{
   margin:5px auto;
}
.banner-area-wide{
    display: inherit;
}
}



/* ==========================================================================
   General styles
   ========================================================================== */

html,
body {
    height: 100%;
    margin:0;
    padding:0;
}

body {
    
    font-family: "ヒラギノ丸ゴ Pro W4", "ヒラギノ丸ゴ Pro", "Hiragino Maru Gothic Pro", "HG丸ｺﾞｼｯｸM-PRO", "HGMaruGothicMPRO";

    font-size: 15px;
    color: #444;
    line-height: 180%;
    letter-spacing: 1px;
    background:#fff;

    -webkit-font-smoothing: antialiased;
    -webkit-overflow-scrolling: touch;
}
p {
    margin: 20px;
    text-align:justify;
    font-size: clamp(0.9rem, 2vw, 1rem);
    line-height: clamp(150%, 2vw, 180%)
}
p span{
    display: inline-block;
}

section{
    margin:80px auto;
    position:relative;
    padding: 0;
}
.section_inner{
    width:90%;
    max-width:1000px;
    margin:0 auto;
}

.clear{clear: both;}

@media (max-width: 540px){
    p{margin: 10px;}
}


span.stronger{
    font-weight: bold;
    text-decoration:underline;
}


/*ボタンのスタイル　width以外の設定　角がまる*/
.btn_base a{
    display: block;
    width:100%;
    margin: 0 auto;
    padding:0.5rem;
    text-align: center;
    border:#eb6363 1px solid;
    background: #eb6363;
    color:#fff;
    border-radius: 25px;
}
.btn_base a:hover{
    cursor: pointer;
    background: #fff;
    color:#eb6363;
    border:#eb6363 1px solid;
    
}
/*ボタンのスタイル　width以外の設定　角が四角・小さめのボタン用*/
.btn_small a{
    display: block;
    width:100%;
    margin: 0 auto;
    padding:0.3rem;
    text-align: center;
    border:#eb6363 1px solid;
    background: #eb6363;
    color:#fff;
}
.btn_small a:hover{
    cursor: pointer;
    background: #fff;
    color:#eb6363;
    border:#eb6363 1px solid;
}

/*ボタンのスタイル　width以外の設定　カド角　モノクロ系*/

.btn_white a{
    display: block;
    width:100%;
    margin: 0.3rem auto;
    padding:0.3rem 1rem;
    text-align: center;
    border:#807970 1px solid;
    background: #fff;
    color:#807970;
}
.btn_white a:hover{
    cursor: pointer;
    background: #f6eadb;
    color:#807970;
    border:#f6eadb 1px solid;
}
.btn_white_cat a{
    display: block;
    width:100%;
    margin: 0.3rem auto;
    padding:0.3rem 1rem;
    text-align: center;
    border:#e88d80 1px solid;
    background: #fff;
    color:#e88d80;
    border-radius: 25px;
}
.btn_white_cat a:hover{
    cursor: pointer;
    background: #e88d80;
    color:#fff;
    border:#e88d80 1px solid;
}

/*form用*/


input.btn_base{
    display: block;
    width:100%;
    margin: 0 auto;
    padding:0.5rem;
    text-align: center;
    border:#f29600 1px solid;
    background: #fff;
    color:#f29600;
    border-radius: 25px;
    width:80%;
    max-width:280px;
}
input.btn_base:hover{
    cursor: pointer;
    background: #f29600;
    color:#fff;
    border:#f29600 1px solid;
    
}
button{
    margin: 0 auto;
    padding:0.5rem;
    text-align: center;
    background: #eb6363;
    color:#fff;
    border:#eb6363 1px solid;
}
button:hover{
    cursor: pointer;
    border:#eb6363 1px solid;
    background: #fff;
    color:#eb6363;
}
button.white{
    margin: 0rem auto;
    padding:0.5rem;
    text-align: center;
    background: #fff;
    color:#eb6363;
    border:#eb6363 1px solid;
}
button.white:hover{
    cursor: pointer;
    border:#eb6363 1px solid;
    background: #eb6363;
    color:#fff;
}


/* ==========================================================================
   バーガーメニュー
   ========================================================================== */
.drawer{
    display: block;
    position: fixed;
    top:8px;
    right:5px;
    z-index: 1010;
}

.drawer-hidden {
  display: none;
}

.drawer-open {
  display: flex;
  height: 60px;
  width: 60px;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  position: absolute;
  right:0;
  top:0;
  z-index: 1012;
  background-color: #fff; 
	border:thin solid #f6eadb;
}
.drawer-open:hover {
  background: #f6eadb;
  transition: 0.5s;
}

/* ハンバーガーメニューのアイコン */
.drawer-open span{
  display: block;
  height: 2px;
  width: 35px;
  border-radius: 3px;
  background: #252525;
  transition: 0.5s;
  position: absolute;
  z-index: 1013;
}

.drawer-open span:before,
.drawer-open span:after {
  content: '';
  display: block;
  height: 2px;
  width: 35px;
  border-radius: 3px;
  background: #252525;
  transition: 0.5s;
  position: absolute;
}

/* 三本線のうち一番上の棒の位置調整 */
.drawer-open span:before {
  bottom: 10px;
  opacity: 1;
}

/* 三本線のうち一番下の棒の位置調整 */
.drawer-open span:after {
  top: 10px;
    opacity: 1;
}

/* アイコンがクリックされたら真ん中の線を透明にする */
#drawer-check:checked ~ .drawer-open span {
  background: rgba(255,255,255,0);
}

/* アイコンがクリックされたらアイコンが×印になように上下の線を回転 */
#drawer-check:checked ~ .drawer-open span::before {
  bottom: 0px;
  transform: rotate(45deg);
  opacity: 1;
}
#drawer-check:checked ~ .drawer-open span::after {
  top:0px;
  transform: rotate(-45deg);
  opacity: 1;
}
  
/* メニューのデザイン*/
.drawer-content h1{
    width:100%;
    text-align: center;
    padding:40px 0 10px;
}
.nav-title{
    width:100%;
    margin:0 auto;
}
.nav-title img{
    width:100%;
    max-width: 240px;
}
.drawer-content {
  width: 100%;
  max-width:540px;
  height: 100%;
  position: fixed;
  top: 0;
  right: -540px;/* メニューを画面の外に飛ばす */
  z-index: 1001;
  background-color: #fff;
  transition: 0.5s;
  filter: drop-shadow(1px 1px 2px #333);
    padding:1em;
	overflow-y:scroll;
}

.drawer-food-cover100{
	width:100%;
	margin:0 auto;
}
.drawer-food-cover100 img{
	width:100%;
}
.drawer-food-cover{
    display: flex;
    justify-content:space-between;
	align-items:top;
    margin:0 auto;
    width:100%;
    position: relative;
}
.drawer-food-cover > div{
    width:49%;
}
.drawer-food-cover > div img{
    width:100%;
}
.drawer-food-botan{
    display: flex;
    align-items: center;
    justify-content: center;
    width:50%;
}
.drawer-food-botan img{
	width:100%;
}

ul.drawer-list{
    list-style: none;
    padding-left:0px;
    margin:0;
}

.drawer-list li{
    margin:0;
    padding:0.1em;
}

.drawer-list li a{
    padding:10px;
    display: block;
    margin:1px 0;
    color:#252525;
    text-align: center;
    border:#f6eadb thin solid;
    background-color:#f6eadb;
    border-radius: 5px;
}

.drawer-list li a:hover{
    background: rgba(255,255,255,1);
    padding:10px 0px;
}

/* アイコンがクリックされたらメニューを表示 */
#drawer-check:checked ~ .drawer-content {
  right: 0;/* メニューを画面に入れる */
}

@media (max-width: 1024px){
   
}



/* ==========================================================================
   index styles
   ========================================================================== */

/*header部*/
header{
    z-index:1;
}

.slider{
    width:100%;
    position: absolute;
    right:0;
    top:25px;
}

.slick__bg {
    background-size:contain;
    background-repeat: no-repeat;
    width:100%;
    height:100vh;
    background-position: center top;
}
.slick__bg01 {
    background-image: url(../img/bg_indexheader01.png);
}
.slick__bg02 {
    background-image: url(../img/bg_indexheader02.png);
}
.slick__bg03 {
    background-image: url(../img/bg_indexheader03.png);
}
.slick__bg04 {
    background-image: url(../img/bg_indexheader04.png);
}
.slick__bg05 {
    background-image: url(../img/bg_indexheader05.png);
}

@media (max-width: 820px){
    .slick__bg01 {
    background-image: url(../img/bg_indexheader01_sp.png);
    }
    .slick__bg02 {
    background-image: url(../img/bg_indexheader02_sp.png);
    }
    .slick__bg03 {
    background-image: url(../img/bg_indexheader03_sp.png);
    }
    .slick__bg04 {
    background-image: url(../img/bg_indexheader04_sp.png);
    }
    .slick__bg05 {
    background-image: url(../img/bg_indexheader05_sp.png);
    }
}

.oshirase-bar{
    z-index: 100;
    position: absolute;
    top:0;
    left:0;
    width:100%;
}

.fix-menu{
    width:100%;
    padding:5px 1em;
    padding-right:70px;
    height:90px;
    background:#fdfaf6;
    display: flex;
    justify-content: space-between;
    align-items: center;
    z-index: 1000;
}
.top-logo{
    line-height: 1;
    align-items: center;
    justify-content: flex-start;
    padding:20px 0 0px 1em;
}
h1.top-logo a{
    display: block;
}
h1.top-logo img{
    width:8em;
}

.h_menu{
    
}
.h_menu ul{
    display: flex;
    justify-content:flex-end;
    align-items: stretch;
}
.h_menu ul li{
    border-right:1px solid #aaa;
    text-align: center;
}
.h_menu ul li:last-child{
    border-right:none;
}
.h_menu ul li a{
    font-size: 0.9em;
    border:none;
    padding:0.5em;
    color:#121212;
}
.h_menu ul li a:hover{
    border-bottom:solid 2px #f29600;
}

.h_btn_area{
    display: flex;
    align-items: center;
    height: 90px;
}
.h_btn{
    display: flex;
    align-items: center;
    margin:0px 1px;
    font-size: 0.7em;
    align-self: stretch;
}
.h_btn:hover{
    cursor: pointer;
    background-color: #f6eadb;
    border: none;
}

.h_btn a{
    padding:1em;
    margin:0px 1px;
    align-self: stretch;
    color:#252525;
    border: none;
    text-align: center;
}
.h_btn a:hover{
    border: none;
    cursor: pointer;
    background-color: #f6eadb;
}
.h_btn img{
    display: block;
    margin:0 auto;
}

img.cart_btn{
    width:40px;
    height: auto;
}
.mypageicon_btn{
}
.mypageicon_btn img{
    width:auto;
    height:40px;
}

@media (max-width: 1250px){
    .h_menu{
        display: none;
    }
}

@media (max-width: 820px){
    .h_btn_area{
        display: none;
    }
    .top-logo{
    align-items: center;
    justify-content: center;
    padding:20px 0 0px 0em;
}
    h1.top-logo img{
    width:8em;
}
}


/*ヘッダーイメージ*/
.index-header-cover{
    position: relative;
    background:linear-gradient(180deg, #fdfaf6, #fff);
    
}
.index-header{
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 8;
    margin:0;
    padding:0;
    
}

.catch_img{
    width:75%;
    max-width:1100px;
    position: absolute;
    transform: translateX(-50%);
    top:-10px;
    left:50%;
}
.catch_img img{
    width:100%;
}

.bn_event{
    position: absolute;
    width:98%;
    max-width:600px;
    bottom:-50px;
    left:50%;
    transform: translateX(-50%);
    background-color:#d29e92;
    border-radius: 25px;
    padding:10px;
}
.bn_event p{
    color:#fff;
    text-align: center;
    font-size:clamp(1rem 2.5vw 1.4rem);
    font-weight:bold;
    margin:10px;
}
.img_dog{
    position: absolute;
    max-width: 360px;
    bottom:-100px;
    left:4%;
}
.line-otomodachi{
    position: absolute;
    max-width: 411px;
    bottom:-80px;
    left:50%;
    transform: translateX(-50%);
}

@media (max-width: 1000px){
    
    .img_dog{
    display: none;
}
    .line-otomodachi{
    position: absolute;
    max-width: 411px;
    bottom:-40px;
    left:50%;
    transform: translateX(-50%);
}

}
@media (max-width: 820px){
    .index-header{
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 22;
    margin:0;
    padding:0;
    
}
    .catch_img{
    width:95%;
    top:0px;
}
    .bn_event{
    bottom: 0px;
    padding:0px;
}
    
}
@media (max-width: 820px){
    
    .catch_img{
}
}


/*index_contents*/

.index_contents{
    width:100%;
    margin:40px auto;
    position: relative;
    padding:40px 0 0 0;
}

.section_inner h2{
    font-size: clamp(1rem, 2vw, 1.2rem);
    font-weight:  inherit;
    border-bottom: #eb6363 1px solid;
    line-height: 1.6;
    margin-bottom: 1rem;
}
.foods_narabi_midashi{
    text-align: center;
}
.img_foods_narabi_100{
    width:96%;
    max-width:687px;
    margin:0 auto;
    text-align: center;
    border-bottom:#cc9712 2px solid;
}
.img_foods_narabi_100 img{
    width:100%;
}
.img_foods_narabi{
    display: flex;
    justify-content: space-around;
    align-items: baseline;
    width:100%;
    max-width:1000px;
    margin:2em auto;
    border-bottom:#cc9712 2px solid;
}
.img_foods_narabi > div{
    width:49%;
    max-width:361px;
    margin:0 0.5rem;
}
.img_foods_narabi > div img{
    width:100%;
}
.img_foods_narabi_btn{
    width:80%;
    max-width:300px;
    margin:0 auto;
}
@media (max-width: 820px){
    .index_contents{
    margin:0px auto;
}
}
@media (max-width: 540px){
    .img_foods_narabi{
    display: inherit;
}
    .img_foods_narabi > div{
    width:98%;
    margin:0 auto;
}
}
/*251014リニューアル*/
.img_foods_block{
    display: flex;
    justify-content:center;
    align-items: stretch;
    width:100%;
    max-width:1000px;
    margin:2em auto;
    flex-wrap: wrap;
}
.img_foods_block > div{
    width:49%;
    max-width:361px;
    margin:0.5rem;
}
.img_foods_block > div.kensyu_block{
    background-color:#f0f6f6;
    padding:1em;
}
.img_foods_block > div.kensyu_block h5{
    font-size:1.3em;
    font-weight: lighter;
    padding-left:1em;
    border-left:4px #9cdddd solid;
    margin-bottom:1em;
}

.img_foods_block > div.kensyu_block h5 span{
    font-size:13px;
    color:#ab8645;
    font-weight: bold;
}
.img_foods_block > div.neko_block{
    background-color:#fcf0ee;
    padding:1em;
}
.img_foods_block > div.neko_block h5{
    text-align: center;
    margin-bottom:1em;
}

.img_foods_block > div.neko_block span{
    font-size:13px;
    color:#ab8645;
    font-weight: bold;
}
.img_foods_block > div.sns_block{
    background-color:#fdfaf6;
    padding:1em;
}
.img_foods_block > div.sns_block h5{
    text-align: center;
    font-size:1.3em;
    font-weight: lighter;
}
.sns_block i{
    font-size:2em;
    margin:1em;
}

.img_foods_block > div img{
    width:100%;
}
.img_foods_block > div img.lineimg{
    width:194px;
}

.img_foods_block_contents{
    display: flex;
    justify-content: center;
}
.img_foods_block_btn{
    flex:1;
    display: flex;
    flex-direction: column;
}
.img_foods_block_btn a{
    background-color: #fff;
    border-radius: 15px;
    padding:0.1em 0.5em;
    margin:0.2em;
    text-align: center;
    color:#252525;
    width:100%;
}
.img_foods_block_btn a:hover{
    background-color: #9cdddd;
    color:#fff;
}
.img_foods_block_img{
    flex:1;
}
.cat_btn a:hover{
    background-color: #e88d80;
    color:#fff;
}
@media (max-width: 540px){
    .img_foods_block{
    flex-direction: column;
}
    .img_foods_block > div{
    width:98%;
    margin:0.2em auto;
}
}

.img_about{
    width:100%;
    margin:0 auto;
    position: relative;
}
.img_about img{
    width:100%;
}
.img_about_btn{
    position: absolute;
    bottom:50px;
    left:50%;
    transform: translateX(-50%)
}
.img_about_btn a{
    background-color: #eb6363;
    width:360px;
    height: 50px;
    border-radius: 25px;
    padding:10px;
    text-align: center;
    color:#fff;
    display: flex;
    align-items: center;
    justify-content: center;
}
.img_about_btn a > img{
    width:10em;
}
.img_about_btn a:hover{
    background-color: #f29600;
}

.img_pr_banner{
    margin: 40px auto;
    width:100%;
    max-width:800px;
}

/*pickup*/

.pickup{
    background-image: url(../img/muni/bg_muni.png) ;
    background-repeat:  no-repeat;
    background-position: center top;
    background-size:cover;
    padding-top:3rem;
    padding-bottom: 3rem;
}
@media (max-width: 540px){
    .pickup{
    background-image:none;
    background-color: #e3edf2
}
}

.pickup-muni{
    flex: 1;
    justify-content: space-around;
}
.pickup-muni > div img{
    width: 100%;
}

.pickup_midashi{
    margin:0.5rem auto 1.5rem;
    text-align: center;
}
.pickup_banner{
    width: 90%;
    margin:0 auto;
    max-width:900px;
}
.pickup_banner img{
    width: 100%;
}
.pickup_campaign{
    width:100%;
    max-width:1127px;
    margin:40px auto;
}
.pickup_campaign img{
    width:100%;
}
.pickup_campaign p{
    text-align: right;
    margin:0;
    margin-top:0.5rem
}
.pickup_campaign p a{
    color:#896411;
    font-weight: bold;
    padding:0.5rem;
}
.pickup_campaign p a i{
    color:#cc9712;
    font-weight: bold;
    font-size:1.2rem;
}
.pickup_campaign p a:hover{
    background-color:#fff;
    border-bottom:3px solid #f29600;
}
.pickup_nagare h4{
    width:98%;
    max-width:1200px;
    margin:0 auto;
}
.pickup_nagare h4 img{
    max-width:190px;
}
.pickup_nagare{
    width:100%;
    max-width:1392px;
    margin:0 auto;
}
.pickup_nagare img{
    width:100%;
}
.pickup_nagare p{
    text-align: right;
    margin:0 auto;
    margin-top:0.5rem;
    width:98%;
    max-width:1200px;
}
.img_pickup_banner_narabi{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    width:98%;
    max-width:1200px;
}
.img_pickup_banner_narabi > div{
    width:49%;
    margin:0.5rem 0;
    background-color: #f7f4eb;
    padding-bottom: 3rem;
}
.img_pickup_banner_narabi > div a{
    display: block;
    width:98%;
    margin:0.5rem auto;
    text-align: center;
}
.img_pickup_banner_narabi > div img{
    width:100%;
    max-width:519px;
}
.img_pickup_banner_narabi > div h3{
    text-align: center;
    font-size: clamp(1.2rem, 2vw, 1.5rem);
    margin:0;
    padding:2rem;
    background-color:#dba93b;
    color:#fff;
}
.img_pickup_banner_narabi > div p{
    text-align: center;
}

p.pickup_sub_title{
    text-align: center;
    font-weight: bold;
    margin:3rem 0 2rem;
}
p.pickup_sub_title span{
    display: inline-block;
}
.pickup_btn_base a{
    display: block;
    margin: 1rem auto;
    padding:0.5rem;
    text-align: center;
    border:#16c1b0 1px solid;
    background: #16c1b0;
    color:#fff;
    border-radius: 25px;
    font-size: clamp(1.1rem, 2vw, 1.3rem);
}
.pickup_btn_base a:hover{
    border:#16c1b0 1px solid;
    background: #fff;
    color:#16c1b0;
}
.oto-order-btn{
    width:80%;
    max-width:550px;
    margin:0 auto;
}
.pickup-btn{
    width:80%;
    max-width:400px;
    margin:0 auto;
}

@media (max-width: 1000px){
.img_about_btn{
    position: absolute;
    bottom:10px;
    left:50%;
    transform: translateX(-50%)
}
}
@media (max-width: 820px){
    .index_contents{
    width:100%;
    max-width:inherit;
    min-width:inherit;
    margin:0px auto;
    padding:10px 0;

}
    .img_foods_narabi{
    
}
    .img_foods_narabi > div{
    
}
    
}
@media (max-width: 540px){
    
    .pickup_midashi img{
        width:100%;
    }
    .img_pickup_banner_narabi{
    display: inherit;
}
    .img_pickup_banner_narabi > div{
    width:100%;
        padding:1rem;
    }
    .pickup_nagare p{
    text-align: left;
    }
    .img_about_btn{
    position: relative;
    bottom:inherit;
    left:inherit;
    transform: none;
}
    .img_about_btn a{
    background-color: #eb6363;
    width:300px;
    height: 50px;
    margin:10px auto

}
.img_about_btn a > img{
    width:9em;
}

}

.info_container{
    display: flex;
    justify-content: center;
}
.info_container > div{
	margin:0.5rem;
}

.information{
	padding-bottom:3rem;
		margin-right:0.5rem;
    width: 100%;
    max-width:1000px;
}

.information > div{
    margin-bottom:0.5rem;
}
.information > div > div{
    margin:0 1rem; 
}
.information .info_text{
    margin-left:2rem;
}

.bnfooter{
    justify-content: space-around;
    width:100%;
    max-width:800px;
    margin:40px auto;
}
.bnfooter > div{
    max-width: 250px;
    margin:0 auto;
}

.tokuten{
    background-image:url(../img/bg_section01.png);
    background-position: center top;
    background-size: cover;
    background-repeat: no-repeat;
    padding-top:40px;
    padding-bottom: 40px;
    margin-bottom: 0;
}
.tokuten_midashi img{
    width: 100%;
    max-width:516px;
}
.tokuten_bn_area{
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
}
.tokuten_bn_area > div{
    flex:1
}
.tokuten_bn_area > div img{
    width:100%;
}

@media (max-width: 820px){
    .info_container{
    display:inherit;
}
    .information{
	padding-bottom:3rem;
    width: 100%;
    max-width:inherit;
}
    
}
@media (max-width: 540px){
    .tokuten_bn_area{
    flex-wrap: wrap;
}
    .tokuten_bn_area > div{
        flex:auto;
    width:45%;
}
}

/*コラムのインデックス*/

.column_area{
    display: flex;
    justify-content: space-between;
}
.column_index{
    flex:1;
    box-shadow: 1px 1px 3px #999;
    background-color: #fff;
    margin:0 0.5rem;
    max-width:225px;
	border-radius:10px;
	padding-bottom:1rem
}
.column_index_img img{
    width:100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
	border-radius:10px 10px 0 0;
}
.column_index_text{
    padding:0.5rem;
}
.column_index_text span{
    font-size:  clamp(1rem, 2vw, 1.2rem);
}
.column_index_text time{
    font-size:  clamp(0.7rem, 2vw, 0.9rem);    
}
.column_index_text p{
    font-size:  clamp(0.7rem, 2vw, 0.9rem);
	line-height:1.3;
    margin:0;
    padding:0
}
@media (max-width: 540px){
	.column_area{
    display: inherit;
}
	.column_index{
    max-width:inherit;
		margin:0.5rem;
}
}

/*TOPICS*/

/*==================================================
スライダーのためのcss
===================================*/
.topics-slider {/*横幅94%で左右に余白を持たせて中央寄せ*/
    width:94%;
    margin:0 auto;
}

.topics-slider img {
    width:30vw;/*スライダー内の画像を60vwにしてレスポンシブ化*/
    height:20vw;
    object-fit: cover;
}

.topics-slider .slick-slide {
  transform: scale(0.8);/*左右の画像のサイズを80%に*/
  transition: all .5s;/*拡大や透過のアニメーションを0.5秒で行う*/
  opacity: 0.5;/*透過50%*/
}

.topics-slider .slick-slide.slick-center{
  transform: scale(1);/*中央の画像のサイズだけ等倍に*/
  opacity: 1;/*透過なし*/
}


/*矢印の設定*/

/*戻る、次へ矢印の位置*/
.slick-prev, 
.slick-next {
    position: absolute;/*絶対配置にする*/
    top: 42%;
    cursor: pointer;/*マウスカーソルを指マークに*/
    outline: none;/*クリックをしたら出てくる枠線を消す*/
    border-top: 2px solid #666;/*矢印の色*/
    border-right: 2px solid #666;/*矢印の色*/
    height: 15px;
    width: 15px;
}

.slick-prev {/*戻る矢印の位置と形状*/
    left: -1.5%;
    transform: rotate(-135deg);
}

.slick-next {/*次へ矢印の位置と形状*/
    right: -1.5%;
    transform: rotate(45deg);
}

/*ドットナビゲーションの設定*/

.slick-dots {
    text-align:center;
  margin:20px 0 0 0;
}

.slick-dots li {
    display:inline-block;
  margin:0 5px;
}

.slick-dots button {
    color: transparent;
    outline: none;
    width:5px;/*ドットボタンのサイズ*/
    height:5px;/*ドットボタンのサイズ*/
    display:block;
    border-radius:50%;
    background:#ccc;/*ドットボタンの色*/
    border:none;
}

.slick-dots .slick-active button{
    background:#4893ff;/*ドットボタンの現在地表示の色*/
}

@media (max-width: 540px){
    .topics-slider img {
    width:80vw;/*スライダー内の画像を60vwにしてレスポンシブ化*/
    height:50vw;
    object-fit: cover;
}
    .slick-prev, 
.slick-next {
    position: absolute;/*絶対配置にする*/
    top: 30%;
    cursor: pointer;/*マウスカーソルを指マークに*/
    outline: none;/*クリックをしたら出てくる枠線を消す*/
    border-top: 2px solid #666;/*矢印の色*/
    border-right: 2px solid #666;/*矢印の色*/
    height: 15px;
    width: 15px;
}

}

/*=============
アニメーションcss
===============*/
.animation{
    opacity : 0;
    visibility: hidden;
    transition: 3s;
    transform: translateY(80px);
    animation-delay: 5s;
    animation-duration: 8s;
}
/*アニメーション要素までスクロールした時のスタイル*/
.active{
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}




/* ==========================================================================
   footer
   ========================================================================== */

footer{
   width:100%;
    box-sizing: border-box;
    position: relative;
    z-index: 101;
    padding: 40px 0;
    background-color:#eb6363;
}

.footer-muni{
   width:100%;
    box-sizing: border-box;
    position: relative;
    z-index: 101;
    padding: 40px 0;
    background-color:#fff;
}

.footer_logo{
    width:50%;
    max-width:250px;
}

footer .contents{
    width:1100px;
    padding:10px;
    margin:0 auto;
}
footer .add{
    width: 33vw;
    margin-right:30px;
}
footer h1{
    text-align: center;
}
footer h1 img{
    width: 100%;
}
footer .sitemap{
    margin:15px;
    width: 100vw;
    display: flex;
    justify-content: flex-start;
}
footer .sitemap ul{
    flex: 1;
}
footer .sitemap ul li{
    list-style: square;
    color: #fff
}
footer .sitemap ul li a{
    color: #fff;
}
.sub-ul{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}
.sub-ul span{
    color: #fff;
    margin-right:2rem;
}
.sub-ul-muni{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}
.sub-ul-muni span{
    color: #444;
    margin-right:2rem;
}
.sns{
    display: flex;
    justify-content: center;
    padding:10px;
}
.sns a{
    font-size:24px;
    color:#fff; 
    margin:5px 10px;
    border:none;
}
.sns a:hover{
    color:#fff;
}
.footer-info{
    width:320px;
}
.copy{
    font-size: 0.7rem;
    color: #fff;
    text-align: center;
    width:320px;
}

@media (max-width: 820px){
    footer{
    
}
    footer .contents{
    width:100%;
    padding:0px 10px;
    margin:0 auto;
}
    footer .sitemap{
    margin:15px 15px;
}
}
    
@media (max-width: 540px){
    footer{
        padding: 20px 0;
}
    
    footer .add{
    width: 100vw;
    margin-right:0px;
    }
    footer .add img{width:80%;}
    
    footer .sitemap{
    display: inherit;
    width: 60%;
    margin: 15px auto;
}
    .sub-ul{
        display: inherit;
    }
    .sub-ul > div{
        margin:0 auto;
        text-align: center;
        }
    .sub-ul span{
    margin-right:0;
}
}




/* ==========================================================================
   問い合わせ
   ========================================================================== */
.toiawase{
    margin-left:5px;
    font-size: 1rem;
    max-width:800px;
    margin:0 auto 40px;
}
.toiawase-row{
    margin:10px;
    width:95%;
}
.toiawase-row p{
    margin:0;
}
.toiawase-koumoku{
    padding:5px 0;
}
.toiawase-input{
    padding:5px;
    background-color:#f6f6f6;
    width:100%;
}
input.toiawase-input {
    height: 2rem;
    font-size: 1rem;
    width:100%;
}
input.toiawase-input:focus{
    outline: none;
    border-bottom: 1px solid #4893ff;
    transition: .3s
}

.w_long{
    width:90%;
}
.w_short{
    width:50%;
}

textarea.toiawase-input {
    width:100%;
    font-size: 1rem;
    height:8rem;
    padding:5px;
}
textarea.toiawase-input:focus{
    outline: none;
    border-bottom:1px solid #4893ff;
    transition: .3s
}



@media (max-width: 540px) {
.toiawase-row{
    display: inherit;
}
.toiawase-koumoku{
    width:100%;
}
.toiawase-input{
    width:100%;
}
    .w_long,.w_short{
    width:98%;
}
    .toiawase_btn_w a{
    width: 98%;
}
}

/*定休日カレンダー*/
.uni-calender{
    font-size:0.9rem;
    padding:0.5rem;
    margin:0.5rem;
    box-sizing: border-box;
}
.uni-calender h4{
    text-align: center;
    margin:0.5rem 0;
}
.uni-calender table{
    width:100%;
}
.uni-calender table td, .uni-calender table th{
    text-align: center;
    padding:0.5rem;
}
.uni-calender table th{
    background-color:#eee;
}
.uni-calender table td:first-child{
    color:red;
}
.closed{
    background-color:#ebd3d5;
    color:#fff;
}
.holiday{
    color:red;
}
.uni-calender caption{
    text-align: center;
    font-size: 1.1rem;
    padding-bottom:0.2rem;
}
.hanrei{
    display: flex;
    align-items: center;
}
.shikaku{
    width:1.5rem;
    height: 1.5rem;
    background-color:#ebd3d5;
    display: inline-block
    
}

/* ==========================================================================
   ページトップへ戻る
   ========================================================================== */

#page-top a{
    position: fixed;
    right: 100px;
    bottom:20px;
    width:60px;
    height:60px;
    color: #fff;
    background-color:#f29600;
    border-radius:50%;
    border:#f29600 5px solid;
    padding:0px;
    font-size:4rem;
    font-weight: lighter;
    text-decoration: none;
    display: flex;
    align-items: center;
    justify-content: center;
    border:none;
    z-index:9999;
}
#page-top a:hover{
    color:#eb6363;
    background-color:#fff;
}
@media (max-width: 540px) {
	#page-top a{
    	right: 20px;
    	bottom:20px;
}
}
/* ==========================================================================
   システム用
   ========================================================================== */

.error{
    color: red;
}
.displaynone{
		display:none;
	}