@charset "UTF-8";

body {
  position: relative;
  font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", sans-serif;
  color: black;
  background: white; }
  
.mt1 { margin-top: 1%; }
.mt2 { margin-top: 2%; }
.mt3 { margin-top: 3%; }
.mt4 { margin-top: 4%; }
.mt5 { margin-top: 5%; }
.mt6 { margin-top: 6%; }
.mt7 { margin-top: 7%; }
.mt8 { margin-top: 8%; }
.mt9 { margin-top: 9%; }
.mt10 { margin-top: 10%; }
.mt15 { margin-top: 15%; }
.mt20 { margin-top: 20%; }

.b { font-weight: bold; }
.center { text-align: center; }

img { 
   width: 100%;
   vertical-align: top;
   display: block; }

a { text-decoration: none; 
    color: black; } 

.nc { pointer-events: none; }

/* トップに戻るボタン（PC・スマホ共通） */
#back-to-top {
   position: fixed;
   right: 2.4%;
   bottom: 6vw;
   z-index: 9999;
   width: 38px;
   height: 68px;
   padding: 0;
   border: 0;
   background: transparent;
   cursor: pointer;
   opacity: 0;
   visibility: hidden;
   pointer-events: none;
   transition: opacity 0.25s ease, visibility 0.25s ease;
}

#back-to-top img {
   display: block;
   width: 100%;
   height: auto;
}

#back-to-top.is-visible {
   opacity: 1;
   visibility: visible;
   pointer-events: auto;
}

@media (hover: hover) and (pointer: fine) {
   #back-to-top:hover {
      opacity: 0.75;
   }
}

/* MOBILE */
@media screen and (max-width: 768px) {

#back-to-top {
   right: 3%;
   bottom: 4vw;
   width: 9%;
   height: auto;
}

.pc {
   display: none; }

.main-visual {
   position: relative; 
   width: 100%;
   line-height: 0;
}

.main-background {
   display: block;
   width: 100%;
   height: auto;
}

/* 上に重ねるPNGの共通設定 */

.main-visual .overlay {
    position: absolute; 
    height: auto; 
    max-width: none;
}

.main-visual .overlay-img {
   top: 47%;
   left: 50%;
   width: 80%;
   transform: translateX(-50%);
}

.main-visual .overlay-img2 {
   top: 56%;
   left: 50%;
   width: 80%;
   transform: translateX(-50%);
}

.main-visual .overlay-btn1 {
   top: 64.5%;
   left: 50%;
   width: 80%;
   transform: translateX(-50%);
}

.main-visual .overlay-btn2 {
   top: 71%;
   left: 10%;
   width: 80%;
}

.main-visual .overlay-btn3 {
   top: 77.5%;
   right: 10%;
   width: 80%;
}

.main-visual .overlay-btn4 {
   top: 85%;
   right: 10%;
   width: 80%;
}


/* コンテンツ全体 */

.content-panel {
   position: relative;
   isolation: isolate;
   width: 100%;
   box-sizing: border-box;
   margin-top: -13.5vw;
}

/* back1.png：先頭に1回だけ表示 */

.content-panel::before {
   content: "";
   display: block;
   width: 100%;
   aspect-ratio: 4 / 1;
   background-image: url("img/back1.png");
   background-repeat: no-repeat;
   background-position: center top;
   background-size: 100% 100%;
}

/* back2.png：back1.pngの直後から繰り返す */

.content-panel::after {
   content: "";
   position: absolute;
   top: 20vw;
   bottom: 0;
   left: 0;
   width: 100%;
   z-index: -1;
   background-image: url("img/back2.png");
   background-repeat: repeat-y;
   background-position: center top;
   background-size: 100% auto;
}

/* 閉じたコンテンツは非表示 */

.content-panel[hidden] {
   display: none !important;
}


/* xxxxxxxx CONTENT 1 xxxxxxxx */

.c1_title {
   width: 90%;
   margin-left: 5%; 
   margin-top: 2%;} 

.c1_img1 {
   width: 90%;
   margin-left: 5%; 
   margin-top: 8%;}
   
.c1_img2 {
   width: 90%;
   margin-left: 5%; 
   margin-top: 6%;}

.c1_img3 {
   width: 90%;
   margin-left: 5%; 
   margin-top: 6%;
   padding-bottom: 9%; }
   
.c1_img4 {
   width: 90%;
   margin-left: 5%; 
   margin-top: 2%;
   padding-bottom: 12%; }

