/*
Theme Name: RDSGN ORIGINAL									
*/
.sp{display:none;}
.grecaptcha-badge { visibility: hidden; }

/**********************************************
    PC版 CSS
**********************************************/

@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@200..900&display=swap');/*日本語明朝*/
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Righteous&display=swap');

.righteous {
  font-family: "Righteous", sans-serif;

  font-style: normal;
}


/**************************************************************
全体
**************************************************************/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    background: transparent;
    border: 0;
    outline: 0;
    font-size: 100%;
    scroll-behavior: smooth;
}
body {
    font: 500 16px/1.75 "Noto Sans JP", sans-serif;
    color: #000;
    text-align: left;
    letter-spacing: 0.05em;
    -webkit-font-feature-settings: "palt";
    font-feature-settings: "palt";
    font-size: 13px;
    margin: 0px;
    text-align: center;
    line-height: 180%;
}


/**************************************************************
リンク
**************************************************************/
a:link {
    color: #000;
    text-decoration: none;
	transition: 1.0s ;
}
a:visited {
    color: #000;
    text-decoration: none;
}
a:hover {
    color: #000;
    text-decoration: none;
}
a:active {
    color: #000;
    text-decoration: none;
}

.about-p{

}

.about-p h2{
	background-color:#000;
	padding:30px!important;
	font-size:20px!important;
	color:#fff!important;
	margin:0!important;
}

