@charset "UTF-8";

section {
	margin: 0 auto;
	padding-bottom: 3%;
}

.sec02 {
    margin-bottom: 16%;
    border-top: 1px solid #000;
    margin-top: 14%;
}
.bg-02-2 {margin-bottom: 20%;}

/*fonts
---------------------------*/
h3 {
    max-width: 84px;
    margin: 15% auto 4%;
    padding: 0 1px;
    font-size: .8rem;
    letter-spacing: 0;
    border-radius: 20px;
}

h4 {
    font-size: min(9vw,2.5rem);
    letter-spacing: 0;
    margin: 0 auto 3%;
    line-height: 1.2;
}

h4 span {
    display: block;
    width: 80%;
    font-size: 44%;
    margin: 0 auto;
    color: #000;
}

h6 {
	display: block;
	width: 86%;
	margin: 0 auto 3%;
	text-align: center;
}

h8 {
    display: block;
    width: 86%;
    margin: 0 auto 11%;
    font-size: min(5.5vw,1.4rem);
    padding: 1.5%;
    background: #84774f;
    color: #fff;
    text-align: center;
}

.bg_gold {background:#786a3e!important;}
.bg_w {background:#fff!important;}
.txt_gold {color: #786a3e!important;}
.txt_bk {color: #000!important;}
.txt_w {color: #fff!important;}
.txt_ct {text-align: center!important;}

/*カラムレイアウト
---------------------------*/
.col_box {
	display: flex;
	flex-wrap: wrap;
}

.col_box > * {
	width: 48%;
	margin: 1%;
}

.col-01 dl {
    width: 80%;
    margin: 0 auto 5%;
}

.col-01 dt {
    background: #786a3e;
    color: #fff;
    text-align: center;
    margin: 0 0 2%;
    padding: 1%;
    font-size: min(5.5vw,1.1rem);
}

.col-01 dd {
    font-size: min(3vw,1rem);
    text-align: justify;
    line-height: 1.8;
    padding: 1% 0;
    color: #000;
}

.col-02 {
	justify-content: space-between;
	margin: 0 auto 15%;
	max-width: 600px;
}

.col-02 figure {
    width: 46%;
    padding: 0 2%;
    max-width: 200px;
}

.col-02 dl {
    width: 48%;
    padding: 0 2%;
}

.col-02 dt {
    width: 67%;
    padding-bottom: 12%;
}

.col-02 dd {
    font-feature-settings: "palt";
}

.list-thm {
    width: 86%;
    max-width: 1100px;
    margin: 0 auto 3%;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
}

li.col2-2 {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    width: 100%!important;
    margin-bottom: 10%!important;
}

li.col2-2 div {width: 100%;}

li.col2-2 div:first-child {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-bottom: 5%;
}

li.col2-2 div:first-child p.th-t {
    width: 100%;
}
li.col2-2 div:first-child figure {
    width: 52%;
}
.list-thm div:first-child p.th-r {
    width: 43%;
    padding: 0;
}
li.col2-2 div:last-child figure {
	max-width: 382px;
    margin: auto;
}

.list-thm figure{
	position: relative;
}
.list-thm figcaption{
	position: absolute;
	bottom: 2px;
	right: 4px;
	color: #000;
	font-size: 10px;
}





@media screen and (min-width: 767.9px) {
li.col2-2 {
    width: 47%!important;
    margin-bottom: 5%!important;
}
li.col2-2 div:first-child {
    align-items: flex-start;
	margin-bottom: 1%;
}
li.col2-2 div:last-child {
    width: 86%;
    padding: 3% 0 0;
}
}

.list-thm.btm-h {
    margin-bottom:0;
}

.list-thm li {
	width: 46%;
	margin: 0 2% 7%;
}

.list-thm li.colx2 {width: 95%;}

.list-thm li p.th-t {
    text-align: center;
    border-top: 1px solid #786a3e;
    color: #786a3e;
    font-size: min(3.3vw,1rem);
    padding: 1% 0;
    letter-spacing: 0px;
    min-height: 45px;
    line-height: 1.2;
    display: flex;
    justify-content: center;
    align-items: center;
    font-feature-settings: "palt";
}

.list-thm li p.th-r {
    text-align: justify;
    color: #000;
    font-size: min(2.8vw,.9rem);
    padding: 4% 0;
    font-feature-settings: "palt";
}

.colx2.rinnai .th-t {
    position: relative;
    display: block;
    background: #786a3e;
    color: #fff;
    font-size: min(5vw,1.4rem);
    padding: 3% 22% 0 0;
    margin: 0% 0 4%;
}

.colx2.rinnai .th-t span {
    position: absolute;
    width: 19%;
    top: -23%;
    right: 3%;
}

.t-02 {
	font-size: min(3.5vw,1.4rem);
	color: #786a3e;
	text-align: center;
}

.cap-01{
	background: no-repeat;
	font-size: 10px;
	color: #333;
	text-align: left;
	display: block;
	line-height: 1.4;
}
.rinnai .cap-01 {
    background: no-repeat;
    font-size: 10px;
    color: #333;
    text-align: right;
}


/* 頁共通
----------------------------*/
.btn-01 {
    display: block;
    width: 38%;
    max-width: 200px;
    margin: 0 auto;
}

.caption-box {
  text-align: center;
  font-size: 0.75rem;
  margin-top: 0.5rem;
  color: #786a3e;
}

.point-tag {
    text-align: center;
    font-size: 0.9rem;
    background-color: #786a3e;
    color: #fff;
    letter-spacing: .05rem;
    margin: 1rem auto 0.5rem;
    font-weight: 500;
    padding: 0 1px;
    max-width: 100px;
}

@media screen and (min-width: 767.9px) {
	.point-tag {
		font-size: 1.0rem;
	}
}

.point-title {
    width: 100%;
    font-size: min(5.5vw,1.4rem);
    text-align: center;
    color: #786a3e;
    line-height: 1.6;
    margin-bottom: 5%;
    display: inline-block;
    padding-bottom: 0.5rem;
}

.point-title.u_line {border-bottom: 1px solid #786a3e;}

.point-text {
    font-size: min(3vw,1rem);
    line-height: 1.8;
    color: #000;
    text-align: justify;
    padding-bottom: 8%;
}

.cap-01 p {
    line-height: 1.3;
    color: #333;
    text-align: justify;
	font-feature-settings: "palt";
    padding: 3% 0;
}

.maxw484 {max-width: 484px;}


/*SP左右スクロール
----------------------------*/

.scroll-wrapper {
position: relative;
overflow-x:scroll;
width: 100%;
}

.scroll-container {
width: 200%;
}

.scroll-content {
width: 200%; /* ブラウザ幅の300% */
}

.scroll-content img {
width: 100%;
height: auto;
display: block;
}

#swipe-icon {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
font-size: 2.5rem;
opacity: 1;
transition: opacity 0.6s ease;
pointer-events: none;
z-index: 10;
}

/*.w_80 {max-width: 1100px;}*/
.w_80 {width: 80%!important;}

.capArea.cap-02 {
    width: 100%;
    font-size: 10px;
    color: #333;
    background: none;
}

@media screen and (min-width: 767.9px) {

.bg-01-1 {background: linear-gradient(0deg,rgba(255, 255, 255, 1) 0%, rgba(242, 242, 242, 1) 92%, rgba(255, 255, 255, 1) 92%, rgba(255, 255, 255, 1) 100%);}
.bg-02-1 {background: linear-gradient(0deg,rgba(255, 255, 255, 1) 0%, rgba(242, 240, 236, 1) 91%, rgba(255, 255, 255, 1) 91%, rgba(255, 255, 255, 1) 100%);}
.bg-01-2 {background: linear-gradient(0deg,rgba(255, 255, 255, 1) 0%, rgba(242, 242, 242, 1) 89%, rgba(255, 255, 255, 1) 89%, rgba(255, 255, 255, 1) 100%);}
.bg-02-2 {background: linear-gradient(0deg,rgba(255, 255, 255, 1) 0%, rgba(242, 240, 236, 1) 89%, rgba(255, 255, 255, 1) 89%, rgba(255, 255, 255, 1) 100%);}

.bg-02-2 {margin-bottom: 3%;}

.mb_5 {margin-bottom: 3%;}
.mb_8 {margin-bottom: 4%;}
.mb_10 {margin-bottom: 2%;}
.mb_15 {margin-bottom: 5rem;}
.mb_20 {margin-bottom: 4%;}

.p_4 {padding: 1% 4%;}
.pr_6 {padding-right: 6%!important;}
.pb_6 {padding-bottom: 1%;}
.pb_10 {padding-bottom: 0;}
.pb_20 {padding-bottom: 10%;}


/*fonts
---------------------------*/

h3 {
    max-width: 120px;
    margin: 5% auto 2%;
    font-size: 1.2rem;
}
h8 {
    font-size: min(5.5vw,1.4rem);
    padding: 0.5%;
    margin-bottom: 4%;
}

/* カラムレイアウト
---------------------------*/

.wrap_col {
    justify-content: center;
    align-items: flex-start;
}

.wrap_col > * {
    margin: 1% 3%;
    width: 44%;
}

.col_box_pc {
	display: flex;
	flex-wrap: wrap;
}

.col_box_pc > * {
	width: 48%;
	margin: 1%;
}

/*.col-01 dl {width: 45%;}*/

.col-02 {
    justify-content: center;
    align-items: center;
    margin: 3% auto 15%;
}
.col-02 figure {width: 30%;}
.col-02 dl {width: 64%;}
.col-02 dt {
    width: 33%;
    padding-bottom: 6%;
}

.list-thm {justify-content: flex-start;}

.list-thm li {
    width: 22%;
    margin: 0 1.5% 4%;
}

.list-thm.btm-h {margin-bottom: 5%;}

.list-thm li.colx2 {width: 47%;}
  .-nomb{
    margin-bottom: 0 !important;
  }
.list-thm li p.th-r {letter-spacing: .0rem;}

  .child-mv__text{
    width: 270px;
  }

.point-title.u_line {margin-bottom: 2%;}
.point-text {padding-bottom: 3%;}

/*.btn-01 {margin: 0 auto 5%;}*/
.btn-02 {margin: 0 auto 6%;}

.scroll-box {
    width: 85%;
    margin: 0 auto 2%;
}

/*全頁共通
-----------------------------*/
section {padding-bottom: 1%;}
.sec02 {
    margin-bottom: 16%;
    margin-top: 0%;
}
.colx2.rinnai .th-t {padding: 2% 22% 0 0;}
.colx2.rinnai .th-t span {
    width: 15%;
    top: -30%;
}

.mb4_pc {margin-bottom: 4%;}

/*セクション
------------------------*/
.sec01 {margin: 5% auto 0;}
.sec02 {
    margin-bottom: 7%;
    border-bottom: 1px solid #000;
}
.wrap_ttl01 {width: 100%; margin-bottom: 50px;}
}


/* アコーディオン
------------------------------------------*/
.accordion-wrapper {
}

.accordion-btn {
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
}

.accordion-btn img {
  display: block;
  width: auto;
  height: auto;
  max-width: 100%;
}

.accordion-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.5s ease;
}

.accordion-content.open {
  max-height: 1000px; /* 内容に応じて調整 */
}

.accordion-inner {margin-top: 13%;}

@media screen and (min-width: 767.9px) {
.accordion-inner {margin-top: 0%;}
.accordion-content.open {margin-bottom: 5%;}
}

/* 250625 add */

.add-01 h2 {
    background: #786a3e;
    color: #fff;
    padding: 3% 0;
}

.col-03 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 86%;
    max-width: 1100px;
    margin: 12% auto 3%;
}

.col-03 li {
	display: flex;
	width: 100%;
	margin-bottom: 7%;
}

.col-03 li.rev {flex-flow: row-reverse;}

.col-03 > li > figure {width: 60%;}
.col-03 > li > p {
    width: 40%;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #786a3e;
    color: #fff;
    font-size: min(4vw,1.5rem);
    text-align: center;
}

.col-03 li .list-thm {
    width: 100%;
    justify-content: space-between;
    align-items: flex-end;
}

.col-03 li .list-thm li {
    width: 46%!important;
    margin: 0 0 7%;
    display: block!important;
}

.ytCont{
	margin: 40px auto;
	aspect-ratio: 16 / 9;
	padding:0 20px;
}
.ytCont iframe{
	width: 100%;
	height: 100%;
}
.qua-video{
	width: 94%;
	margin: -20px auto 40px;
}
.qua-video video{
	width: 100%;
}

@media screen and (min-width: 767.9px) {
.add-01 h2 {padding: 1% 0;}

.col-03 {
	width: 100%;
	margin: 6% auto 1%;
}

.col-03 li {
	width: 47%;
}
.col-03 li.rev {flex-flow: row;}
.ytCont{
	max-width: 700px;
	margin: 100px auto;
	aspect-ratio: 16 / 9;
}
.ytCont iframe{
	width: 100%;
	height: 100%;
}
.qua-video{
	max-width:700px ;
	margin: -20px auto 80px;
}
}