@charset "utf-8";
/* CSS Document */

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

   Alone contents（レギュラー）

--------------------------------------------------------------------------------------------- */
.alone-h1{/*日本語*/
    text-align: center;
    font-family: 'Zen Maru Gothic', sans-serif;
	font-size: clamp(30px, 3vw, 48px);
    line-height: 1.5;
    margin: 0 auto 15px auto;
    padding-bottom: 15px;
    border-bottom: 2px dotted #999;
    width: 95%;
    font-weight: 700;
    position: relative;
    z-index: 20;
}
.alone-h1 span{
	font-size: clamp(18px, 3vw, 36px);
    line-height: 1.5;
}

.alone-h2{
    text-align: center;
    line-height: 1.75;
	font-size: clamp(20px, 3vw, 30px);
    font-weight: normal;
    margin-bottom: 50px;
}
.alone-h2 span{
    text-align: center;
	font-size: clamp(20px, 3vw, 30px);
    font-weight: bold;
    color: #f60;
}
.alone-h2 span.eg-h2{
	font-size: clamp(14px, 3vw, 20px);
    font-family: 'Poppins', sans-serif;
    color: #666;
    font-weight: normal;
}

.alone-h3{
    line-height: 1.75;
    font-weight: normal;
    margin-bottom: 50px;
}

.alone-visual img{
    width: 100%;
    height: auto;
    margin-bottom: 50px;
}

.alone-service-bunner img{
    width: 100%;
    height: auto;
    margin-bottom: 2.5%;
}

.alone-copy{
    padding-left: 1.5em;
}
.alone-copy li{
    list-style: disc;
}
.alone-copy li span{
    font-weight: bold;
}


/* Table 店舗・施設等の詳細
-------------------------------------*/
.alone-detail{/*Table*/
    width: 100%;
    margin: 0 0 25px 0;
}

.alone-detail th,.alone-detail td{
    padding: 15px;
    border-bottom: 2px dotted #999;
    vertical-align: middle;
	font-size: clamp(16px, 3vw, 18px);
}

.alone-detail th{
    text-align: left;
    width: 25%;
    color: #333;
    line-height: 1;
}

.alone-detail td{
    line-height: 1.75;
}

.alone-detail td a.sns-icon{
	font-size: clamp(36px, 3vw, 48px);
    line-height: 1;
    margin-right: 25px;
}
.alone-detail td a:hover.sns-icon{
    opacity: 0.75;
}

@media screen and (max-width:700px) {

.alone-detail{
    margin: 0 0 15px 0;
}
    
.alone-detail th,.alone-detail td{
    display: block;
    width: 100%;
    padding: 12.5px 15px;
}
    
.alone-detail th{
    border-bottom: 0;
    background: #fff;
}
}

.transmission{
    font-weight: bold;
    color: #f60;
}


/* Google map01(k-map※口コミ)
-------------------------------------*/
.fa-map-marker-alt{/*アイコン*/
	font-size: clamp(20px, 3vw, 24px);
    text-indent: 0.25em;
    color: #ea4335;
    line-height: 1.25;
}

.k-map{
    padding: 7.5px 12.5px;
    background: #ea4335;
    color: #fff !important;
    border-radius: 5px;
    line-height: 1.5;
}
.k-map:hover{
    opacity: 0.75;
}
.k-map .fa-caret-right{
    color: #fff;
}


/* インスタグラムアイコン色
-------------------------------------*/
.fa-instagram-square{
    color: #CF2E92;
}


/* フェイスブックアイコン色
-------------------------------------*/
.fa-facebook{
    color: #1877F2;
}


/*メディアアイコン
-------------------------------------*/
.media{
	font-size: clamp(20px, 3vw, 24px);
    line-height: 1.25;
}


/*うどんマップテキストリンク
-------------------------------------*/
a.media-link{
    color: #f00;
    text-decoration: underline;
}
a:hover.media-link{
    opacity: 0.75;
}

    
/*人気メニューアイコン
-------------------------------------*/
.PopularMenu{
	font-size: clamp(20px, 3vw, 24px);
    line-height: 1.25;
}


/* パーキングリンク（ボタン）
-------------------------------------*/
.parking{
    display: inline-block;
    padding: 7.5px 12.5px;
    background: #ffd700;
    text-align: center;
    margin-top: 10px;
    border-radius: 5px;
    line-height: 1.25;
}
.parking:hover{
    opacity: 0.75;
}
.parking .fa-caret-right{
    color: #000;
}


/* 詳細はこちら（ボタン）
-------------------------------------*/
.detail-link{
    display: inline-block;
    padding: 7.5px 12.5px;
    background: #ffd700;
    text-align: center;
    border-radius: 5px;
    line-height: 1.5;
}
.detail-link:hover{
    opacity: 0.75;
}
.detail-link .fa-caret-right{
    color: #000;
}


/* インスタグラム埋め込み
-------------------------------------*/
.insta-wrap{
    width: 500px;
    margin: 50px auto 0 auto;
}
.instagram-media{
    width: 100%;
}

@media screen and (max-width:500px) {

.insta-wrap{
    width: 100%;
}    
}


