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

@import url('https://fonts.googleapis.com/css2?family=Kaisei+Tokumin&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Zen+Kurenaido&display=swap');





/* ================= base ================= */
* {
  box-sizing: border-box;
}

html {
  font-size: 62.5%;
  background: #fff;
}

body {
  margin: 0;
  font-family: "Zen Kurenaido", sans-serif;
  font-size: 1.6rem;
  line-height: 1.9;
  color: #111;
  background: #fff;
}

h1,h2,h3,h4 {
    font-family: "Kaisei Tokumin", serif;
    font-weight: lighter;
}

p {
	 font-family: "Zen Kurenaido", sans-serif;

}



.img_rp {
	width: 100%;
	height: auto;
	vertical-align: bottom;
}

.loader-bg {
    align-items: center;
    background-color: #FFF4DF;
    display: flex;
    height: 100vh;
    justify-content: center;
    left: 0;
    position: fixed;
    top: 0;
    width: 100vw;
    z-index: 9999;
}

.loader {
    color: #FFA662;
    font-size: 90px;
    text-indent: -9999em;
    overflow: hidden;
    width: 1em;
    height: 1em;
    border-radius: 50%;
    margin: 72px auto;
    position: relative;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-animation: load6 1.7s infinite ease, round 1.7s infinite ease;
    animation: load6 1.7s infinite ease, round 1.7s infinite ease;
}
@-webkit-keyframes load6 {
  0% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
  5%,
  95% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
  10%,
  59% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.087em -0.825em 0 -0.42em, -0.173em -0.812em 0 -0.44em, -0.256em -0.789em 0 -0.46em, -0.297em -0.775em 0 -0.477em;
  }
  20% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.338em -0.758em 0 -0.42em, -0.555em -0.617em 0 -0.44em, -0.671em -0.488em 0 -0.46em, -0.749em -0.34em 0 -0.477em;
  }
  38% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.377em -0.74em 0 -0.42em, -0.645em -0.522em 0 -0.44em, -0.775em -0.297em 0 -0.46em, -0.82em -0.09em 0 -0.477em;
  }
  100% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
}
@keyframes load6 {
  0% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
  5%,
  95% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
  10%,
  59% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.087em -0.825em 0 -0.42em, -0.173em -0.812em 0 -0.44em, -0.256em -0.789em 0 -0.46em, -0.297em -0.775em 0 -0.477em;
  }
  20% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.338em -0.758em 0 -0.42em, -0.555em -0.617em 0 -0.44em, -0.671em -0.488em 0 -0.46em, -0.749em -0.34em 0 -0.477em;
  }
  38% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.377em -0.74em 0 -0.42em, -0.645em -0.522em 0 -0.44em, -0.775em -0.297em 0 -0.46em, -0.82em -0.09em 0 -0.477em;
  }
  100% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
}
@-webkit-keyframes round {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes round {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}



/* ================= scroll space（重要） ================= */
.scroll-space {
  min-height: 120vh; /* overlap用の余白 */
}

/* ================= sticky overlap ================= */
.overlap {
    display: flex;
    flex-flow: column;
    align-items: center;
    justify-content: center;
    padding-top: 2rem;
    padding-right: 2rem;
    padding-left: 2rem;
    padding-bottom: 3rem;
	min-height: 100svh;
}

/* ================= hero ================= */
.hero {
  background: linear-gradient(180deg, #f0f0f0 0%, #dcdcdc 100%);
  height: 100vh;
      background-image: url(../img/hero.png);
    background-repeat: no-repeat;
    background-size: cover;
    padding-bottom: 3rem;
    background-position: center center;
}



.hero-inner {
 display: flex;
	flex-flow: column nowrap;
	align-items: center;
  justify-content: center;
  max-width: 960px;
  height: 100svh;
  text-align: center;
}

.hero_logo {
	width: 50%;
	margin-bottom: 40%;
}


.hero h1 {
    font-size: clamp(3.8rem, 4vw, 8.4rem);
    letter-spacing: .08em;
    margin-bottom: 2rem;
    color: rgba(45,45,45,1.00);
}

.hero p {
    font-size: clamp(1.6rem, 1.8vw, 2.2rem);
    opacity: .85;
    color: rgba(255,255,255,1.00);
}

/* ================= section ================= */
.section {
    background-color: #fff;

}

.heading-12 {
	-ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
}



.section h2 {
  font-size: clamp(2rem, 3vw, 3.6rem);
  letter-spacing: .06em;
  
  margin-bottom: 3rem;
}

.section p {
    max-width: 880px;
    margin: 0 auto 1.6rem;
    
    color: rgba(35,35,35,1.00);
}

/* ================= message sections ================= */
.section_01,
.section_02 {
  background: linear-gradient(
    175deg, #f5f5f5 50%, #fffafa 50%);
}




.section_01 p {
    clear: both;
    line-height: 1.8em;
    text-align: left;
    font-size: clamp(1.6rem, 2vw, 2.2rem);
    color: rgba(35,35,35,1.00);
    font-weight: normal;
}

.heading-31 {
    position: relative;
    padding: .3em 0 .2em 1em;
    border-bottom: 3px solid #f9e5b9;
    color: #333333;
	font-size: 28px;
}

.heading-31::before {
    position: absolute;
    top: 0;
    left: .3em;
    transform: rotate(55deg);
    height: 11px;
    width: 12px;
    background: #f9e5b9;
    content: '';
}

.heading-31::after {
    position: absolute;
    transform: rotate(15deg);
    top: .6em;
    left: 0;
    height: 8px;
    width: 8px;
    background: #f9e5b9;
    content: '';
}

.text_right {
	text-align: right;
	font-size: 12px;
}

 .section_01-inner {
	display: flex;
	 align-items: center;
	 justify-content: center;
    
  }
.section_01-inner_img {
	width: 30%;
	padding: 10px;
}

.section_01-inner_img2 {
	width: 50%;
	padding: 5px;
}


.section_01-inner_text {
 padding: 30px;
 width: 50%;
 overflow-x: auto;
}

 .section_02-inner {
	display: flex;
	 align-items: center;
	 justify-content: space-around;
    
  }
.section_02-inner_img {
	width: 60%;
	padding: 20px;
}
.section_02-inner_text {
 padding: 30px;
 width: 20%;
 overflow-x: auto;
}


.photo-container12 {
  position: relative;
  display: block;
  width: 80%;
  margin-inline: auto;
  margin-top: 60px;
  margin-bottom: 80px;
  z-index: 2;
}

.img12 {
  width: 100%;
  rotate: 3deg;
  z-index: 2;
	
}

.photo-container12::after {
    content: "";
    position: absolute;
    top: 20px;
    display: block;
    width: 100%;
    height: 100%;
    background-color: #F9D8AE;
    rotate: -5deg;
    z-index: -1;
}

.box-015 {
    position: relative;
    max-width: 80%;
    margin: 1em auto;
    padding: 1em 2.5em 1em 1.5em;
    border-radius: 3px;
    box-shadow: 0 2px 3px rgb(0 0 0 / 20%);
    background-color: rgba(253,233,204,1.00);
    color: #333333;
}

.box-015::before,
.box-015::after {
    position: absolute;
    content: '';
}

.box-015::before {
    top: -15px;
    right: 10px;
    height: 50px;
    width: 15px;
    border: 3px solid #999;
    border-radius: 10px;
    box-shadow: 1px 1px 2px rgb(0 0 0 / 30%);
    transform: rotate(10deg);
}

.box-015::after {
    top: 0;
    width: 10px;
    right: 20px;
    border: solid 5px rgba(253,233,204,1.00);
}

.heading-18 {
    padding: .5em .7em;
    border: 2px solid #d03025;
    box-shadow: 5px 5px #d03025;
    color: #d03025;
	font-size: clamp(2rem, 2vw, 2.4rem);
	text-align: center;
}

.heading-21 {
    position: relative;
    padding: .5em .7em .4em;
    border-bottom: 1px solid #ff5e4d;
    color: #333333;
	font-size: clamp(2rem, 2vw, 2.4rem);
}

.heading-21::before,
.heading-21::after {
    position: absolute;
    left: 30px;
    bottom: -12px;
    width: 30px;
    height: 12px;
    clip-path: polygon(0 0, 100% 0, 50% 100%);
    content: '';
}

.heading-21::before {
    background-color: #ff5e4d;
}

.heading-21::after {
    bottom: -11px;
    background-color: rgba(253,233,204,1.00);
}





.inner-text {
	width: 100%;
	margin-top: 15px;
}


.button-29 {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    width: 250px;
    margin:0 auto;
    padding: .9em 2em;
    overflow: hidden;
    border: 1px solid #f3b67c;
    border-radius: 5px;
    background-color: #fff;
    color: #f3b67c;
    font-size: 1em;
}

.button-29:hover {
    background-color: transparent;
    color: rgba(255,255,255,1.00);
}

.button-29::before {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    width: 0;
    height: 100%;
    background-color: #f3b67c;
    content: '';
    transition: width .3s ease;
}

.button-29:hover::before {
    width: 100%;
}


.button-31 {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    width: 250px;
    margin:0 auto;
    padding: .9em 2em;
    border: 1px solid #ff9500;
    border-radius: 5px;
    background-color: #fff;
    color: #ff9500;
    font-size: 1em;
    transition: box-shadow .3s ease;
}

.button-31:hover {
    box-shadow: inset #ff9500 0 0 0 2em;
    color: #fff;
}

a {
	text-decoration: none;
}



.card_b-outer {
	display: flex;
	justify-content: center;
	align-items: center;
}


/*カードb*/

.card_b {
    display: flex;
    flex-direction: column;
    background-color: #fff;
    box-sizing: border-box;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    color: #333;
    text-decoration: none;
    overflow: hidden;
    transition: transform 0.3s ease-in-out;
	margin-left: 10px;
	margin-right: 10px;
	width: 30%;
}

.card_b-image-box {
    overflow: hidden;
}

.card_b-image {
    width: 100%;
    height: auto;
    object-fit: cover;
}


.card_b-box {
    
}

.card_b-box p {
    font-size: 16px;
    
}

.card_b-title {
    font-size: 2rem;
    font-weight: normal;
    text-align: center;
   
}

.card_b-description {
    margin-bottom: 1rem;
    line-height: 1.5;
   
}

.des-box {
    border-top: thin dotted rgba(171,171,171,1.00);
    padding-top: 10px;
	
    margin-left: 10px;
    margin-right: 10px;
    
}

.card_b:hover {
    transform: scale(1.05);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
}

.card_b {
  position: relative;
}

.card_b-plus {
  position: absolute;
  top: 12px;
  right: 12px;

  width: 32px;
  height: 32px;

  border-radius: 50%;

  background: rgba(255,255,255,0.9);

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 2rem;
  line-height: 1;

  box-shadow: 0 4px 12px rgba(0,0,0,.15);
}

.card_b {
  transition:
    transform .25s ease,
    box-shadow .25s ease;
}

.card_b:active {
  transform: scale(.97);
}


/* ===== モーダル ===== */
.modal {
  position: fixed;
  inset: 0;

  display: flex;
  align-items: center;
  justify-content: center;

  opacity: 0;
  pointer-events: none;

  transition: opacity .4s ease;

  z-index: 99999;
}

/* 開いた状態 */
.modal.is-open {
  opacity: 1;
  pointer-events: auto;
}

/* 背景 */
.modal-overlay {
  position: absolute;
  inset: 0;

  background: rgba(0,0,0,0.7);
  backdrop-filter: blur(6px);
}

/* ===== 背景（ガラス感） ===== */
.modal-overlay {
  position: absolute;
  inset: 0;

  background: rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(8px);
}


/* 本体 */
.modal-content {
  position: relative;
  z-index: 2;

  width: 90%;
  max-width: 720px;

  padding: 4rem 3rem;
  border-radius: 16px;

  background: rgba(255,255,255,0.9);
  backdrop-filter: blur(10px);

  box-shadow:
    0 20px 60px rgba(0,0,0,0.25),
    0 0 0 1px rgba(255,255,255,0.4) inset;

  transform: translateY(30px) scale(0.95);
  opacity: 0;
  transition: all .4s ease;
}

.modal-content h2 {
	font-size: clamp(2rem, 2vw, 2.4rem);
}

.modal-content p {
	font-size: clamp(1.6rem, 2vw, 2.2rem);
}

/* 開いた時 */
.modal.is-open .modal-content {
  transform: translateY(0);
  opacity: 1;
}

/* 動画 */
.modal-video {
  width: 100%;
  border-radius: 10px;
  margin: 2rem 0;
}

/* ===== 閉じるボタン（おしゃれ版） ===== */
.close-modal {
    position: absolute;
    top: 16px;
    right: 16px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: rgba(0,0,0,0.46);
    border: none;
    cursor: pointer;
    font-size: 1.8rem;
    transition: all .3s ease;
}

.close-modal:hover {
  background: #111;
  color: #fff;
  transform: rotate(90deg);
}

/* 背景スクロール停止 */
body.no-scroll {
  overflow: hidden;
}

.modal-video {
  width: 40%;
  display: block;
  margin: 2rem auto;
  border-radius: 12px;
}


.btn_area {
	margin-top: 120px;
	margin-bottom: 20px;
}

@media (max-width:768px){

  .modal-video {
    width: 100%;
  }

}






/*table*/

table{
  border-collapse: collapse;
  width: 100%;
}
.tb01 th,
.tb01 td{
  padding: 10px;
  border: solid 1px #ccc;
  text-align:center;
  box-sizing:border-box;
}
.tb01 th {
    background-color: rgba(255,250,244,0.00);
    color: #2E2E2E;
    font-weight: normal;
    font-family: "Kaisei Tokumin", serif;
    border-bottom: none;
}

.tb01 tr:last-child{
    border-bottom: solid 1px #ccc;
  }


.section-inner {
	width: 100%;
}

/* ===== section_03 ===== */
.section_03 {
  position: relative;
  height: 500vh;
  z-index: 10;
}

.horizontal-sticky {
  position: sticky;
  top: 0;
  height: 100vh;
  overflow: hidden;
}

.horizontal {
  display: flex;
  height: 100vh;
  will-change: transform;
}

/* ===== card ===== */
.card {
  flex: 0 0 100vw;        /* ← 1枚 = 画面幅 */
  height: 100vh;          /* ← 1枚 = 画面高 */
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  position: relative;
  z-index: 101;
  background-image:  radial-gradient(#ffc107 2px, transparent 2px), radial-gradient(#ffc107 2px, #ffffff 2px);
  background-size: 40px 40px;
  background-position: 0 0,20px 20px;
}







/* ===== card content ===== */
.card-content {
  max-width: 80%;
  padding: 1rem;
  text-align: center;
	display: flex;
	flex-flow: column;
	align-items: center;
	justify-content: space-around;
	
}

.card-content_flex {
	width: 100%;
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	justify-content: center;
}

.card_left {
	width: 30%;
}

.card_right {
	width: 40%;
	display: flex;
	flex-flow: row nowrap;
	justify-content: flex-start;
	text-align: left;
	
	
}

.card_right ul, ol {
  padding: 0;
	margin-left: 40px;
  position: relative;
  width: 100%;
}

.card_right ul li, ol li {
  color: black;
  border-left: solid 18px orange;/*左側の線*/
  background: whitesmoke;/*背景色*/
  margin-bottom: 5px;/*下のバーとの余白*/
  line-height: 1.5;
  border-radius: 0 15px 15px 0;/*右側の角だけ丸く*/
  padding: 1em;
  list-style-type: none!important;
  font-size: clamp(1.6rem, 4vw, 1.8rem);
}




.card h3 {
  font-size: clamp(2.2rem, 4vw, 2.8rem);
  margin-bottom: 2rem;
}

.card_img {
	width: 100%;
	box-shadow: 20px 20px 0 #faf0e6;
	vertical-align: bottom;
}

.card p {
    font-size: 1.6rem;
    line-height: 1.9;
    opacity: .85;
    color: rgba(50,50,50,1.00);
}

.box15 ul, ol {
    color: #1e366a;/*ドット 色 太さ*/
    padding: 0.5em 0.5em 0.5em 2em;
    line-height: 1.6;
	margin-left: 5%;
	
}

.box15 ul li:not(:last-child){
    border-bottom: 1px dashed #838383;
    margin-bottom: 0;
}


.box15 ul li, ol li {
    line-height: 1.5;
    padding: 0.5em 0;
    color: rgba(54,54,54,1.00);
	font-size: clamp(1.8rem, 2vw, 2.4rem);
	
}



/* ================= horizontal ================= */
.is-horizontal {
  background: #fff;
  color: #fff;
  z-index: 10003;
}

/* ===== section ===== */
.section_05 {
  position: relative;
  z-index: 1;      /* 高くしない */
  background: linear-gradient(
    175deg, #f5f5f5 50%, #fffafa 50%);
  transform: none; /* 念のため */
}

.section_06 {
  position: relative;
  z-index: 1;      /* 高くしない */
  background: linear-gradient(
    175deg, #f5f5f5 50%, #fffafa 50%);
  transform: none; /* 念のため */
  padding-top: 25px;
	text-align: center;
	padding-bottom: 200px;
}


.section_06 h2 {
	text-align: center;
}


/* ===== Q&A wrapper ===== */
.qa {
  max-width: 960px;
  width: 100%;
}

/* ===== list ===== */
.qa-list {
  margin-top: 4rem;
}

/* ===== item ===== */
.qa-item {
    border-bottom: 1px solid #ddd;
    text-align: left;
}

/* ===== question ===== */
.qa-question {
  width: 100%;
  height: 96px;

  display: flex;
  align-items: center;
  justify-content: space-between;

  padding: 0 2.4rem;

  font-size: 2rem;
  letter-spacing: .04em;

  background: transparent;
  border: none;
  cursor: pointer;

  color: #111;
font-family: "Kaisei Tokumin", serif;
    font-weight: lighter;
}




/* + icon */
.qa-question .icon {
  font-size: 2.4rem;
  transition: transform .3s ease;
}


/* ===== answer ===== */
.qa-answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height .4s ease, opacity .3s ease;
    opacity: 0;
    font-size: 1.2rem;
}

.qa-answer p {
    　padding: 0 2.4rem 2.4rem;
    line-height: 3.8rem;
    　text-align: left;
    text-align: left;
}

/* ===== open state ===== */
.qa-item.is-open .qa-answer {
  max-height: 1200px; /* 十分な値 */
  opacity: 1;
}

.qa-item.is-open .icon {
  transform: rotate(45deg);
}


/* ================= form ================= */
.section_09 {
  background: #f4f4f4;
}

.contact-form {
  max-width: 720px;
  margin: 0 auto;
	text-align: left;
}

.form-row {
  display: flex;
  flex-direction: column;
  margin-bottom: 2rem;
}

label {
  font-size: 2.4rem;
  margin-bottom: .6rem;
  font-family: "Kaisei Tokumin", serif;
}

.form-label span {
    margin-left: 10px;
    padding: 1px 8px;
    border-radius: 3px;
    font-size: 2rem;
    font-weight: normal;
    color: #fff;
    background-color: #FCBB7B;
    text-align: justify;
}



input,
textarea {
  padding: 1rem;
  font-size: 1.6rem;
  border: 1px solid #ccc;
}




/* ===== footer ===== */
.site-footer {
	
    position: relative;
	height: auto;
    padding-top: 20vh;
    padding-right: 20px;
    padding-left: 20px;
    padding-bottom: 60px;
    background: linear-gradient(
    to bottom,
    #fffafa 100%,
    rgba(245,245,245,0.8) 30%,
    rgba(240,240,240,1) 100%
  );
}

.footer-img {
	width: 40%;
	margin-left: auto;
	margin-right: auto;
}

.footer-inner {
  max-width: 960px;
  margin: 0 auto;
  text-align: center;
}

.footer-message {
    font-size: clamp(1.6rem, 1.2rem + 1vw, 2.4rem);
    line-height: 1.8;
    color: #232323;
    margin-bottom: 48px;
}

.footer-divider {
  margin-bottom: 40px;
  opacity: 0.8;
}

.footer-nav {
  display: flex;
  justify-content: center;
  gap: 32px;
  margin-bottom: 40px;
}

.footer-nav a {
  font-size: 1.4rem;
  color: #555;
  text-decoration: none;
  position: relative;
}

.footer-nav a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -4px;
  width: 100%;
  height: 1px;
  background: rgba(0,0,0,0.2);
  transform: scaleX(0);
  transition: transform .3s ease;
}

.footer-nav a:hover::after {
  transform: scaleX(1);
}

.footer-copy {
  font-size: 1.2rem;
  color: #888;
}

.site-footer {
  overflow: hidden;
}

.site-footer::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(
    circle at 50% 0%,
    rgba(255,255,255,0.6),
    transparent 60%
  );
  pointer-events: none;
}



/* ===== social icons ===== */
.social {
  display: flex;
  gap: 32px;
  list-style: none;
  padding: 0;
  margin: 0;
}

.social li {
  display: flex;
}

/* 共通アイコン */
.social .icon {
  width: 42px;               /* ← 大きめ */
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #111;
  transition: transform 0.25s ease, background 0.25s ease;
}

/* SVG共通 */
.social svg {
  width: 28px;
  height: 28px;
  fill: none;
  stroke: #fff;
  stroke-width: 2;
  transition: stroke 0.25s ease, fill 0.25s ease;
}

/* ===== hover（壊れない） ===== */
.social .icon:hover {
  transform: scale(1.15);     /* 拡大のみ */
}

/* Instagram */
.social .instagram:hover {
  background: linear-gradient(
    45deg,
    #f09433,
    #e6683c,
    #dc2743,
    #cc2366,
    #bc1888
  );
}
.social .instagram:hover svg {
  stroke: #fff;
}

/* Facebook */
.social .facebook:hover {
  background: #1877f2;
}
.social .facebook svg {
  fill: #fff;
  stroke: none;
}

/* X */
.social .x:hover {
  background: #000;
  outline: 2px solid #fff;
}
.social .x svg {
  fill: #fff;
  stroke: none;
}

/* ================= pagination ================= */
.pagination {
  position: fixed;
  right: 24px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 20000;
  display: flex;
  flex-direction: column;
	align-items: center;
	justify-content: center;
  gap: 12px;
}

.pagination .dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: rgba(223,208,3,0.68);
}

.pagination .dot.active {
	width: 15px;
    height: 15px;
    border-radius: 50%;
    background-color: rgba(33,33,33,1.00);
}



.pagination.is-horizontal .dot.active {
    background-color: #EB3D40;
}


.pagination {
  background: none;
}

.pagination.is-horizontal {
    background-color: rgba(0,0,0,0.00);
}




/* ================= to top ================= */
.back-to-top {
  position: fixed;
  right: 24px;
  bottom: 24px;

  width: 80px;
  height: 80px;
  z-index: 100111;
}


.section-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 6rem 2rem;
}

.section_03 {
  position: relative;
}

.horizontal-sticky {
  position: sticky;
  top: 0;
  height: 100vh;
  overflow: hidden;
}

.horizontal {
  display: flex;
  height: 100%;
}

.card {
    min-width: 100vw;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: rgba(255,255,255,1.00);
    color: rgba(62,62,62,1.00);
}



.pagination {
    position: fixed;
    right: 24px;
    top: 30%;
    transform: translateY(-50%);
    z-index: 30999;
    background-color: rgba(255,255,255,0.00);
}

.scroll {
  position: relative;
}
.scroll-text {
    color: #FFFFFF;
    font-size: 14px;
    text-align: center;
    transform: rotate(90deg);
}
.scroll-border {
  position: relative;
  top: 20px;
  width: 100%;
  height: 100px;
  overflow: hidden;
}
.scroll-border::before {
  content: "";
  display: block;
  position: absolute;
  width: 1px;
  height: 40px;
  top: 0;
  left: 0;
  right: 0;
  background: #fff;
  animation: scrollbar 2.0s ease-in-out infinite;
  margin: auto;
}
@keyframes scrollbar {
  0% {
    height: 0;
    top: 0;
  }
  30% {
    height: 100%;
  }
  100% {
    top: 100%;
  }
}

.heading-13 {
    display: inline-block;
    position: relative;
    padding: 0 2.5em;
    color: #383838;
	text-align: center;
	
}

.heading-13::before,
.heading-13::after {
    content: '';
    display: inline-block;
    position: absolute;
    top: 50%;
    width: 20px;
    height: 1px;
    background-color: #999999;
}

.heading-13::before {
    left: 0;
}

.heading-13::after {
    right: 0;
}


/* ================= SP ================= */
@media (max-width: 768px) {
  .overlap {
    position: relative;
    min-height: auto;
  }



  .horizontal {
    padding: 2rem 1.6rem;
  }
	
	
.hero {
    min-height: 100svh; /* iOS対応 */
	background-position:center center;
  }

  .hero h1 {
    font-size: 3.2rem;
    letter-spacing: 0.04em;
  }

  .hero p {
    font-size: 2.3rem;
  }	
	
	 .section-inner {
    padding: 4rem 1.6rem;
  }

.horizontal-sticky {
    position: static;
    height: auto;
  }

  .horizontal {
    flex-direction: column;
    transform: none !important;
  }

  .card {
    min-width: 100%;
    height: auto;
    padding: 6rem 2rem;
  }

 .social a {
    width: 56px;
    height: 56px;
  }
	
 .pagination {
    display: none;
  }
	
	
	.section_01-inner {
		flex-flow: column;
	}	
	
	.section_01-inner_img {
		width: 100%;
	}
	
	.section_01-inner_text {
		width: 100%;
	}
	
	.card_b-outer {
	display: flex;
	justify-content: center;
	align-items: center;
		flex-flow: column;
}
	
	
	
	.card_b {
    display: flex;
    flex-direction: column;
    background-color: #fff;
    box-sizing: border-box;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    color: #333;
    text-decoration: none;
    overflow: hidden;
    transition: transform 0.3s ease-in-out;
	margin-left: 10px;
	margin-right: 10px;
		margin-bottom: 20px;
	width: 100%;
}
	
   .tb01 {
    width: 100%;
  }

.tb01 {
    width: 100%;
  }
  table.tb01 th,
  table.tb01 td {
    display: block;
    width: 100%;
    border-bottom:none;
  }
  .tb01 tr:last-child{
    border-bottom: solid 1px #ccc;
  }

	
.gmap_iframe {
    aspect-ratio: 16 / 9;
    max-width: 1000px;
    width: 100%;
    height: auto;
	margin-bottom: 10px;
}	
	
	

	.card-content {
  max-width: 100%;
  padding: 4rem;
  text-align: center;
	display: flex;
	flex-flow: column;
	align-items: center;
	justify-content: center;
}

	.inner-text {
		margin-top: 15px;
	}
	
	label {
  font-size: 1.8rem;
  margin-bottom: .6rem;
  font-family: "Kaisei Tokumin", serif;
}

.form-label span {
    margin-left: 10px;
    padding: 1px 8px;
    border-radius: 3px;
    font-size: 1.4rem;
    font-weight: normal;
    color: #fff;
    background-color: #FCBB7B;
    text-align: justify;
}

.heading-31 {
    position: relative;
    padding: .3em 0 .2em 1em;
    border-bottom: 3px solid #f9e5b9;
    color: #333333;
	font-size: 18px;
}	
	
	
}

/* ===============================
   横スクロール → 縦切替時の完全リセット
================================ */
@media (max-width: 768px) {

  /* 横スクロール用の高さを殺す */
  .section_03 {
    height: auto;
    min-height: auto;
    padding: 0;
  }

  .horizontal-sticky {
    position: static;
    height: auto;
    min-height: auto;
  }

  .horizontal {
    flex-direction: column;
    transform: none !important;
  }

  .card {
    height: auto;
    min-height: auto;
    padding: 4rem 1.6rem;
  }

  /* 縦スクロール量調整用スペースを完全削除 */
  .scroll-space {
    display: none !important;
    height: 0 !important;
  }
	

	.section h2 {
  font-size: clamp(1.8rem, 3vw, 3.6rem);
  letter-spacing: .06em;
  text-align: center;
  margin-bottom: 3rem;
}
	
	
	
.section_01-inner_text p {
 
 font-size: clamp(1.6rem, 3vw, 2.6rem);
}
	
.back-to-top {
  position: fixed;
  right: 8px;
  bottom: 18px;

  width: 60px;
  height: 60px;
  z-index: 100111;
}	
	
	.box-015 {
    
    max-width: 100%;
	}
	
.hero_logo {
	width: 100%;
	margin-bottom: 80%;
}	

 .section_02-inner {
	display: flex;
	 align-items: center;
	 justify-content: space-around;
    
  }
.section_02-inner_img {
	width: 80%;
	padding: 0px;
}
.section_02-inner_text {
 padding: 0px;
 width: 20%;
 
}	
	
.card-content {
  width: 100%;
	padding: 0;
	}

.card-content_flex {
	width: 100%;
	display: flex;
	flex-flow: column wrap;
	align-items: center;
	justify-content: center;
}
	
.card_left {
	width: 100%;
}

.card_right {
	width: 100%;
	display: flex;
	flex-flow: row nowrap;
	justify-content: flex-start;
	text-align: left;
	
	
}	
	
	
.card_img {
		width: 100%;
	}
	
.section_01-inner_img2 {
	width: 100%;
	padding: 0px;
}
	
	.footer-img {
		width: 90%;
	}
	
	.footer-nav {
		margin-left: 30px;
		margin-right: 30px;
	}
	
.section_01 h2 {
  font-size: clamp(1.4rem, 3vw, 2.6rem);
  letter-spacing: .06em;
  text-align: center;
  margin-bottom: 3rem;
}
	
}

/*sns*/



.floating-sns {
  position: fixed;
  right: 16px;
  bottom: 124px;
  z-index: 100050;

  display: flex;
  flex-direction: column;
  gap: 14px;

  opacity: 0.6;
  transition: opacity 0.3s ease;
  
}

.floating-sns:hover {
  opacity: 1;
}

.floating-sns a {
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.floating-sns svg {
  width: 100%;
  height: auto;
  fill: none;
  stroke: #000;
  stroke-width: 1.8;
}

.no_border {
    border-bottom: none;
    
}


/* ================= NEWS ================= */

.section-news {
  background: #f7f7f7;
}

/* 見出し */
.news-heading {
  margin-bottom: 5rem;
  text-align: center;
}

.news-sub {
  display: inline-block;

  margin-bottom: 1rem;

  font-size: 1.2rem;
  letter-spacing: .25em;

  color: #888;
}

.news-heading h2 {
  font-size: clamp(2.8rem, 4vw, 4rem);
  letter-spacing: .08em;
}

/* 一覧 */
.news-list {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}

/* カード */
.news-item {
  display: flex;
  gap: 4rem;

  padding: 3rem;

  background: #fff;

  border-radius: 16px;

  text-decoration: none;
  color: #111;

  transition:
    transform .3s ease,
    box-shadow .3s ease;
}

/* hover */
.news-item:hover {
  transform: translateY(-4px);

  box-shadow:
    0 12px 40px rgba(0,0,0,.08);
}

/* 日付側 */
.news-meta {
  min-width: 180px;

  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.news-meta time {
  font-size: 1.4rem;
  color: #666;
  letter-spacing: .08em;
}

/* カテゴリ */
.news-category {
  width: fit-content;

  padding: .4rem 1rem;

  border-radius: 999px;

  background: #111;
  color: #fff;

  font-size: 1.2rem;
  letter-spacing: .08em;
}

/* 本文 */
.news-content h3 {
  margin-bottom: 1rem;

  font-size: clamp(1.8rem, 2vw, 2.4rem);

  line-height: 1.5;
}

.news-content p {
  font-size: 1.5rem;
  line-height: 1.8;

  color: #555;
}

/* スマホ */
@media (max-width:768px){

  .news-item {
    flex-direction: column;
    gap: 2rem;

    padding: 2rem;
  }

  .news-meta {
    min-width: auto;
  }

.card_right ul, ol {
  margin-top: 25px;
  position: relative;
  width: 100%;
  margin-left: 0px;
}	

	.site-footer p {
font-size: clamp(1.4rem, 2vw, 1.8rem);	
	}
	
.qa-question { 
	font-size: 1.4rem;
	text-align: left;
		}
.qa-answer {
	font-size: 1.8rem;
	text-align: left;
}

	.contact-form {
		padding: 10px;
	}
}

/* =========================
RFL Philosophy Section
独立設計
========================= */

.rfl-philosophy{
  position:relative;
  overflow:hidden;

  padding:clamp(80px, 10vw, 160px) 20px;

  background:
  linear-gradient(
    180deg,
    #f8f5ef 0%,
    #f4f1ea 100%
  );
}


.rfl-philosophy *{
  box-sizing:border-box;
}


.rfl-philosophy__inner{
  width:100%;
  max-width:1400px;

  margin-inline:auto;

  display:grid;
  grid-template-columns:1fr 1fr;
  gap:clamp(40px, 5vw, 100px);

  align-items:center;
}


/* =========================
Image
========================= */

.rfl-philosophy__image-wrap{
  position:relative;
}


.rfl-philosophy__image-bg{
  position:absolute;

  top:-30px;
  left:-30px;

  width:90%;
  height:90%;

  border:1px solid #e2d7c2;
}


.rfl-philosophy__image{
  position:relative;

  width:100%;
  max-width:620px;

  overflow:hidden;

  box-shadow:
  0 30px 80px rgba(0,0,0,.08);
}


.rfl-philosophy__image img{
  width:100%;
  height:auto;

  display:block;
}


/* =========================
Leaves
========================= */

.rfl-philosophy__leaf{
  position:absolute;

  width:180px;
  height:180px;

  opacity:.15;
}


.rfl-philosophy__leaf::before{
  content:"❦";

  font-size:180px;
  color:#b9aa8d;
}


.leaf-left{
  left:-80px;
  bottom:60px;

  transform:rotate(-20deg);
}


.leaf-bottom{
  left:40px;
  bottom:-80px;

  transform:rotate(10deg);
}


/* =========================
Heading
========================= */

.rfl-philosophy__heading{
  margin-bottom:50px;
}


.rfl-philosophy__sub{
  position:relative;

  display:inline-flex;
  align-items:center;
  gap:20px;

  margin-bottom:20px;

  color:#b79a66;

  font-size:1.3rem;
  letter-spacing:.3em;
}


.rfl-philosophy__sub::before,
.rfl-philosophy__sub::after{
  content:"";

  width:60px;
  height:1px;

  background:#cbb78e;
}


.rfl-philosophy__title{
  position:relative;

  display:inline-block;

  padding-bottom:20px;

  color:#332822;

  font-size:clamp(3.2rem, 5vw, 6rem);
  font-weight:500;
  line-height:1.4;
  letter-spacing:.08em;
}


.rfl-philosophy__title::after{
  content:"";

  position:absolute;
  left:0;
  bottom:0;

  width:80px;
  height:2px;

  background:#c5a96f;
}


/* =========================
Text
========================= */

.rfl-philosophy__text p{
  margin-bottom:2.4rem;

  color:#2f2f2f;

  font-size:clamp(1.4rem, 1.6vw, 2rem);
  line-height:1.3;
  letter-spacing:.06em;
}


/* =========================
Message
========================= */

.rfl-philosophy__message{
  position:relative;

  margin-top:70px;
  padding-left:36px;
}


.rfl-philosophy__message-line{
  position:absolute;
  top:0;
  left:0;

  width:1px;
  height:100%;

  background:#c5a96f;
}


.rfl-philosophy__message-text{
  color:#b7862b;

  font-size:clamp(2rem, 2.5vw, 3.4rem);
  line-height:1.4;
  letter-spacing:.08em;
}


/* =========================
Footer
========================= */

.rfl-philosophy__footer{
  margin-top:60px;

  color:#444;

  font-size:clamp(1.7rem, 1.8vw, 2.1rem);
  line-height:2.2;
}


/* =========================
Landscape
========================= */

.rfl-philosophy__landscape{
  position:absolute;

  left:0;
  bottom:-1px;

  width:100%;
  opacity:.15;
}


.rfl-philosophy__landscape svg{
  width:100%;
  height:120px;

  display:block;

  fill:#c9b28a;
}


/* =========================
Responsive
========================= */

@media(max-width:980px){

  .rfl-philosophy__inner{
    grid-template-columns:1fr;
  }


  .rfl-philosophy__image{
    margin-inline:auto;
  }


  .rfl-philosophy__content{
    max-width:800px;
    margin-inline:auto;
  }

}


@media(max-width:768px){

  .rfl-philosophy{
    padding:80px 20px;
  }


  .rfl-philosophy__heading{
    margin-bottom:40px;
  }


  .rfl-philosophy__message{
    margin-top:50px;
    padding-left:24px;
  }


  .rfl-philosophy__message-text{
    line-height:1.8;
  }


  .rfl-philosophy__footer{
    margin-top:40px;
  }
	
	.section {
		padding-top: 2rem;
		margin-bottom: 2rem;
	}

}

/* ==========================================
   Crowdfunding Section
========================================== */
.crowdfunding-section {
  background:
    radial-gradient(circle at top right, rgba(255, 214, 153, 0.35), transparent 40%),
    linear-gradient(180deg, #fffdf8 0%, #fff7eb 100%);
  position: relative;
  overflow: hidden;
}

.crowdfunding-section::before {
  content: "";
  position: absolute;
  top: -80px;
  left: -80px;
  width: 220px;
  height: 220px;
  border-radius: 50%;
  background: rgba(255, 191, 73, 0.12);
}

.crowdfunding-section::after {
  content: "";
  position: absolute;
  bottom: -100px;
  right: -80px;
  width: 260px;
  height: 260px;
  border-radius: 50%;
  background: rgba(255, 149, 0, 0.08);
}

.cf-badge {
  display: inline-block;
  padding: 0.7rem 1.8rem;
  margin: 0 auto 2rem;
  border-radius: 999px;
  background: linear-gradient(90deg, #ff9500, #ffb347);
  color: #fff;
  font-size: 1.4rem;
  font-weight: bold;
  letter-spacing: 0.08em;
  box-shadow: 0 8px 20px rgba(255, 149, 0, 0.25);
}

.cf-title {
  text-align: center;
  font-size: clamp(3rem, 4vw, 5.2rem);
  line-height: 1.5;
  margin-bottom: 2.5rem;
  color: #2f2f2f;
}

.cf-lead {
  max-width: 900px;
  margin: 0 auto 5rem;
  text-align: center;
  font-size: clamp(1.8rem, 2vw, 2.4rem);
  line-height: 2;
  color: #555;
}

.cf-main {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5rem;
}

.cf-image-wrap {
  position: relative;
  width: 48%;
}

.cf-image {
  width: 100%;
  display: block;
  border-radius: 24px;
  box-shadow:
    0 25px 60px rgba(0, 0, 0, 0.15),
    0 0 0 8px rgba(255, 255, 255, 0.9);
}

.cf-floating-card {
  position: absolute;
  right: -20px;
  bottom: 30px;
  background: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(10px);
  padding: 1.6rem 2.4rem;
  border-radius: 18px;
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.12);
  text-align: center;
}

.cf-floating-label {
  display: block;
  font-size: 1.2rem;
  color: #ff9500;
  letter-spacing: 0.08em;
  margin-bottom: 0.4rem;
}

.cf-floating-card strong {
  display: block;
  font-size: 2.2rem;
  color: #333;
  font-family: "Kaisei Tokumin", serif;
  font-weight: lighter;
}

.cf-content {
  width: 42%;
}

.cf-subtitle {
  font-size: 2.8rem;
  margin-bottom: 2rem;
  color: #333;
}

.cf-list {
  list-style: none;
  padding: 0;
  margin: 0 0 3rem;
}

.cf-list li {
  position: relative;
  padding: 1.2rem 1.2rem 1.2rem 4rem;
  margin-bottom: 1rem;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.06);
  font-size: 1.8rem;
}

.cf-list li::before {
  content: "🐎";
  position: absolute;
  left: 1.4rem;
  top: 50%;
  transform: translateY(-50%);
}

.cf-message {
  padding: 2.4rem;
  margin-bottom: 3rem;
  border-radius: 16px;
  background: rgba(255, 149, 0, 0.08);
  line-height: 2;
  font-size: 1.7rem;
  color: #444;
}

.cf-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 1.3rem 3.6rem;
  border-radius: 999px;
  background: linear-gradient(90deg, #ff9500, #ffb347);
  color: #fff;
  text-decoration: none;
  font-size: 1.8rem;
  font-weight: bold;
  box-shadow: 0 12px 30px rgba(255, 149, 0, 0.25);
  transition: all .3s ease;
}

.cf-button:hover {
  transform: translateY(-3px) scale(1.03);
  box-shadow: 0 18px 40px rgba(255, 149, 0, 0.35);
}

.cf-notice {
  max-width: 760px;
  margin: 5rem auto 0;
  padding: 3rem;
  text-align: center;
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.06);
}

.cf-notice h3 {
  font-size: 2.4rem;
  margin-bottom: 1rem;
  color: #333;
}

.cf-notice p {
  font-size: 1.7rem;
  line-height: 2;
  margin: 0;
  color: #666;
}

/* ==========================================
   Responsive
========================================== */
@media (max-width: 768px) {

  .cf-title {
    font-size: 3rem;
    line-height: 1.6;
  }

  .cf-lead {
    font-size: 1.7rem;
    margin-bottom: 3rem;
  }

  .cf-main {
    flex-direction: column;
    gap: 3rem;
  }

  .cf-image-wrap,
  .cf-content {
    width: 100%;
  }

  .cf-floating-card {
    right: 10px;
    bottom: 10px;
    padding: 1rem 1.6rem;
  }

  .cf-floating-card strong {
    font-size: 1.6rem;
  }

  .cf-subtitle {
    font-size: 2.2rem;
  }

  .cf-list li {
    font-size: 1.6rem;
  }

  .cf-button {
    width: 100%;
    font-size: 1.7rem;
    padding: 1.4rem 2rem;
  }

  .cf-notice {
    padding: 2.4rem 2rem;
  }
}


.cf-badge-success {
  background: linear-gradient(90deg, #ff6b00, #ff9500);
  animation: cfGlow 2.5s ease-in-out infinite;
}

@keyframes cfGlow {
  0% {
    box-shadow: 0 0 0 rgba(255,149,0,0.0);
  }
  50% {
    box-shadow: 0 0 30px rgba(255,149,0,0.35);
  }
  100% {
    box-shadow: 0 0 0 rgba(255,149,0,0.0);
  }
}


/* ==========================================
   RRC NEWS
========================================== */

.rrc-section {
  position: relative;
  overflow: hidden;

  background:
    linear-gradient(
      180deg,
      #fffdfa 0%,
      #fff6ea 100%
    );
}

/* 背景装飾 */
.rrc-section::before {
  content: "";
  position: absolute;
  top: -120px;
  right: -120px;

  width: 320px;
  height: 320px;

  border-radius: 50%;

  background:
    rgba(255, 180, 60, 0.12);
}

.rrc-label {
  display: inline-block;

  margin-bottom: 2rem;
  padding: .8rem 2rem;

  border-radius: 999px;

  background:
    linear-gradient(
      90deg,
      #ff9500,
      #ffb347
    );

  color: #fff;

  font-size: 1.3rem;
  letter-spacing: .15em;
  font-weight: bold;

  box-shadow:
    0 10px 25px rgba(255,149,0,.25);
}

.rrc-title {
  text-align: center;

  font-size:
    clamp(3.6rem, 5vw, 6rem);

  line-height: 1.4;

  color: #2b2b2b;

  margin-bottom: 1.6rem;
}

.rrc-subtitle {
  text-align: center;

  font-size:
    clamp(1.8rem, 2vw, 2.8rem);

  line-height: 1.9;

  color: #666;

  margin-bottom: 6rem;
}

.rrc-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5rem;
}

/* ==========================================
   image
========================================== */

.rrc-image-area {
  position: relative;
  width: 46%;
}

.rrc-image-box {
  position: relative;
}

.rrc-image-box::after {
  content: "";

  position: absolute;
  top: 20px;
  left: 20px;

  width: 100%;
  height: 100%;

  border-radius: 24px;

  background: #ffd89b;

  z-index: 0;
}

.rrc-image {
  position: relative;
  z-index: 2;

  width: 100%;
  display: block;

  border-radius: 24px;

  box-shadow:
    0 30px 60px rgba(0,0,0,.15);
}

/* ランク表示 */
.rrc-rank {
  position: absolute;

  right: -20px;
  bottom: 30px;

  z-index: 3;

  padding: 2rem 2.6rem;

  border-radius: 18px;

  background:
    rgba(255,255,255,.92);

  backdrop-filter: blur(10px);

  box-shadow:
    0 15px 35px rgba(0,0,0,.12);

  text-align: center;
}

.rrc-rank span {
  display: block;

  font-size: 1.2rem;
  letter-spacing: .08em;

  color: #ff9500;

  margin-bottom: .5rem;
}

.rrc-rank strong {
  font-size: 3rem;

  color: #222;

  font-family: "Kaisei Tokumin", serif;
  font-weight: lighter;
}

/* ==========================================
   content
========================================== */

.rrc-content {
  width: 46%;
}

.rrc-date {
  display: inline-block;

  margin-bottom: 2rem;

  font-size: 1.4rem;

  color: #999;

  letter-spacing: .08em;
}

.rrc-content p {
  margin-bottom: 2.2rem;

  font-size:
    clamp(1.7rem, 2vw, 2rem);

  line-height: 2.2;

  color: #444;
}

.rrc-content strong {
  color: #d97706;
}

.rrc-message {
  margin-top: 4rem;

  padding: 3rem;

  border-radius: 24px;

  background:
    rgba(255,149,0,.08);

  line-height: 2.2;

  font-size:
    clamp(1.7rem, 2vw, 2rem);

  color: #444;
}

/* ==========================================
   responsive
========================================== */

@media (max-width: 768px) {

  .rrc-wrap {
    flex-direction: column;
    gap: 4rem;
  }

  .rrc-image-area,
  .rrc-content {
    width: 100%;
  }

  .rrc-title {
    font-size: 3.4rem;
  }

  .rrc-subtitle {
    margin-bottom: 4rem;
  }

  .rrc-rank {
    right: 10px;
    bottom: 10px;

    padding: 1.4rem 1.8rem;
  }

  .rrc-rank strong {
    font-size: 2.2rem;
  }

  .rrc-message {
    padding: 2rem;
  }

}