@charset "UTF-8";

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

figure {position: relative;}
figure figcaption {
    position: absolute;
    bottom: 4px;
    right: 4px;
    font-size: 10px;
		color: #000;
		text-shadow: 0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff;
}

figure figcaption.-w{
	color: #FFF;
	text-shadow: 0 0 3px #000,0 0 3px #000,0 0 3px #000,0 0 3px #000,0 0 3px #000,0 0 3px #000,0 0 3px #000;
}
.bg_gold {
    padding: 13% 0 8%;
    background: #786a3e!important;
    margin-bottom: 17%;
}
.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;}
.mb_8 {margin-bottom: 8%!important;}
.mb_10 {margin-bottom: 10%!important;}

.mb_20 {margin-bottom: 20%!important;}
.mb_12 {margin-bottom: 12%!important;}
/*fonts
---------------------------*/

h2 {
	margin: 6% auto 0;
    font-size: 1.2rem;
    letter-spacing: .1rem;
}

h2.-mt{
	margin-top: 10%;
}

h2.h2-01 {
    font-size: min(8.5vw,2rem);
    letter-spacing: .1rem;
}

.sec03 h2 {padding: 10% 0 3%;}

.sec03 h2 span {
    display: block;
    width: 80%;
    margin: -1% auto auto;
    border-top: 1px solid #000;
    text-align: center;
    font-size: 50%;
    padding-top: 1%;
}

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


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

h4 span.line01 {
    display: block;
    background: #fff;
	height: 1px;
	width: 100%;
	margin: 1% auto;
}

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

h8 {
    display: block;
    width: 86%;
    margin: 0 auto 7%;
    font-size: min(4.5vw,1.4rem);
    padding: .5%;
    background: #84774f;
    color: #fff;
    text-align: center;
    letter-spacing: .2rem;
}

.h-01 {
    display: block;
    width: 100%;
    margin: 0 auto 5%;
    font-size: min(5.5vw,1.4rem);
    padding: 4.5% 0;
    background: #84774f;
    color: #fff;
    text-align: center;
}

.h-01 p {
    width: 80%;
    max-width: 550px;
    margin: auto;
}

.h-02 {
    max-width: 460px;
    width: 84%;
    margin: 0 auto 3%;
}

.t-01 {
	font-size: min(3vw,1.2rem);
	text-align: left;
}

.u_line01 {
	border-bottom: 1px solid #000;
}

.wrap_col02 > div p {
	width: 80%;
}
.wrap_col02 dt, .wrap_col02 dd {
	text-align: center;
	color: #000;
}

.wrap_col02 dd span {
	font-size: 130%;
	padding-left: 2%;
}

.ltbox-01 {
	position: relative;
}

.ltbox-01 .z-cap {
	position: absolute;
	bottom: 0;
	right: 0%;
	font-size: 11px;
	color: #666;
}

/*カラムレイアウト
---------------------------*/
.wrap_col > * {
    width: 36%;
    margin-bottom: 5%;
}
.wrap_col li figcaption {
	text-align: center;
	font-size: 11px;
	padding-top: 2%;
}

.scroll-box {margin-bottom: 20%;}
.scroll-box > img {width: 230vw;}


/* 頁共通
----------------------------*/
.btn-01 {
    width: 40%;
    max-width: 170px;
    margin: 0 auto 10%;
}

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

.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-box {
	width: 100%;
	margin: 0 auto 18%;
}

.scroll-box img {
	padding-bottom: 4%;
}

.scroll-box::-webkit-scrollbar {
  height: 6px;
}

.scroll-box::-webkit-scrollbar-track {
  border-bottom: 1px solid #bcb08f;
  height: 1px;
}

.scroll-box::-webkit-scrollbar-thumb {
  background-color: #bcb08f;
}

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

.zoom-icon {top:-7%;}


@media screen and (min-width: 767.9px) {
h2 {
    margin: 10% auto 4%;
    font-size: 2.2rem;
}
.sec03 h2 {padding: 5% 0 3%;}
.h-01 {
    width: 100%;
    margin: 0 auto 3%;
    padding: 1.5%;
}
h2.h-03 {margin: 5% auto 4%;}
h2.h2-01 {
    font-size: min(8.5vw,3rem);
    margin-bottom: .5%;
}

.bg_gold {
    padding: 4% 0;
    margin-bottom: 8%;
}

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

.mb_5 {margin-bottom: 6%!important;}
.mb_8 {margin-bottom: 4%!important;}
.mb_10 {margin-bottom: 10%!important;}
.mb_15 {margin-bottom: 5%!important;}
.mb_20 {margin-bottom: 9%!important;}
.mb_4_pc {margin-bottom: 4%!important;}
.mb_9_pc {margin-bottom: 9%!important;}

.p_4 {padding: 1% 4%;}
.pb_6 {padding-bottom: 1%;}
.pb_10 {padding-bottom: 6%;}
.pb_20 {padding-bottom: 10%;}


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

.sec03 h2 {padding: 6% 0 3%;}
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%;
}
.sec03 .t-01 {font-size:1rem;}

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

.wrap_col {
    justify-content: center;
    align-items: flex-start;
}
.wrap_col > * {
    width: 27%;
    margin-bottom: 5%;
    margin: 3%;
}

.wrap_col02 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
    align-items: center;
    margin:0 auto;
    max-width: 800px;
    padding-bottom: 3%;
}

.wrap_col02 figure {
	width: 30%;
	margin: 0;
}
.wrap_col02 > div {
	width: 66%;
	margin: 0;
}
.wrap_col02 > div dl {
	width: 100%;
	margin-left: 3%;
}
.wrap_col02 dt, .wrap_col02 dd {text-align: left;}
.wrap_col02 dd span {font-size: 160%;}
.wrap_col02 > div p {
	display: block;
	width: 100%;
	margin-left: 3%;
	text-align: justify;
}

.bg_gold .pc-col {align-items: center;}
.bg_gold .pc-col p {text-align: left!important;}

.child-mv__text{
    width: 220px;
}

.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: 5% auto 12%;
}

/*全頁共通
-----------------------------*/
section {padding-bottom: 1%;}


/*セクション
------------------------*/
.sec01 {margin: 0 auto;}
.sec02 {margin-bottom: 6%;}
.wrap_ttl01 {width: 100%; margin-bottom: 50px;}


}

.thumbnail.-active{
	animation:reduce 3s cubic-bezier(0.25, 1, 0.5, 1) forwards;
}

.perthMv{
	width: 100%;
}

.perthMv video{
	width: 100%;
}

.perthMv .mvCap{
	font-size:10px;
	color: #333;
	text-align: right;
	padding-right: 10px;
}