@charset "utf-8";

/*====================================================================================================

  ブログ

====================================================================================================*/

.private-alert {
  padding-top:0;
}

@media print,screen and (min-width:641px) {
  .private-alert {
    padding-bottom:80px;
  }
}

@media screen and (max-width:640px) {
  .private-alert {
    padding-bottom:2.5em;
  }
}

@media print,screen and (min-width:641px) {
  .shop {
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-pack:justify;
    -ms-flex-pack:justify;
    justify-content:space-between;
    /*padding-top:96px;
    padding-bottom:144px;*/
  }
  
  .main {
    -webkit-box-flex:1;
    -ms-flex:1;
    flex:1;
    padding-right:-webkit-calc(60 / 1120 * 100%);
    padding-right:calc(60 / 1120 * 100%);
  }
}

@media print,screen and (min-width:641px) {
  .side {
    width:240px;
  }
}

/*@media print,screen and (min-width:1381px) {
  .side {
    width:240px;
  }
}

@media print,screen and (min-width:641px) and (max-width:1380px) {
  .side {
    width:calc(200 / 1380 * 100vw);
    min-width:220px;
  }
}*/

@media screen and (max-width:640px) {
  .shop {
    padding-top:3em;
    /*padding-bottom:3.5em;*/
  }
  
  .side {
    padding-top:3.5em;
  }
}

.side-hdline {
  border-top:5px solid #e89941;
  font-size:1.44em;
  font-weight:300;
  line-height:1;
  text-align: center;
}

.side-list {
  list-style:none;
}
.side-list li{
}

.side-list li:first-child{
  margin-top: 10px;
    
}

.side-list li a {
  display:block;
  padding-top:0.35em;
  padding-bottom:0.35em;
  padding-left: 1.6em;
  text-decoration: none;
  color: #565656;  
}


/*.side-list--members li a {
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-align:center;
  -ms-flex-align:center;
  align-items:center;
  padding-top:0.65em;
  padding-bottom:0.65em;
}

.side-list--members li .photo {
  overflow:hidden;
  display:inline-block;
  border-radius:100%;
  position:relative;
}

.side-list--members li .photo img {
  width:auto;
  min-width:inherit;
  max-width:inherit;
  height:100%;
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
}

.side-list--members li .photo .imgX {
  width:auto;
  height:100%;
  min-heigh:100%;
}

.side-list--members li .photo .imgY {
  width:100%;
  min-width:100%;
  height:auto;
}

.ua-pc .side-list--members li .photo img {
  -webkit-transition:opacity 0.3s ease;
  transition:opacity 0.3s ease;
}
  
.ua-pc .side-list--members li a:hover .photo img.grayscale {
  opacity:0;
}

.side-list--members li .name {
  padding-left:1em;
}

.side-list--members li .name-en {
  color:#999;
}

.side-list--members a,
.side-list--members a:visited,
.side-list--members a:hover {
  text-decoration:none;
}

.ua-pc .side-list--members li a:hover .name-jp {
  text-decoration:underline;
}*/
    
.side-list li a::before{
    content:"●";
    color:#FFC27E;
    font-size: 0.88em;
    margin-right: 0.5em;
}


@media print,screen and (min-width:641px) {
  /*.side-hdline:not(:first-of-type) {
    margin-top:64px;
  }*/
    
  .side-hdline:not(:first-of-type) {
    margin-top:64px;
  }

  
  .side-hdline {
    padding-top:16px;
    height: 65px;
  }
  
  .side-list {
    font-size:0.88em;
  }
  
  /*.side-list--members li .photo {
    width:64px;
    height:64px;
  }*/
}

@media screen and (max-width:640px) {
  .side-hdline:not(:first-of-type) {
    margin-top:2.5em;
  }
  
  .side-hdline {
    padding-top:1.5em;
    padding-bottom:1em;
  }
  
  .side-list--members li .photo {
    width:3.5em;
    height:3.5em;
  }
}


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

  一覧
  
----------------------------------------------------------------------------------------------------*/

.list-item {
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
  list-style:none;
}

.list-item a,
.list-item a:visited,
.list-item a:hover { color:inherit; text-decoration:none; }
.ua-pc .list-item a:hover .ttl { text-decoration:underline; }

.list-item li {
  width:33.333%;
  width: calc(100%/3);
}

.list-item li .photo {
  margin-bottom:1em;
}