.about-mv{
	background-image: linear-gradient(rgba(0, 88, 171, 0.6), rgba(0, 88, 171, 0.6)), url(https://p-pata.com/pataweb/wp-content/themes/rdsgn/image/base/hbg.jpg);
	background-color: #0058ab;
	padding:15px 0;
	background-position: center;
	text-align:center;
}
.about-mv img{
	max-width:1000px;
	height:auto;
	display:block;
	margin:0 auto;
}

.about-p h3{
	font-size:22px;
	line-height:150%;
	padding:40px 0 20px 0;
	color:#3e7dd2;
}

.about-p p{
	width:1000px;
	margin:0 auto;
	font-size:13px;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
}

.about-p .link-botan{
	width:300px;
	margin:0 auto;
	margin-top:30px;
	margin-bottom:30px;
}

.about-p .link-botan a{
	background: #007cd8;
        color: #fff;
        background-image: url(https://p-pata.com/pataweb/wp-content/themes/rdsgn/image/base/hbg.jpg);
	padding:15px;
	display:block;
	border-radius:10px;

}

.about-p .link-botan a:hover{	transition: 1.0s ;
    opacity:0.7;}
.about-p .link-botan img{
	width:100%;
	height:auto;
	display:block;
}

.footer{
	margin-top:50px;
	padding:10px;
	background-color:#565656;
	color:#fff;
	font-size:11px;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
}
.footer p{
	margin-bottom:10px;
}

/*****************************************************
メインビジュアル
*************************************/

.mv{
  max-height:1000px;
  overflow:hidden;
  position:relative;
}

/* 暗いフィルター（背景だけ暗く・ロゴは暗くしない） */
.mv::before{
  content:"";
  position:absolute; inset:0;
  background: rgba(0,0,0,.35);        /* 濃さは .25〜.55 で調整 */
  z-index: 1;                         /* ロゴより下、背景より上 */
  pointer-events: none;               /* クリック阻害を防ぐ */
}
.mv .head{
	position:absolute;
	top:0;
	padding:15px;
	display:flex;
	width:100%;
	box-sizing:border-box;
	justify-content:space-between;
	 z-index: 3;
}
.mv .head .logo{
	width:300px;
}
.mv .head .logo img{
	width:100%;
	height:auto;
}
.mv .head .awaji-navi{
	font-family:"Noto Sans JP", sans-serif;

}
.mv .head .awaji-navi ul{
		display:flex;
	justify-content:flex-end;
}
.mv .head .awaji-navi ul li{
	margin:5px 15px;
}
.mv .head .awaji-navi ul li a{
	color:#fff;
	font-size:15px;
	display:block;
	font-weight:600;
}
.mv .m-logo{
  position:absolute;
  top:50%;
  left:50%;
  transform: translate(-50%, -50%); /* どんなサイズでも中央に */
	 z-index: 2;
}

/* 画像ロゴなら念のため */
.mv .m-logo img{ 
  display:block; 
  width:626px; 
  height:auto; 
}

/*************************************************
 * 
 *               サイトの説明
 * 
 * ***************************************/

.intro{
	background-color:#f3f1e6;
	padding:100px 0;
	background-image:url(https://tabi-1.net/wp-content/uploads/2025/10/namisen.png);
	position:right center;
	background-repeat:no-repeat;
	color:#6a5c40;
}
.intro-inner{
	width:1200px;
	margin:0 auto;
	display:flex;
}
.intro-inner .pic{
  position: relative;
  width:35%;
  isolation: isolate; /* 影がはみ出す時の重なり制御に便利 */
}
.intro-inner .pic img{
  width:100%;
  height:auto;
  border-radius:10px;
  position: relative;
  z-index: 1; /* 影より前に */
}

/* 画像の右下方向に斜めの面影を作る */
.intro-inner .pic::after{
  content:"";
  position: absolute;
  right:-12px;         /* 影を少し右へ */
  top: 16px;           /* 少し下げて“斜め”感 */
  width: 70%;
  height: 70%;
  background: rgba(0,0,0,.38);
  filter: blur(18px);
  transform: skewX(-10deg) rotate(2deg); /* 斜めに傾けて方向性を出す */
  border-radius: 14px;
  z-index: 0;
  pointer-events: none;
}
.intro-inner .text{
	width:65%;
	padding:0 0 0 50px;
	box-sizing:border-box;
}
.intro-inner .text h3{
	font-size:22px;
	margin-bottom:15px;
	letter-spacing:-0.5px;
	font-weight:700;
}
.intro-inner .text p{
	font-size:13px;
	text-align:left;
	letter-spacing:0.5px;
	line-height:190%;
}

/**********************************************************
 * 
 *                  穴場観光
 * 
 * ***********************************************/


.anaba-k{}

/* ===== Hero ===== */
.anaba-k .hero{
  --band-bg: #00b398;         /* 帯の色（お好みで） */
  --meta-bd: rgba(255,255,255,.5);
  --radius: 10px;
  --shadow: 0 10px 24px rgba(0,0,0,.18);
}

.anaba-k .hero-media{
  position: relative;
  margin: 0;
  line-height: 0;
  overflow: visible;   /* 画像外の帯も表示 */
}

/* 背景画像 */
.anaba-k .hero-media > img{
  width: 100%;
  height: clamp(260px, 42vw, 520px);  /* 画像の縦サイズ */
  object-fit: cover;
  display: block;
}

/* タイトル帯 */
.anaba-k .hero-caption{
  position: absolute;
  left: 8%;
  right: 8%;
  bottom: clamp(-18px, -3vw, -24px);  /* 画像から少しはみ出す */
  background: var(--band-bg);
  color: #fff;
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: clamp(14px, 2.2vw, 22px) clamp(16px, 3vw, 28px);
}

/* タイトル */
.anaba-k .hero-caption h1{
	font-weight:800;
	font-size:24px;
  margin: 0 0 .6em;
}

/* メタ情報のバッジ */
.anaba-k .hero-meta{
  display: flex;
  gap: .10rem;
  flex-wrap: wrap;
	justify-content:center;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
	font-size:12px;

}

.anaba-k .hero-meta .meta{
  display: inline-block;
  border: 1px solid var(--meta-bd);
  padding: .35em .8em;
  border-radius: 6px;
font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
	line-height:180%;
  background: rgba(255,255,255,.08);
}

.anaba-k-flex{
	display:flex;
	flex-wrap:wrap;
	padding:60px 20px;
}

.anaba-k-flex .box{
	width:30%;
	margin:1.5%;
}
.anaba-k-flex .box img{
	width:100%;
	height:auto;
	margin-bottom:20px;
	border-radius:10px;
}
.anaba-k-flex .box h3{
	font-size:18px;
	margin-bottom:15px;
}
.anaba-k-flex .box p{
	font-size:13px;
	text-align:left;
}
.anaba-k-flex .botan a{
	display:block;
	padding:10px;
	border-radius:5px;
	background-color:#00b398;
	color:#fff;
	font-size:12px;
	text-align:center;
	width:60%;
	margin:0 auto;
	margin-top:25px;
}
.anaba-k-flex .box h4{
	background-color:#fd7878;
	padding:10px;
	border-radius:5px;
	color:#fff;
	font-size:12px;
	line-height:100%;
	margin-bottom:15px;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
	font-weight:normal;
}

/******************************************
 * 
 *           宿
 * 
 * ****************************************************/

.yado{
	padding:0 0 60px 0;
}

.yado h2{
	font-size:60px;
	  font-family: "Righteous", sans-serif;
  font-style: normal;
	margin-bottom:30px;
	color:#6cb8de;
	padding:50px 0;
}

/* ===== 固定モザイク ===== */
.mosaic-fixed{
  --gap: 10px;
  --radius: 8px;
  display: grid;
  grid-template-columns: repeat(12, 1fr);   /* 12カラムベース */
  grid-auto-rows: minmax(80px, 7.2vw);      /* 行の基本高さ（レスポンシブ） */
  gap: var(--gap);
}

/* 各セルの共通スタイル（背景はカバーで） */
.mosaic-fixed .cell{
  position: relative;
  border-radius: var(--radius);
  overflow: hidden;
  background: #ddd center/cover no-repeat;
  background-image: var(--bg);
  transition: transform .25s ease, box-shadow .25s ease;
  box-shadow: 0 6px 16px rgba(0,0,0,.08);
  display: block;
}
.mosaic-fixed .cell:hover{
  transform: translateY(-2px);
  box-shadow: 0 10px 24px rgba(0,0,0,.16);
}

.mosaic-fixed .cell p{
	padding:20px;
	color:#fff;
	font-size:14px;
  text-shadow:
    2px 2px 4px rgba(0,0,0,0.9),
    -2px -2px 4px rgba(0,0,0,0.9),
    2px -2px 4px rgba(0,0,0,0.9),
    -2px 2px 4px rgba(0,0,0,0.9);
}

/* ====== 配置（参考画像の比率に近い並び） ====== */
/* 1段目 */
.i1  { grid-column: 1 / span 3;  grid-row: 1 / span 2; }  /* 左上スクエア */
.i2  { grid-column: 4 / span 3;  grid-row: 1 / span 3; }  /* 水色 横長 */
.i3  { grid-column: 7 / span 2;  grid-row: 1 / span 4; }  /* ダーク縦長 */
.i4  { grid-column: 9 / span 4;  grid-row: 1 / span 3; }  /* 右上赤 横長 */

/* 2段目（右上の小さなピンク） */
.i5  { grid-column: 9 / span 1;  grid-row: 4 / span 1; }  /* 小サイズ */
.i6  { grid-column: 10 / span 3; grid-row: 4 / span 2; }  /* 右上水色 縦長 */

/* 3段目中央のクリーム色相当（やや大きめ） */
.i7  { grid-column: 1 / span 3;  grid-row: 3 / span 3; }  /* 左ダーク */
.i8  { grid-column: 4 / span 2;  grid-row: 4 / span 4; }  /* ピーチ縦長 */
.i9  { grid-column: 6 / span 4;  grid-row: 5 / span 2; }  /* クリーム中央 */
.i10 { grid-column: 10 / span 3; grid-row: 6 / span 2; }  /* 右水色 横長 */

/* 4段目 下段のブロック群 */
.i11 { grid-column: 1 / span 3;  grid-row: 6 / span 2; }  /* 黄土（左下付近） */
.i12 { grid-column: 1 / span 2;  grid-row: 8 / span 1; }  /* 左下小さめ */
.i13 { grid-column: 3 / span 6;  grid-row: 8 / span 2; }  /* 中央横長（黄土） */
.i14 { grid-column: 9 / span 2;  grid-row: 8 / span 2; }  /* 濃紺 縦長 */
.i15 { grid-column: 11 / span 2; grid-row: 8 / span 2; }  /* 右赤 縦長 */
.i16 { grid-column: 7 / span 2;  grid-row: 6 / span 2; }  /* 右中ダーク縦長 */


/* ===== Layout ===== */

.dogs h2{
	padding:40px 0;
	font-size:40px;
}
.food h2{
	padding:40px 0;
	font-size:60px;
}
.fmtokyo{
  --gap: 18px;
  --radius: 14px;
  --brand: #5db8b2;      /* バッジ色ベース */
  --ink: #1f2b36;
  --muted: #6b7b87;
  display: grid;
  grid-template-columns: 360px 1fr; /* 左カラム幅 */
  gap: var(--gap);
  align-items: start;
}

/* 左：ヒーロー */
.fmt-hero{
  position: sticky;      /* スクロールしても見える演出（不要なら static） */
  top: 24px;
  align-self: start;
  border-radius: var(--radius);
  overflow: hidden;
}
.fmt-hero img{
  width: 100%; height: auto; display: block;
}
.fmt-hero .hero-copy{
  position: absolute; inset: 0;
  display: grid; align-content: end;
  padding: 24px;
  color: #fff;
  text-shadow: 0 2px 8px rgba(0,0,0,.35);
	font-size:12px;
}
.fmt-hero .hero-copy h2{
  font: 700 32px/1.2 "Noto Serif JP","Noto Sans JP",serif;
  margin: 8px 0 0;
	color:#fff!important;
	padding:20px 0 40px 0!important;
}

/* 右：カード Masonry（CSS Columns で手軽に） */
.fmt-cards{
  column-count: 3;
  column-gap: var(--gap);
}
@media (max-width: 1100px){ .fmt-cards{ column-count: 2; } }
@media (max-width: 640px){
  .fmtokyo{ grid-template-columns: 1fr; }
  .fmt-cards{ column-count: 1; }
  .fmt-hero{ position: static; }
}

/* ===== Card base ===== */
.card{
  break-inside: avoid;                 /* 列の途中で分割しない */
  display: block;
  border-radius: var(--radius);
  overflow: hidden;
  margin-bottom: var(--gap);
  box-shadow: 0 10px 24px rgba(0,0,0,.12);
  position: relative;
  color: #fff;
  text-decoration: none;
  transition: transform .25s ease, box-shadow .25s ease, opacity .15s;
}
.card:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 36px rgba(0,0,0,.18);
}

/* 写真カード */
.card.photo{
  aspect-ratio: 4/3;                   /* ベース比率 */
  background: #ddd center/cover no-repeat;
  background-image: var(--img);
}
.card.photo.tall{ aspect-ratio: 3/4; } /* 縦長 variation */
.card.photo::after{                     /* 読みやすいよう薄く暗く */
  content:""; position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,.05) 0%, rgba(0,0,0,.45) 100%);
}
.card.photo h3{
  position: absolute; left: 14px; right: 14px; bottom: 12px;
  margin: 0; z-index: 1;
  font: 700 16px/1.5 "Noto Sans JP",sans-serif;
  letter-spacing: .02em;
  text-shadow: 0 2px 8px rgba(0,0,0,.35);
	color:#fff!important;
}

