@charset "UTF-8";

body {
  position: relative;
  font-family: MS 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; }

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

a:hover {
   opacity: 0.75; }
 
 /* MOBILE 
@media screen and (max-width: 768px) {
*/
 
 .pc {display: none; }
   
 p {
     font-size: 3vw;
     text-align: justify;
      line-height: 4vw; }
 
.header { 
    background: #00823E;} 
 
.top_logo {
   width: 83%;
   margin-left: 6.5%;
   padding-top: 3%;
   padding-bottom: 4.5%; }
   
.content_box {
   background-image: url(../img/k2_back.png);
   background-size: 100%;
   backgroun-position: top,left;
   min-height: 100vw; }  
  
.c1_1 {
   width: 91%;
   margin-left: 4.3%;
   padding-top: 1%; } 
   
.c1_xx {
   width: 60%;
   margin-left: 20%;
   padding-top: 3%; } 
   
.c1_2 {
   width: 53%;
   margin-left: 24%;
   padding-top: 3%; }

.c_p {
   width: 80%;
   margin-left: 10%;
   font-size: 1.9vw;
   text-align: center;
   padding-top: 3%;
   line-height: 3.2vw;
   padding-bottom: 4%; }
   
.c_p2 {
   width: 90%;
   margin-left: 5%;
   font-size: 1.9vw;
   text-align: center;
   padding-top: 4%;
   line-height: 3.2vw;
   padding-bottom: 4%; }
   
.top_btn {
   width: 75.5%;
   margin-left: 12.4%;
   padding-top: 3%; }
   
.top_btn2 {
   width: 75.5%;
   margin-left: 12.4%;
   padding-top: 4.3%;
   margin-bottom: -1.5%; }
   
.contentxx {
   background: white;
   width: 85%;
   margin-top: 5%;
   margin-left: 7.6%;
   border-radius: 10px; }    
   
.c2_1 {
   width: 108%; 
   margin-left: -3%;
   padding-top: 5%;
   margin-bottom: 2%; }

   
.c2_btn1 {
   width: 55%;
   margin-left: 23%;
   margin-top: 2.3%; }
   

   
.c3_1 {
   width: 99%;
   margin-left: 4%;
   margin-top: 3%;}
   
.c3_2 {
   width: 92%;
   margin-left: 3.4%;
   margin-top: 3.5%; }
   
.c3_btn1 {
   width: 82%;
   margin-left: 9%;
   margin-top: 3%; }
   
   
.c4_1 {
   width: 95%;
   margin-left: 1.5%; 
   padding-top: 4%; }
   
.c4_btn {
   width: 81%;
   margin-left: -3%;
   margin-top: 1%; }
   
.bottom_img {
   padding-top: 3.5%; }
   

/* ------------------------------------------ */

.content {
   background-image: url(../img/back1.jpg);
   background-size: 89%;
   backgroun-position: top,left;
   min-height: 100vw; }

.pad1{
   height:6.5vw;}
   
.pad2{
   height:5vw;}
      
.box {
   background: #FFFEEE;
   width: 85%;
   margin-left: 7.5%;
   border-radius: 14px; }

.title {
   width: 85%;
   margin-left: 7.5%; 
   padding-top: 3.5%; }

.shop_box {
   margin-top: 6%;}
   
.shop_box2 {
   width: 80%;
   margin-left: 10%;}
   
.shop_left {
   width: 37.8%;
   margin-left: 9%;
   display: inline-block;
   vertical-align: top; }
   
.shop_right {
   width: 37.8%;
   margin-left: 5.5%;
   display: inline-block;
   vertical-align: top; }
   
.shop_right2 {
   width: 37.8%;
   margin-left: 1.3%;
   display: inline-block;
   vertical-align: top; }

.logo1 {
   margin-top: 5%;
   margin-bottom: 3%; }
   
.logoxx {
   margin-top: 15%;
   margin-bottom: 9.2%; }
   
.logoaa {
   margin-top: 7%;
   margin-left: 17%; }
   
.logo2 {
   width: 46%;
   margin-bottom: 3%;}
   
.logo3 {
   width: 100%;
   padding-top: 10%;
   margin-bottom: 2%;}
   
.logo4 {
   width: 45%;
   padding-top: 4.5%;
   margin-bottom: 4.5%;}
   
.logo5 {
   width: 45%;
   padding-top: 9%;
   margin-bottom: 2%;}

.name {
   font-size: 2vw;
   font-weight: bold; }
   
.name2 {
   font-size: 1.87vw;
   font-weight: bold;
   line-height: 2.7vw;
   margin-top: 3%;
   margin-bottom: 3%; }   
   
.name3 {
   font-size: 1.7vw;
   margin-top: -2%;
   font-weight: bold; }
  
.name4 {
   font-size: 1.7vw;
   margin-top: -3%;
   margin-left: 5%;
   font-weight: bold; }
   
.name5 {
   font-size: 1.7vw;
   margin-top: 2%;
   margin-left: 0%;
   font-weight: bold; }
   
.name6 {
   font-size: 1.87vw;
   margin-top: 2%;
   margin-left: 0%;
   line-height: 2.65vw;
   font-weight: bold; }
   
.name7 {
   font-size: 1.7vw;
   margin-top: -1%;
   font-weight: bold; }
   
.name8 {
   font-size: 1.7vw;
   margin-top: 0%;
   font-weight: bold; }

.price {
   font-size: 2vw;
   font-weight: bold;
   margin-top: -2%; }
   
.price2 {
   font-size: 2vw;
   font-weight: bold;
   margin-top: -4.4%; }
   
.price3 {
   font-size: 2vw;
   font-weight: bold;
   margin-top: 5%; }
   
.price4 {
   font-size: 2vw;
   font-weight: bold;
   margin-top: 0%; }
   
.price5 {
   font-size: 2vw;
   font-weight: bold;
   margin-top: -3%; }
   
.price6 {
   font-size: 1.8vw;
   font-weight: bold;
   margin-top: -3%; }
   
.price7 {
   font-size: 1.8vw;
   font-weight: bold;
   line-height: 3.1vw;
   margin-top: 5.5%; }
   
.price8 {
   font-size: 2vw;
   font-weight: bold;
   margin-top: 3%; }
   
.price9 {
   font-size: 2vw;
   font-weight: bold;
   margin-top: 1%; }
   
.ls1 {
   letter-spacing: -0.1vw; }
   
.ls2 {
   font-size: 2.67vw;
   font-family: sans-serif;
   font-weight* bold;
   letter-spacing: -0.1vw; }


.kakaku {
   color: #E60012;
   font-size: 3vw;
   margin-left: 2%;
   font-weight: bold;
   font-family: "Helvetica" , sans-serif; }
   
.kakaku2 {
   color: #E60012;
   font-size: 3vw;
   margin-left: 0%;
   font-family: "Helvetica" , sans-serif; }
   
.kakaku3 {
   color: #E60012;
   font-size: 3vw;
   margin-left: 0%;
   margin-top: -3%;
   font-weight: bold;
   font-family: "Helvetica" , sans-serif; }
   
.kakaku4 {
   color: #E60012;
   font-size: 3vw;
   margin-left: 0%;
   margin-top: 1.8%;
   font-weight: bold;
   font-family: "Helvetica" , sans-serif; }
   
.kakaku5 {
   color: #E60012;
   font-size: 3vw;
   margin-left: 0%;
   margin-top: -1%;
   font-weight: bold;
   font-family: "Helvetica" , sans-serif; }
   
.kakaku6 {
   color: #E60012;
   font-size: 2.8vw;
   margin-left: 0%;
   margin-top: 0%;
   font-weight: bold;
   font-family: "Helvetica" , sans-serif; }
   
.kakaku7 {
   color: #E60012;
   font-size: 2.8vw;
   margin-left: 0%;
   margin-top: -1%;
   font-weight: bold;
   font-family: "Helvetica" , sans-serif; }
   
.kakaku8 {
   color: #E60012;
   font-size: 2.8vw;
   margin-left: 0%;
   margin-top: 5%;
   font-weight: bold;
   font-family: "Helvetica" , sans-serif; }
 
.kakaku9 {
   color: #E60012;
   font-size: 2.8vw;
   margin-left: 0%;
   margin-top: -1%;
   font-weight: bold;
   font-family: "Helvetica" , sans-serif; }  

.yen {
   color: #E60012;
   font-size: 1.7vw;
   font-weight: bold;
   margin-left: 0.8%; }
   
.zei {
   font-size: 1.6vw;
   margin-left: -2%; }
   
.zei2 {
   font-size: 1.6vw;
   margin-left: -0.5%; }

.com {
   font-size: 1.3vw;
   line-height: 1.8vw; }
   
.com2 {
   margin-top: 1.4%;
   font-size: 1.3vw;
   line-height: 1.8vw; }
   
.com3 {
   margin-top: 4%;
   font-size: 1.3vw;
   line-height: 1.8vw; }
   
.com4 {
   margin-top: 4%;
   font-size: 1.3vw;
   line-height: 1.8vw; }
   
.com5 {
   margin-top: 2%;
   font-size: 1.3vw;
   line-height: 1.8vw; }

.shop_name {
   font-size: 2vw;
   font-weight: bold; }

.item_hr {
   border-top: 1px dotted black;
   margin-top: 3%;
   margin-bottom: 0%; }
   
.item_hr2 {
   border-top: 1px dotted black;
   margin-top: 14.3%;
   margin-bottom: 0%; }
   
.item_hr3 {
   border-top: 1px dotted black;
   margin-top: 5%;
   margin-bottom: 0%; }
   
.item_hr4 {
   border-top: 1px dotted black;
   margin-top: 11.5%;
   margin-bottom: 0%; }
   
.item_hr5 {
   border-top: 1px dotted black;
   margin-top: 0%;
   margin-bottom: 0%; }
   
.item_hr6 {
   border-top: 1px dotted black;
   margin-top: 16%;
   margin-bottom: 0%; }
   
.item_hr7 {
   border-top: 1px dotted black;
   margin-top: 2%;
   margin-bottom: 0%; }
   
.item_hr8 {
   border-top: 1px dotted black;
   margin-top: 2%;
   margin-bottom: 0%; }
   
.item_hr9 {
   border-top: 1px dotted black;
   margin-top: 6%;
   margin-bottom: 0%; }
   
.item_hr10 {
   border-top: 1px dotted black;
   margin-top: 7.5%;
   margin-bottom: 0%; }
   
.item_hr11 {
   border-top: 1px dotted black;
   margin-top: 7%;
   margin-bottom: 0%; }
   
.item_hr12 {
   border-top: 1px dotted black;
   margin-top: 7%;
   margin-bottom: 0%; }
   
.item_hr13 {
   border-top: 1px dotted black;
   margin-top: 3.8%;
   margin-bottom: 0%; }
   
.item_hr14 {
   border-top: 1px dotted black;
   margin-top: 4%;
   margin-bottom: 0%; }
   
.item_hr15 {
   border-top: 1px dotted black;
   margin-top: 8%;
   margin-bottom: 0%; }
   
.item_hr16 {
   border-top: 1px dotted black;
   margin-top: 9%;
   margin-bottom: 0%; }
   
.item_hr17 {
   border-top: 1px dotted black;
   margin-top: 6.5%;
   margin-bottom: 0%; }
   
.item_hr18 {
   border-top: 1px dotted black;
   margin-top: 9%;
   margin-bottom: 0%; }

.bottom_box {
   margin-top: 5%;
   padding-bottom: 5%; }

.bottom_text {
   width: 55.5%;
   margin-left: 21.5%; }

.bottom1 {
   width: 27.3%;
   margin-left: 21.5%;
   display: inline-block;
   vertical-align: top; }
   
.bottom2 {
   width: 27.3%;
   margin-left: 1%;
   display: inline-block;
   vertical-align: top; }
 
 
.footer_box1 {
   width: 80%;
   margin-left:11%;
   padding-top: 5%; }

.b1 {
   font-size: 1.9vw;
   display: inline-block;
   font-weight: bold;
   margin-right: 2%; }

.b2 {
   font-size: 1.9vw;
   font-weight: bold;
   margin-top: -1%; }
   
.footer_box2 {
   width: 81%;
   margin-left:11%;
   padding-top: 1%; }
   
.b3 {
   font-size: 1.57vw;
   font-weight: bold; }
   
.b4 {
   font-size: 1.9vw;
   line-height: 2.8vw;
   margin-top: 2%; }

.footer_logo_box {
   width: 81%;
   margin-left: 12%;
   margin-top: 3%; }

.bottom_logo {
   width: 35%;
   padding-bottom: 6%;
   margin-left: 4%; }

.bottom_sns_box {
   border: solid 1px #00833E;
   width: 45%;
   margin-left: 2.8%;
   display: inline-block; }

.kochira {
   width: 53%;
   display: inline-block; }
   
.line {
   width: 27%;
   display: inline-block;
   padding-top: 2.5%;
   margin-left: 8.5%; }
   
.insta {
   width: 28%;
   display: inline-block;
   padding-top: 2%;
   margin-left: 2%; }

.link1 {
   width: 33.3%;
   margin-left: 33%;
   margin-top: 5%;
   margin-bottom: 4.5%; }

.k2_pad {
   height: 5vw; }
   
.k2_pad2 {
   height: 0.5vw; }

/* ----------------------------------------- */

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

.popup {
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  z-index: 1000;
}

.popup h2 {
   font-size: 13px; }

.popup p {
   margin-top: 1%;
   font-size: 13px; }

.popup.show {
  opacity: 1;
  pointer-events: auto;
}

.popup-content {
  background: white;
  margin: 50px auto;
  padding: 20px;
  width: 80%;
  max-height: 80vh;         /* 画面の80%を上限に */
  overflow-y: auto;  
  max-width: 400px;
  border-radius: 10px;
  position: relative;
}

.close {
  position: absolute;
  top: 10px; right: 15px;
  font-size: 24px;
  cursor: pointer;
}

.openBtn {
   width: 58.2%;
   margin-left: 21.5%;
   margin-top: 3%;
   background: none; 
   border: none; }

   
.c3_btn2 {
   width: 148.5%;
   margin-left: -25%;
   margin-top: 1%; }
        
}


/* PC */
@media screen and (min-width: 769px) { 

.popup {
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  z-index: 1000;
}

.popup h2 {
   font-size: 13px; }

.popup p {
   margin-top: 2vw;
   font-size: 13px;
   line-height: 1.8em; }

.popup.show {
  opacity: 1;
  pointer-events: auto;
}

.popup-content {
  background: white;
  margin: 50px auto;
  padding: 20px;
  width: 80%;
  max-height: 80vh;         /* 画面の80%を上限に */
  overflow-y: auto;  
  max-width: none;
  border-radius: 10px;
  position: relative;
}

.close {
  position: absolute;
  top: 10px; right: 15px;
  font-size: 24px;
  cursor: pointer;
}

.openBtn {
   width: 58.2%;
   margin-left: 21.5%;
   margin-top: 3%;
   background: none; 
   border: none; }

   
.c3_btn2 {
   width: 148.5%;
   margin-left: -25%;
   margin-top: 1%; }
        
}