/* xxxxxxxx CONTENT 2 xxxxxxxx */

.map {
  width: 90%;
  margin-left: 5%;
  margin-top: 7%;
  padding-bottom: 13%; }

/* xxxxxxxx CONTENT 3 xxxxxxxx */

.c3_title {
   margin-top: -10%; }

.item_outline {
   width: 88%; 
   margin-left: 9%;
   margin-top: 5%; }

.item_box {
   position: relative;
   width: 44.8%;
   margin-right: 2%; 
   background: white;
   border: solid 1px #af0000;
   display: inline-block;
   vertical-align: top;
   margin-bottom: 3%; }
   
.item_box2 {
   position: relative;
   width: 44.8%;
   margin-right: 2%; 
   background: white;
   border: solid 1px #008100;
   display: inline-block;
   vertical-align: top;
   margin-bottom: 3%; }

.item_box_in {
   padding: 5%;}

.c_shop {
   font-size: 1.45vw;
   color: #af0000;
   text-align: center;
   margin-top: 5.2%;
   font-weight: bold; }

.c_hr {
   border-top: 1px solid #af0000;
   margin-top: 3%;
   margin-bottom: 3%; }

.c_item {
   font-size: 1.85vw;
   color: #af0000;
   text-align: center;
   font-weight: bold; }
   
.c_item2 {
   font-size: 1.85vw;
   line-height: 2.2vw;
   color: #af0000;
   text-align: center;
   font-weight: bold; }

.c_size {
   font-size: 1.35vw;
   text-align: center;
   margin-top: 9%; }
   
.c_size2 {
   font-size: 1.35vw;
   text-align: center;
   margin-top: 2.3%; }

.c_price {
  font-size: 1.9vw;
  text-align: center;
  margin-top: 2%; 
  font-weight: bold; }
  
.c_price2 {
  font-size: 1.9vw;
  text-align: center;
  margin-top: 14.4%; 
  font-weight: bold; }
  
.c_price3 {
  font-size: 1.9vw;
  text-align: center;
  margin-top: 16%; 
  font-weight: bold; }

.zei {
   font-size: 1.4vw;
   font-weight: normal; }

.label1 {
   position: absolute;
   width: 20.7%;
   bottom: 2.5%;
   right: 3%; }

.c_bottom {
   margin-top: 6%;
   width: 86%;
   margin-left: 7%; }

.c_bottom_inline p {
   font-size: 2.1vw;
   font-weight: bold;
   display: inline-block;
　　width: 25%;
   margin-right: 2%; 
　　vertical-align: top; }

.c_ex {
   font-size: 1.6vw;
   line-height: 2.6vw; }
   
.c_ex2 {
   font-size: 1.6vw;
   line-height: 2.6vw; 
   margin-top: 4%; 
   font-weight: bold; }
   
.c_ex3 {
   font-size: 1.6vw;
   line-height: 2.6vw;
   margin-top: 2%;
   margin-bottom: 3%; }

.c_copy {
   font-size: 2.1vw;
   font-weight: bold;
   margin-top: 1.3%; }

.c_time {
   font-size: 2.6vw;
   font-weight: bold;
   margin-top: 2.6%; }

.c_time2 {
   font-size: 2.2vw;
   font-weight: bold;
   margin-top: 1%;
   line-height: 3.6vw;
   padding-bottom: 10%; }


.c_com {
   font-size: 1.6vw; 
   margin-top: 4%;
   line-height: 2.65vw;
   padding-bottom: 6%; }

/* xxxxxxxx CONTENT 4 xxxxxxxx */

.c4_title {
   margin-top: -10%; }

.d_shop {
   font-size: 1.45vw;
   color: #008100;
   text-align: center;
   margin-top: 5.2%;
   font-weight: bold; }

.d_hr {
   border-top: 1px solid #008100;
   margin-top: 3%;
   margin-bottom: 3%; }

.d_item {
   font-size: 1.85vw;
   color: #008100;
   text-align: center;
   font-weight: bold; }
   
.d_item2 {
   font-size: 1.85vw;
   line-height: 2.2vw;
   color: #008100;
   text-align: center;
   font-weight: bold; }



.footer {
   background: #c08718; }

.bottom_logo {
   width: 25%;
   margin-left: auto;
   margin-right: auto;
   padding-top: 3%;
   padding-bottom: 3%; }

}