.list-item li .date {
  color:#999;
  font-size:0.88em;
  display:inline-block;
  margin-top:0.25em;
  /*margin-right:1em;*/
}

.list-item li .cate {
  color:#999;
  font-size:0.88em;
  display:inline-block;
  margin-top:0.25em;
  margin-right:1em;
}

@media print,screen and (min-width:641px) {
  .list-item li:nth-child(n+4) {
    margin-top:80px;
  }
  
  .list-hdline {
    margin-bottom:64px;
  }
  
  .sec-list .writerBox {
    margin-bottom:80px;
  }
}

@media print,screen and (min-width:641px){

    
  .list-item {
    margin-left:-2.2%;
    margin-right:-2.2%;
  }
  
  .list-item li {
    padding:0 2.2%;
  }
  
  .list-item li .photo {
    /*height:-webkit-calc(190 / 1380 * 100vw);
    height:calc(190 / 1380 * 100vw);
    min-height:190px;*/
    height: 190px;
    border: 1px solid #E8E8E8;
  }
}

/*@media print,screen and (min-width:1381px) {
  .list-item {
    margin-left:-20px;
    margin-right:-20px;
  }
  
  .list-item li {
    padding:0 20px;
  }
  
  .list-item li .photo {
    height:340px;
  }
}

@media print,screen and (min-width:641px) and (max-width:1380px) {
  .list-item {
    margin-left:-2.2%;
    margin-right:-2.2%;
  }
  
  .list-item li {
    padding:0 2.2%;
  }
  
  .list-item li .photo {
    height:-webkit-calc(340 / 1380 * 100vw);
    height:calc(340 / 1380 * 100vw);
    min-height:250px;
  }
}*/



@media screen and (max-width:640px) {
  .list-item {
    margin-left:-2%;
    margin-right:-2%;
  }
    
    .list-item li {
  width:100%; 
}
  
  .list-item li {
    padding:0 2%;
  }
  
  /*.list-item li:nth-child(n+3) {
    margin-top:2.5em;
  }*/
    .list-item li:nth-child(n+2) {
    margin-top:60px;;
  }
    
  
  .list-item li .photo {
    /*height:-webkit-calc(250 / 640 * 100vw);
    height:calc(250 / 640 * 100vw);*/
    margin-right: auto;
      margin-left: auto;
    height:190px;
      width: 253px;
    border: 1px solid #E8E8E8;
  }
  
  .list-hdline {
    margin-bottom:2.5em;
  }
  
  .sec-list .writerBox {
    margin-bottom:3em;
  }
}

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

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




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

  詳細
  
----------------------------------------------------------------------------------------------------*/

/*--------------------------------------------------------------------------------
  タイトル
--------------------------------------------------------------------------------*/

.detail-hdline .ttl {
  /*padding-bottom:0.75em;*/
}

.detail-hdline ul {
  list-style:none;
  color:#999;
  font-size:0.88em;
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
}

.detail-hdline li {
  position:relative;
}

.detail-hdline li:not(:first-child) {
  padding-left:1em;
}

.detail-hdline li:not(:last-child) {
  margin-right:1em;
}

.detail-hdline li:not(:first-child):before {
  content:"";
  width:1px;
  height:0.8em;
  background-color:#e1e1e1;
  display:inline-block;
  position:absolute;
  left:0;
  top:50%;
  transform:translateY(-50%);
}

.detail-hdline li a,
.detail-hdline li a:visited { color:inherit; text-decoration:underline; }
.detail-hdline li a:hover { color:inherit; text-decoration:none; }

@media print,screen and (min-width:641px) {
  .detail-hdline {
    padding-bottom:1.5em;
  }
}

@media screen and (max-width:640px) {
  .detail-hdline {
    padding-bottom:1em;
  }
}


/*--------------------------------------------------------------------------------
  section
--------------------------------------------------------------------------------*/

.sec-detail .sec--set__hdline .ff-en {
  display:inline-block;
  margin-right:1.8rem;
}

.sec-detail .sec--set__hdline .ff-min {
  vertical-align:baseline;
}

@media print,screen and (min-width:641px) {
  .sec--set {
    padding-top:96px;
  }
  
  .sec-detail .sec--set__hdline {
    font-size:0.9em;
    padding-bottom:2em;
  }
}

@media screen and (max-width:640px) {
  .sec--set {
    padding-top:3.5em;
  }
  
  .sec-detail .sec--set__hdline {
    padding-bottom:1.5em;
  }
}


