@charset "UTF-8";

.shop-info-area{
  max-width: 900px;
  margin-left:auto;
  margin-right: auto;
}

/* @media screen and (max-width:900px){ */
.shop-ttl{
  background:none;
  background-color: rgba(254,246,219,1);
  margin:0;
  height: 150px;
  display: table;
  width: 100%;

}

.shop-txt{
  font-size:24px;
  text-align: center;
  display: table-cell;
  vertical-align: middle;
  font-weight: bold;


}


.shop-ttl img{
  display: inline-block;
  width: 100px;
  height: 100px;
  vertical-align: middle;
  margin-right: 1rem;

}

.item-area{
  margin-top: 40px;

}

.main-item-area{
  margin-top: 1rem;
  display: table;
}

.main-item-ttl{
  white-space: nowrap;
  display: table-cell;

}

.main-item-br{
display: table-cell;

}
.shop-info-img{
  margin-top: 2rem;

}

.shop-info{
  height: 100px;
  display: table;
  width: 100%;
  border-bottom: 1px solid #E13429;
}

.shop-info-ttl{
  display: table-cell;
  vertical-align: middle;
  width: 100%;
  text-align: center;
  vertical-align: middle;
  font-size: 24px;
  font-weight: bold;
}

.shop-tbl{
  background-color: #f1f0e6;
}

.shikaku{
  display: inline-block;
  border:1px solid #E13429;
  background-color: #E13429;
  width: 1rem;
  height: 1rem;
  margin-right: 1rem;
}

.pr-area{

  margin:auto;

}

/* 吹き出し本体 - 左右の中心 */
.pr-area{
  position: relative;
  padding: 20px;
  background-color: #fff;
  border:2px solid black;
  border-radius: 10px;
  margin-top: 50px;

}
/* 三角アイコン - 左右の中心 */
.pr-area::before{
  content: '';
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  left: 0;
  right: 0;
  bottom: -15px;
  margin: 0 auto;
  border-top: 15px solid #000;
  border-right: 15px solid transparent;
  border-left: 15px solid transparent;
}

.pr-area::after{
  content: '';
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  left: 0;
  right: 0;
  bottom: -12px;
  margin: 0 auto;
  border-top: 15px solid #fff;
  border-right: 15px solid transparent;
  border-left: 15px solid transparent;
}

.pr-ttl{
  font-size: 26px;
  text-align: center;
  font-weight: bold;
}

.pr-txt{
  line-height: 2rem;
  margin-top: 30px;
}

.select-item-area{
  width: 100%;
  border-top: 1px dotted black;
  border-bottom: 1px dotted black;
  margin:50px auto 0;
  text-align: center;
  line-height: 3rem;
}

.select-item-area img{
  height: 150px;
  margin:50px auto 0 ;
}

.select-product-name{
  font-size: 24px;
  font-weight: bold;
}

.select-capacity,
.select-price{
  display:inline-block;

}
.select-capacity{
  width: 100%;
  margin:0;
  padding-top: 1px;
  font-size: 20px;
  line-height: 1.75;
  text-align: center;
}

.select-capacity .select-ttl-txt{
  display: inline-block;
  padding-right: 1rem;
  margin:0;
  text-align: center;
  font-size: 20px;
}

.select-capacity .select-price-txt{
  display: inline-block;
  font-size: 24px;
  font-weight: bold;
  margin: 0;
}

.select-capacity .select-tax-txt{
  display: inline-block;
  margin: 0;
  font-size: 20px;
}

.select-price{
  width: 49%;
  text-align: left;

  font-size: 24px;
  font-weight: bold;
  margin:0;
  vertical-align: top;
}

.select-price span,
.select-price-only span{
  font-weight: normal;
  font-size: 20px;
}

.select-price-only{
  width:100%;
  text-align: center;
  font-size: 24px;
  font-weight: bold;
  margin:0 auto;
}

.select-label{
  font-size: 20px;
  font-weight: bold;
  color: #aa7a3b;

}

.shop-info-img img{
  width: 100%;
  height: auto;
}

