@charset "utf-8";

/* --- common --- */


/* --メインスライド------------------------ */
#slide { padding:10px 0; border-top:4px solid #f24855; border-bottom:4px solid #f24855; background:#e60012; }
#slide li { padding:0 20px;}

#arrow { position:relative; top:-225px; left:50%; width:1000px; height:100%; margin-left:-500px; }

#arrow .slick-arrow { position:absolute; top:50%; width:45px; height:45px;
  text-indent:-9999px; z-index:999; opacity:1;
  border-radius:50%; background:#ffbf13; border:none;
  -webkit-transform:translateY(-50%); transform:translateY(-50%);
  -webkit-transition:all .3s ease-in; transition:all .3s ease-in; }
#arrow .slick-arrow:hover { background:#ffdd78; }
#arrow .slick-prev:before, #arrow .slick-next:before {
  content:""; position:absolute; top:0; left:0; right:0; bottom:0; background:url(../img/icon-arrow-wht.svg) no-repeat center / 42%;;
}
#arrow .slick-prev:before { -webkit-transform:scale(-1, 1); transform: scale(-1, 1); }
#arrow .slick-prev { left:-25px; }
#arrow .slick-next { right:-25px; }

.topnav { margin-block:1em; display:grid; grid-template-columns:repeat(4, 1fr); gap:min(2vw,15px); }
.topnav > li { text-align:center; }
.topnav > li > a { display:block; padding:3em .5em .5em; color:#fff; background-color:#e60012; border-radius:5px; position:relative; }
.topnav > li > a::before { display:block; content:""; position:absolute; top:.8em; left:50%; width:2em; height:2em; transform:translateX(-50%); background:no-repeat center / contain; }
.topnav .reason > a::before { background-image:url(../img/icon-star-wht.svg); }
.topnav .medama > a::before { background-image:url(../img/icon-car-wht.svg); }
.topnav .flyer > a::before { background-image:url(../img/icon-flyer.svg); }
.topnav .store > a::before { background-image:url(../img/icon-store.svg); }


/* webtokuten WEB限定特典
================================================================== */
.webtokuten { padding-top:50px; }
h2.top_h2 {font-size:30px; text-align:center; }
.bnr_tokuten { background:#fff; }
.bnr_tokuten img { width:100%; padding:30px 100px 70px; }

.border_red {
  display:block;
  width:74px;
  height:5px;
  background-color:#d4432b;
  margin:5px auto;
}

.kaitori_bnr {margin: 5em auto;}

/* top_banner
================================================================== */
.top_banner { padding:50px 0 1.7rem;}
.top_banner li { position:relative; z-index:2; width:48%; }
.top_banner li:after { content:""; position:absolute; top:10px; right:10px; bottom:-10px; left:-10px; z-index:-1; opacity:.4; }
/* .top_banner .unused:after { background:url(../img/ptn-stripe-red.svg); }
.top_banner .used:after { background:url(../img/ptn-stripe-org.svg); } */
.top_banner .more_btn { position:absolute; left:0; right:0; bottom:-1.7rem; text-align:center; }
.top_banner .more_btn .btn { font-size:1.187rem; }

.top_banner > p + p { margin-top:5%; }

.import { margin-block: 3em 5em;}
.import .ttl { background-color: #4d4d4d;}
.import .bnr_list { display: grid; grid-template-columns: repeat(3,1fr); gap: 1em; margin-top: 1.2em;}

/* top_reson
================================================================== */
#top_reson { padding:35px 0 80px; background:url(../img/bg-tryangle-btm.svg) no-repeat center bottom; }
.top_reson-list { padding:10px 0 0; }
.top_reson-list > div + div { margin-top:1em; }
.top_reson-list .ttl { padding:.5em; color:#fff; font-size:1.3rem; font-weight:bold; line-height:1; background-color:#ffbf14; position:relative; }
.top_reson-list .ttl::before {
  content:'▼'; display:block; position:absolute; top:50%; right:1em; transform:translateY(-50%);
  color:#fff; font-size:1.4rem; transition:all .3s; }
  .top_reson-list .ttl.active::before { transform:translateY(-50%) rotate(180deg); }
.top_reson-list .ttl > span { font-size:1.3em; }
.top_reson-list .reason1 .ttl, .top_reson-list .reason3 .ttl { font-size:1.6rem; }
.top_reson-list dd { display:none; padding:1em; }
.top_reson-list dd::after { content:"."; display:block; height:0; clear:both; visibility:hidden; }
.top_reson-list figure { float:left; width:40%; margin-right:min(5%,20px); }



/* support
================================================================== */
.top_support { padding:40px 0 65px; }
.top_support_img { margin-top:45px; }

/*kei_cam
================================================================== */
.kei_cam { margin-bottom: 45px;}

/* staff_top
================================================================== */
.top_staff { padding:30px 0 60px; }
.top_staff-list li { width:31%; }
.top_staff-list .name { color:#e60012; text-align:center; font-weight:bold; }
.top_staff-btn { margin-top:1.5625rem; }

/* movie
================================================================== */
.top_movie { padding:55px 0; }
.top_movie-ttl { margin-bottom:2.8rem; text-align:center; }
.top_movie-ttl .logo { margin-bottom:24px; }
.top_movie-list { margin-bottom:50px; }
.top_movie-list li { position:relative; overflow:hidden; height:0;
  width:100%; padding-bottom:56.25%; margin-bottom:20px; /*複数のときwidth:48%; padding-bottom:30%;*/ }
.top_movie-list li iframe ,.top_movie-list li video{ position:absolute; top:0; left:0; width:100%; height:100%; }

.hatuuri_movie  { margin-top: 1em;}

/* blog
================================================================== */
.top_blog { padding:50px 0 60px }
.blogList li { width:23%; height:230px; margin-bottom:15px; }
.blogList li:not(:nth-child(4n+1)) { margin-left:2.6%; }
.blogList li a { display:block; width:100%; height:100%; position:relative; }
.blogList li a:before, #instaList > li a::before {
  content:''; display:block;
  position:absolute; top:0; bottom:0; left:0; right:0;
  background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,.5) 100%);
  background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,.5) 100%);
  background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,.5) 100%);
  z-index:1;
}
.blogList li figure { width:100%; height:100%; position:relative; overflow:hidden; }
.blogList li figure img { width:100%; height:100%; object-fit:cover; font-family:'object-fit:cover;'; /*IE対策*/ -webkit-transform:scale(1); transform:scale(1); text-decoration:none; -webkit-transition:all .3s; transition:all .3s; }
.blogList li .summary { position:absolute; bottom:0; left:0; width:100%; padding:.8em; color:#fff; z-index:2; }
.blogList li .summary .date { margin:0 0 .2em; line-height:1; font-size:1.125rem; letter-spacing:.1em; }
.blogList li .summary .title { margin:0; font-weight:bold; }

.blogList li a:hover { color:#fff; }
.blogList li a:hover figure img { -webkit-transform:scale(1.05); transform:scale(1.05); }


.waribiki_haishi { padding:3em 0 1em; text-align:center; }


/* カレンダー
--------------------------------------------------- */
#fcal { overflow:hidden; }
#fcal h3 { width:100%; margin-bottom:30px; text-align:center; }

#fcal .data { position:relative; margin-bottom:15px; width:48%; border: 3px solid #e60012; }
#fcal .ym { margin:0; text-align:center; color: #fff; background:#e60012; }
#fcal .ym .year { margin-top:0; font-size:1.4em; }
#fcal .ym .month { font-size:1.8em; margin-left:10px; }

#fcal .data .saturday { color:#0d75ce; }
#fcal .data .holiday { color:#e60012; }
#fcal .data table { margin: 5%; width:90%; }
#fcal .data td { padding:2px; font-weight:bold; text-align:center; }
#fcal .data td span { display:block; width:28px; margin:auto; padding-bottom:2px; line-height:26px; border-radius:50%; }

#fcal .calList { margin-bottom:1em; column-gap: 25px; }
#fcal .calList li { position:relative; padding-left:20px; font-weight:bold; }
#fcal .calList li::before { content:""; position:absolute; width:15px; height:15px; top:7px; left:0; border-radius:50%; }

#fcal .data td.all span { color:#FFF; background-color:#e60012; }
#fcal .data td.service span { color:#FFF; background-color:#0d75ce; }
#fcal .data td.sales span { color:#FFF; background-color:#3cc302; }
#fcal .data td.other span { color:#FFF; background-color:#ffbf14; }

#fcal .calList li.all::before { background:#e60012; }
#fcal .calList li.service::before { background:#0d75ce;}
#fcal .calList li.sales::before { background:#3cc302; }
#fcal .calList li.other::before { background:#ffbf14; }