/* バッジ（数字） */
.card .badge{
  position: absolute; top: 12px; left: 12px; z-index: 2;
  background: var(--brand);
  color: #fff;
  font: 700 14px/1;
	  font-family: "Righteous", sans-serif;
  padding: 10px 10px 8px;
  border-radius: 10px;
  box-shadow: inset 0 0 0 2px rgba(255,255,255,.55);
}

/* 右上の “Challenge!” ラベル */
.card .label{
  position: absolute; top: 10px; right: 10px; z-index: 2;
  font: 700 12px/1 ;
	  font-family: "Righteous", sans-serif;
  color: rgba(255,255,255,.95);
  padding: 6px 8px;
  border-radius: 999px;
  background: rgba(0,0,0,.25);
  backdrop-filter: blur(2px);
}

/* 動画アイコン（必要なカードに .has-video） */
.card.has-video::before{
  content:""; position:absolute; right: 12px; bottom: 12px; z-index: 2;
  width: 42px; height: 42px; border-radius: 50%;
  background: rgba(255,255,255,.85);
  mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48"><path fill="black" d="M19 14v20l16-10z"/></svg>') center/56% no-repeat;
}

/* MORE カード */
.card.more{
  background: #e8f4f2;
  color: var(--ink);
  display: grid; place-items: center;
  padding: 26px 18px;
  aspect-ratio: 4/3;
}
.card.more.soft{ background: #d5ecf3; }
.card.more .more-body{
  text-align: center; display: grid; gap: 14px; justify-items: center;
}
.card.more img{ width: 120px; height: auto; opacity: .85; }
.card.more .more-title{
  font: 700 16px/1.3 "Noto Sans JP",sans-serif; color: var(--ink);
}
.card.more button{
  font: 700 13px/1 "Noto Sans JP",sans-serif;
  padding: 10px 18px; border-radius: 10px; border: 2px solid rgba(0,0,0,.15);
  background: #fff; color: var(--muted);
}

.pink{
	color:#ec7b7b!important;
}
.green{
	color:#fff!important;
	padding-bottom:15px!important;
}

/**************************************
 * 
 * FOOD
 * 
 * *************************************/

.food{
	background-color:#3cca86;
	margin-top:150px;
	color:#fff;
}

.f-come{
	display:flex;
	justify-content:center;
	align-items:center;
}
.f-come img{
	height:150px;
	width:auto;
}
.f-come p{
	font-size:13px;
}

.insta-flex{
	display:flex;
	flex-wrap:wrap;
	padding:25px;
}
.insta-flex .int{
	width:29%;
	margin:2%;
	padding:15px;
	border-radius:10px;
	background-color:#fff;
	color:#6f5e48;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;

}
.insta-flex .int h3{
	margin-bottom:20px;
	margin-top:20px;
}
.insta-flex .int p{
	font-size:13px;	margin-bottom:20px;
}