.shop-tbl {
  margin-top: 50px;
  padding:50px 0;
  line-height: 3rem;

}

.shop-tbl table{
   table-layout:auto;
   margin-left: auto;
   margin-right: auto;

}



.shop-tbl td{
  vertical-align: top;
  padding-bottom: .5rem;
  word-break: break-word;
}


.gl-tble-first{
  width: 6rem;
  padding:0;
    -moz-text-align-last: justify;
    text-align-last: justify;
    text-justify:inter-ideograph;
    border:none;
}

.dl-tbl-first{
  display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.shipping-area{
  background-color: #996600;
  border-radius: 5px;
  color: white;
  text-align: center;
  padding:1px 2px;
  white-space: nowrap;
}

.shipping-txt img{

  height: 1rem;
  vertical-align: -2px;
  margin: 0 5px;
}

.card-area{
  background-color: #E23619;
  border-radius: 5px;
  color: white;
  text-align: center;
  padding:1px 2px;
}

.card-txt img{

  height: 1rem;
  vertical-align: -2px;
  margin: 0 5px;
}

td.shop-tbl-ttl{
  font-size: 20px;
  font-weight: bold;
  padding-bottom: 1rem;
}

.dl-tbl-second{
  padding-left: 1rem;
  max-width: 300px;
}



/* @media screen and (max-width:455px){ */
  .shop-ttl{
    display: block;
    position: relative;
    height: 100px;
    text-align: left;
  }
  .shop-txt{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    white-space: nowrap;
    -webkit-transform: scale(0.8);
	-moz-transform: scale(0.8);
	-ms-transform: scale(0.8);
	-o-transform: scale(0.8);
	transform: scale(0.8);
  }


/* @media screen and (max-width:432px){ */
  .shop-txt{
    display: block;
    left: -50px;
    -webkit-transform: scale(0.6);
  -moz-transform: scale(0.6);
  -ms-transform: scale(0.6);
  -o-transform: scale(0.6);
  transform: scale(0.6);
  }



/* shop list
**********************/
.shop {
  max-width: 500px;
  width: 100%;
  margin: 0 auto 100px;
  color: #333;
}
@media screen and (min-width:541px) and (max-width:900px){
  .shop {
    padding: 0;
  }
}
@media screen and (min-width:500px) and (max-width:540px){
  .shop {
    padding: 0 15px;
  }
}

.item-menu ul{
  display: flex;
  justify-content: center;
  width: 100%;
  margin: 0;
  padding: 0;
}
@media screen and (max-width:499px){
.item-menu ul {
   flex-wrap: wrap;
 }
}
.item-menu ul li{
  display: flex;
  list-style-type: none;
  align-items: center;
  font-size: 15px;
}
.item-menu ul li:not(:last-of-type){
  margin-right: 5px;
}
.item-menu ul li::before{
  content: '';
  display: inline-block;
  width: 25px;
  height: 18px;
  margin-right: 4px;
}
.item-menu ul li.item-menu-marine::before{
  background: #80CFE8;
}
.item-menu ul li.item-menu-farm::before{
  background: #B7DC9C;
}
.item-menu ul li.item-menu-restaurant::before{
  background: #F5B6CA;
}
.item-menu ul li.item-menu-souvenir::before{
  background: #D9C0A3;
}
.item-menu ul li.item-menu-other::before{
  background: #FCDA80;
}

.shop-list {
  width: 100%;
  font-size: 18px;
}
.shop-list:first-of-type {
  padding: 12px 0;
}
.shop-list:not(:first-of-type) {
  padding: 32px 0 0;
}

.shop-list-address {
  font-size: 24px;
  margin-bottom: 14px;
  white-space: nowrap;
}

.shop-list-address_main {
  font-size: 18px;
  margin-right: 16px;
}
.shop-list-address_sub,
.shop-list-address_sub_long{
  font-size: 16px;
  color: #999;
  margin-left: 16px;
}

.shop-list-address_sub{
  margin-left: 16px;
}

@media screen and (min-width:500px) and (max-width:540px){
  .shop-list-address_sub_long{
    display: block;
    margin: 5px 0 0 0;
  }
}

@media screen and (max-width:499px){
 .shop-list-address_sub,
 .shop-list-address_sub_long{
  display: block;
  margin: 5px 0 0 0;
 }
}

.shop-list ul{
  margin: 0;
  padding: 0;
  list-style-type: none;
}

.shop-list_area {
  display: table;
  max-width: 500px;
  width: 100%;
  margin: 0 auto;
  font-size: 18px;
}
.shop-list_ttl {
  display: table-cell;
  width: 77%;
}
@media screen and (max-width:499px){
 .shop-list_ttl {
   width: 55%;
 }
}
.shop-list_ttl a{
  color: #333;
}

.shop-list_item {
  position: relative;
  display: table-cell;
  text-align: center;
  vertical-align: middle;
}
.shop-list_item:before {
  content: '';
  width: 1px;
  height: 26px;
  border-right: 2px dotted #CCC;
  position: absolute;
  left: 0;
}

.shop-list_midashi {
  color: #E1342A;
  border-top: 1px solid #E1342A;
  border-bottom: 1px solid #E1342A;
}

.shop-list_midashi .shop-list_ttl{
  padding: 10px 0;
  letter-spacing: 18px;
}
.shop-list_midashi .shop-list_item:before {
  border-right: 2px dotted #E1342A;
}
.shop-list_koumoku {
  border-bottom: 1px solid #CCC;
}
.shop-list_koumoku .shop-list_ttl{
  padding: 5px 0;
}
@media screen and (max-width:499px){
 .shop-list_koumoku .shop-list_ttl {
   padding: 10px 10px 10px 0;
 }
}
.shop-list_koumoku .shop-list_item:before {
  border-right: 2px dotted #CCC;
}
.shop-list_koumoku .shop-list_item span{
  padding: 3px 15px;
}
.shop-list_koumoku .shop-list_item .item_marine {
  background: #80CFE8;
}
.shop-list_koumoku .shop-list_item .item_farm {
  background: #B7DC9C;
}
.shop-list_koumoku .shop-list_item .item_restaurant {
  background: #F5B6CA;
}
.shop-list_koumoku .shop-list_item .item_souvenir {
  background: #D9C0A3;
}
.shop-list_koumoku .shop-list_item .item_other {
  background: #FCDA80;
}


/*------------玉手箱対応スタイル--------------*/

.box-area{
  max-width: 500px;
  margin:1rem auto;
}

.box-tug div{
  display: inline-block;
  width: 80px;
  height: 25px;
  text-align: center;
  margin:5px auto;
}



.box-tug div:first-child{
	margin-left:0;
}
.box-tug div:last-child{
	margin-right:0;
}

.box-tug{
  white-space: nowrap;
}

.box-r,
.box-b,
.box-p{
  color: white;
  font-size: 16px;
  font-weight: bold;
}

.box-y,
.box-g,
.box-w{
  color: black;
  font-size: 16px;
  font-weight: bold;
}

.box-r{
  background-color: #db435c;
}

.box-b{
  background-color: #4b8cca;
}

.box-y{
  background-color: #f7b52c;
}

.box-g{
  background-color: #b6d350;
}

.box-w{
  background-color: white;
  border:1px solid #666;
}

.box-p{
  background-color: #86519c;
}

.box-img-txt{
  text-align: center;
  margin:1rem auto;

}

.box-img-txt p{
  max-width: 500px;
  margin:1rem auto;
  text-align: left
}

.box-area img{
  width: 100%;
}

.box-img-txt img{
  max-width: 500px;
}

hr.box-hr{
  border:1px dotted black;
}

.box-flex{
  display: flex;
  flex-wrap: wrap;

}


.arc-box{
  width: 50%;
  margin:1rem 0;
  padding:1rem;
}

.arc-box p {
  width: 100%;
}

.arc-box a{
  color: black;
}

@media screen and (max-width:900px){
  .box-flex{
    display: block;

  }
  .arc-box{
    width: 100%;

  }

  .box-tug{
    white-space: normal;
  }
}