/*--------------------------------------------------------------------------------
  記入者 
--------------------------------------------------------------------------------*/

.writerBox {
  background-color:#f5f5f5;
}

.writerBox .writ-photo {
  overflow:hidden;
  border-radius:100%;
}

.writerBox .writ-photo img {
  min-width:100%;
  height:100%;
  object-fit:cover;
  font-family:"object-fit:cover;"
}

.writerBox .writ-name .kijiBtn {
  vertical-align:middle;
  margin-bottom:0.25em;
  margin-left:1.5em;
}

.writerBox .writ-name .name-en {
  color:#999;
  display:inline-block;
  margin-top:0.5em;
}

@media print,screen and (min-width:641px) {
  .writerBox {
    padding:2em;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
  }

  .writerBox .writ-photo {
    width:120px;
    height:120px;
  }
  
  .writerBox .writ-prof {
    padding-left:2em;
    -webkit-box-flex:1;
    -ms-flex:1;
    flex:1;
  }

  .writerBox .writ-come {
    padding-top:0.5em;
  }
}

@media screen and (max-width:640px) {
  .writerBox {
    padding:1.5em;
    position:relative;
  }

  .writerBox .writ-photo {
    width:-webkit-calc(120 / 640 * 100vw);
    width:calc(120 / 640 * 100vw);
    height:-webkit-calc(120 / 640 * 100vw);
    height:calc(120 / 640 * 100vw);
    position:absolute;
    left:1.5em;
    top:1.5em;
  }
  
  .writerBox .writ-name {
    height:-webkit-calc(120 / 640 * 100vw);
    height:calc(120 / 640 * 100vw);
    padding-left:-webkit-calc(120 / 640 * 100vw);
    padding-left:calc(120 / 640 * 100vw);
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
  }
  
  .writerBox .writ-name .inner {
    padding-left:1.5em;
  }

  .writerBox .writ-come {
    padding:1.25em 0.25em 0.25em 0.25em;
  }
}


/*--------------------------------------------------------------------------------
  Back 
--------------------------------------------------------------------------------*/

@media print,screen and (min-width:641px) {
  .back-link {
    text-align: center;
    padding-top:112px;
    padding-bottom:1em;
  }
}

@media screen and (max-width:640px) {
  .back-link {
    text-align: center;
    padding-top:3.5em;
    padding-bottom:1em;
  }
}


/*--------------------------------------------------------------------------------
  Map
--------------------------------------------------------------------------------*/

.d-map #map {
  width:100%;
  height:70vh;
  max-height:600px;
  min-height:400px;
}

@media print,screen and (min-width:641px) {
  .d-map {
    padding-top:80px;
  }
}

@media screen and (max-width:640px) {
  .d-map {
    padding-top:3em;
  }
}

/*--------------------------------------------------------------------------------
  Map
--------------------------------------------------------------------------------*/

.shopmap #map {
  width:100%;
  height:80vh;
  min-height:400px;
}

/*--------------------------------------------------------------------------------
 　一覧
--------------------------------------------------------------------------------*/

.list-ttl{
    display: block;
    margin-bottom: 10px;
    text-align: center;
    /*border: 2px solid #ededed;*/
    padding: 5px;
    position: relative;
}

.list-ttl::before,
.list-ttl::after{
    content: "";
    top:0;
    position: absolute;
    display: inline-block;
    height: 100%;
    width: 5px;
    border: 1px solid #E8E8E8;
}
.list-ttl::before{
    left: 0;
    border-right:0;
}

.list-ttl::after{
    right: 0;
    border-left:0;
}

.open-hrs,
.regular-hld,
.tel{
    font-weight:400;
}

.open-hrs::before,
.regular-hld::before,
.tel:before{
    display: inline-block;
    margin-right: 0.5em;
    width:90px;
    letter-spacing: 1px;
    padding:2px 10px;
    box-sizing: border-box;
    text-align: center;
    margin-bottom: 5px;
    font-weight:400;
    /*color:#fff;*/
    font-size: 0.77em;
    border:1px solid #f1f3e9;
    background: #fafcf1;
    /*border-bottom: 2px dashed #f1f3e9;*/
}
.open-hrs::before{
    content: "営業時間";
    color: #057074;
}
.regular-hld::before{
    content: "定 休 日";
    color: #cf6d63;
}

.tel:before{
    content: "T E L";
    color: #cf9a3a;
}