/* Tiktok埋め込み
-------------------------------------*/
.tiktok-embed{
    margin-top: 50px !important;
}


/* Mp4埋め込み
-------------------------------------*/
.video-wrap{
  position: relative;
  width: 100%;          /* 親幅に合わせる */
  padding-bottom: 60%; /* 16:9なら 56.25%、4:3なら 75%、4:4なら 100% */
  height: 0;
  margin-top: 50px !important;
}
.video-wrap video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}


/* Google map02(Googleマップ)
-------------------------------------*/
.g-map{
    margin-top: 75px;
    width: 100%;
    height: 600px;
}

@media screen and (max-width:700px) {

.g-map{
    margin-top: 50px;
    height: 450px;
}
}


/* Table この近くで立ち寄れるスポット
-------------------------------------*/
.nearby-areas{
    margin: 75px 0 0 0;
    width: 100%;
}

.nearby-areas caption{
    margin-bottom: 25px;
	font-size: clamp(20px, 3vw, 30px);
    font-weight: bold;
}

.nearby-areas th,.nearby-areas td{
    padding: 15px;
    border-bottom: 2px dotted #999;
    vertical-align: middle;
	font-size: clamp(16px, 3vw, 18px);
}

.nearby-areas th{
    text-align: left;
    width: 50%;
}
.nearby-areas th a b{
    text-decoration: underline;
    color: #f60;
}
.nearby-areas th a:hover b{
    opacity: 0.75;
}
.nearby-areas th p{
    font-family: 'Poppins', sans-serif;
    color: #666;
    font-weight: normal;
	font-size: clamp(12px, 3vw, 16px);
    line-height: 1.5;
}

.nearby-areas td{
    line-height: 1.75;
}

@media screen and (max-width:700px) {

.nearby-areas{
    margin: 50px 0 0 0;
}
    
.nearby-areas th,.nearby-areas td{
    display: block;
    width: 100%;
    padding: 12.5px 15px;
}
    
.nearby-areas th{
    border-bottom: 0;
    background: #fff;
}
}



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

   Access contents（アクセスページ※単独指定ヵ所あり）

--------------------------------------------------------------------------------------------- */
.access-h2{
    line-height: 1.5;
	font-size: clamp(20px, 3vw, 30px);
    margin: 75px 0 25px 0;
}
.access-h2 span.eg-h2{
	font-size: clamp(18px, 3vw, 24px);
    font-family: 'Poppins', sans-serif;
    color: #666;
    font-weight: normal;
}

@media screen and (max-width:700px) {

.access-h2{
    margin: 50px 0 25px 0;
}
}

.access-detail th,.access-detail td{
    padding: 15px;
    border-bottom: 2px dotted #999;
    vertical-align: middle;
	font-size: clamp(16px, 3vw, 18px);
}

.access-detail th{
    text-align: left;
    width: 30%;
    color: #f60;
    line-height: 1.5;
}
.access-detail th span.eg-text{
	font-size: clamp(14px, 3vw, 16px);
    font-weight: normal;
    color: #f60;
    font-family: 'Poppins', sans-serif;
}

.access-detail td{
    line-height: 1.5;
}
.access-detail td span.eg-text{
	font-size: clamp(14px, 3vw, 16px);
    font-weight: normal;
    color: #666;
    font-family: 'Poppins', sans-serif;
}

.access-detail td a.sns-icon{
	font-size: clamp(36px, 3vw, 48px);
    line-height: 1;
}
.access-detail td a:hover.sns-icon{
    opacity: 0.75;
}

@media screen and (max-width:700px) {

.access-detail th,.access-detail td{
    display: block;
    width: 100%;
}
    
.access-detail th{
    border-bottom: 0;
    background: #fff;
}
}


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

   About-site contents（当サイトについてページ※単独指定ヵ所あり）

--------------------------------------------------------------------------------------------- */
.about-h2{
    line-height: 1.75;
	font-size: clamp(20px, 3vw, 30px);
    margin: 75px 0 25px 0;
    border-bottom: 2px dotted #999;
}

#about-site h3{
	font-size: clamp(18px, 3vw, 20px);
}

#about-site ol{
    padding-left: 1em;
}
#about-site ol li{
	font-size: clamp(14px, 3vw, 16px);
    line-height: 1.75;
}

#about-site ul{
    padding-left: 2.5em;
}
#about-site ul li{
	font-size: clamp(14px, 3vw, 16px);
    line-height: 1.75;
    list-style: disc;
}

#about-site .text-16{
    padding-left: 1em;
}

@media screen and (max-width:700px) {

.about-h2{
    margin: 50px 0 25px 0;
}
}


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

   Fade-zoom（画像の内側にズームイン）

--------------------------------------------------------------------------------------------- */
.img-box {
  overflow: hidden; /* ← はみ出し隠す（重要） */
}

.img-box img {
  width: 100%;
  height: auto;
  display: block;

  transform: scale(1.1);
  transition: transform 5s cubic-bezier(0.22, 1, 0.36, 1); 
}

.fade-zoom {
  opacity: 0;
  transition: opacity 1s ease;
}

.fade-zoom.show {
  opacity: 1;
}

.fade-zoom.show img {
  transform: scale(1); /* 中の画像だけ縮む */
}