@import url("https://fonts.googleapis.com/css2?family=Cormorant:ital,wght@0,300..700;1,300..700&display=swap");
#container .lead { line-height: 2; }
#container.contents-bg { background: none; }

/*.main-wrap{
	position: relative;
	.note{
		text-align: right; box-sizing: border-box; padding: 0.5rem 1rem; background: rgba(0, 0, 0, 0.5); color: #fff; font-size: 1.1rem; position: absolute; z-index: 2; bottom: 0;
		right:0;
	}
}*/
.main-area { padding-bottom: 20vh; }

.page-main { position: relative; }

.main-copy-area { position: absolute; top: 0; left: 0; width: 100%; height: 100%; color: #fff; text-align: center; }
.main-copy-area .line { display: block; max-width: 25rem; width: 90%; height: 1px; background-color: #fff; margin: 0.75rem 0 3rem; transform: scaleX(0%); }
.main-copy-area .sttl { font-size: 2.3rem; font-feature-settings: "palt" 1; letter-spacing: 0.4em; line-height: 1.5; opacity: 0; }
.main-copy-area .sttl .aw { display: inline-block; }
.main-copy-area .sttl.en { font-size: 1.7rem; letter-spacing: 0.5em; opacity: 0; }
.main-copy-area .copy { font-size: 1.75rem; line-height: 2; letter-spacing: 0.2em; }
.main-copy-area .main-copy-cls { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: flex; flex-direction: column; justify-content: flex-start; align-items: center; opacity: 0; width: 90%; transition: opacity 0.3s linear 0s; }
.main-copy-area .main-copy-cls.active { opacity: 1; }
@media screen and (max-width: 600px) { .main-copy-area .line { margin: 1rem 0 3rem; }
  .main-copy-area .sttl { letter-spacing: 0.2em; line-height: 1.5; } }

.bg-white { width: 100%; position: relative; background-color: #fff; }
.bg-white .inner { position: relative; }
.bg-white.contents-bg { background: url("../images/common/contents-bg.jpg") center top; background-size: cover; }

.plan-list ul { display: flex; flex-wrap: wrap; align-items: flex-start; padding-top: 5rem; padding-bottom: 10rem; }
.plan-list ul li { width: 48%; margin-right: 4%; margin-top: 2.5rem; }
.plan-list ul li:nth-child(2n) { margin-right: 0; }
.plan-list ul li a { display: block; position: relative; background: #a4925b; cursor: pointer; }
.plan-list ul li a img { width: 100%; height: auto; position: relative; z-index: 1; }
.plan-list ul li a:after { content: ""; position: absolute; z-index: 0; top: 0; left: 0; bottom: 0; right: 0; background: linear-gradient(to bottom, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0)); opacity: 0; transition: 0.5s opacity; }
.plan-list ul li a:hover:after { opacity: 1; }
@media screen and (max-width: 600px) { .plan-list ul li { width: 100%; margin-right: 0; } }

.plan-entry { border-top: 3px solid #ae9552; border-bottom: 3px solid #ae9552; position: relative; padding: 5rem 0 6rem; }
.plan-entry:before { content: ""; position: absolute; z-index: 0; top: 1rem; left: 0; right: 0; bottom: 1rem; border-top: 1px solid #ae9552; border-bottom: 1px solid #ae9552; }
.plan-entry .midashi { text-align: center; letter-spacing: 20%; font-size: 3.4rem; }
.plan-entry .lead { text-align: center; letter-spacing: 20%; margin-top: 3rem; font-size: 2rem; }
.plan-entry .info-btn { margin-top: 3rem; }
.plan-entry .info-btn a { display: block; position: relative; width: 100%; height: 6rem; background: #a8945c; transition: 0.5s filter; max-width: 38rem; margin: auto; }
.plan-entry .info-btn a .bana-txt { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: #fff; }
.plan-entry .info-btn a .bana-txt .kana { font-size: 2rem; display: block; text-align: center; line-height: 1.3; white-space: nowrap; }
.plan-entry .info-btn a:hover { filter: brightness(1.4); }
.plan-entry .info-btn a:before { position: absolute; content: ""; }
.plan-entry .info-btn a:before { width: 1.5rem; height: 1.5rem; border-bottom: 1px solid #fff; border-right: 1px solid #fff; top: 50%; right: 3%; transform: translateX(-50%) translateY(-50%) rotate(-45deg); }

.bels-sec { max-width: 86rem; margin: auto; }
.bels-sec .img { margin: auto; margin-top: 10rem; max-width: 50rem; }
.bels-sec .img .note { position: static; text-align: left; }
.bels-sec .midashi { text-align: center; margin-top: 7rem; }
.bels-sec .lead { margin-top: 4rem; }
.bels-sec .note { /*margin-top: 4rem;*/ }