@media screen and (max-width:640px) {
.open-hrs::before,
.regular-hld::before,
.tel:before {
    /*display: block;*/
    /*border:1px solid;*/
    width:90px;
}
    
.open-hrs,
.regular-hld,
.tel{
    display: block;
    margin-bottom: 8px;
}
}
@media screen and (max-width:480px) {
.open-hrs::before,
.regular-hld::before,
.tel:before {

    width:80px;
}

}
/*
/*--------------------------------------------------------------------------------
 　詳細ビジュアル
--------------------------------------------------------------------------------*/
.detail-visual{
    display: grid;
    grid-template-columns: repeat(4,1fr);
    grid-column-gap: 20px;
}

.detail-visual > .p-glog:first-of-type {
    width: 100%;
    grid-column-start: 1; 
    grid-column-end: 5; 
}

.detail-visual > .p-glog:not(:first-of-type) .p-glog__img a img {
    max-height: 180px;
    width: 100%;
    object-fit: cover;
}

.detail-visual > .p-glog{
    padding-top: 20px;
}

@media screen and (max-width:640px) {
    .detail-visual > .p-glog:not(:first-of-type) .p-glog__img img {
    height: 120px;
    width: 100%;
    object-fit: cover;
}

}

@media screen and (max-width:480px) {
.detail-visual{
    grid-column-gap: 10px;
}
    .detail-visual > .p-glog:not(:first-of-type) .p-glog__img img {
    height: 80px;
    width: 100%;
    object-fit: cover;
}

}
/*--------------------------------------------------------------------------------
 　店舗詳細お知らせ
--------------------------------------------------------------------------------*/
.shop-info-wrap{
  margin-top: 60px; 
  background: #fafcf1;
  box-shadow: 0px 0px 0px 8px #fafcf1;
  border: dashed 2px #f1f3e9;
  padding: 0.2em 0.5em;
  padding: 20px 20px 30px;
}

.shop-info-ttl{
 padding-bottom: 10px;
 
}

.shop-info-ttl::before{
    content: "";
    display: inline-block;
    vertical-align: middle;
    width: 60px;
    height:60px;
    background: url("../image/shop-info-ttl.png") no-repeat center;
    background-size: contain;
}

.comment-ttl::before{
    content: "";
    display: inline-block;
    vertical-align: middle;
    width: 60px;
    height:60px;
    background: url("../image/shop-comment-ttl.png") no-repeat center;
    background-size: contain;
}

.bikou-ttl::before{
    content: "";
    display: inline-block;
    vertical-align: middle;
    width: 60px;
    height:60px;
    background: url("../image/shop-bikou-ttl.png") no-repeat center;
    background-size: contain;
}



/*--------------------------------------------------------------------------------
 　店舗情報
--------------------------------------------------------------------------------*/
.d-shopData {
    margin-top: 40px;
}

.d-shopData >.d-shopData-box > dl{
    display: flex;
    align-items: flex-start;
    width: 100%;
}
.d-shopData >.d-shopData-box{
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
}

.d-shopData >.d-shopData-box > dl dd:nth-of-type(odd){
    margin-right: 30px;
}

.d-shopData-ttl{
    margin-bottom:20px;
}

.d-shopData-ttl::before{
    content: "●";
    font-size: 0.5em;
    margin-right: 0.5em;
    margin-left: 0.1em;
    color:#e7963b;
    vertical-align: 2px;
}

.d-shopData >.d-shopData-box > dl > dt {
    width: 10%;
    min-width: 90px;
    background-color:#fafcf1;
    text-align: center;
    margin-bottom: 10px;
    font-weight: 300;
    padding: 5px 0;
    margin-right: 10px;
    font-size: 0.88em;
}

.d-shopData >.d-shopData-box > dl > dd {
    width: calc(100% - 100px);
    font-size: 1.1em;
}

.d-shopSite{
    margin-top: 30px
}


.youtube-wrap {
  margin-top: 80px;
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.youtube-wrap iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}

@media screen and (min-width:641px) {
.d-shopData >.d-shopData-box{
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
}

}

@media screen and (max-width:640px) {    
.d-shopData >.d-shopData-box{
    display: block;
}
    
.d-shopData >.d-shopData-box > dl{
    flex-wrap: wrap;
}

.d-shopData >.d-shopData-box > dd{
    width: clac(100% - 100px);
}
    
.d-shopData >.d-shopData-box > dl dd:nth-of-type(odd){
    margin-right: 0px;
}

}
