@charset "UTF-8";

@keyframes fadeIn {
	0%{
		opacity: 0;
	}
	100%{
		opacity: 1;
	}
}
@keyframes SlideUp {
	0% {
		opacity: 0;
		transform: translateY(50%);
	}
	100% {
		opacity: 1;
		transform: translateY(0);
	}
}

.c-invitationPage{
	color: #333;
	overflow: hidden;
}
.c-invitationSec--title {
	position: relative;
	padding: 0;
}
.c-invitationSec--title__ttl {
    width: 100%;
    max-width: 800px;
    padding: 2rem 0 0;
}
.title-triangle-top-left {
	position: absolute;
	top: -25%;
	left: 0;
	width: 42vw;
	height: 145vw;
	max-width: 350px;
	max-height: 1208px;
	clip-path: polygon(0 0, 0% 100%, 100% 100%);
	background: url(bgpattern.jpg) repeat;
	animation: SlideUp 2s ease-in-out 1s 1 normal both;
}
.title-hexagon-top-right {
	position: absolute;
	top: -7.5%;
	right: -20%;
	width: 45vw;
	height: 40vw;
	max-width: 420px;
	max-height: 380px;
	clip-path: polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%);
	background-color: #f7f5ed;
	animation: SlideUp 2s ease-in-out 2s 1 normal both;
}
.title-hexagon-bottom-left {
	position: absolute;
	bottom: -5%;
	left: 22.5%;
	width: 45vw;
	height: 40vw;
	max-width: 420px;
	max-height: 380px;
	clip-path: polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%);
	background-color: #efe3ce;
	animation: fadeIn 2s ease-in-out 9s 1 normal both;
}
.c-invitationSec--title__img01Wra_anime{
	width: 100%;
	max-width: 800px;
}
.c-invitationSec--title__img01Wrap {
	right: -20%;
	margin: 5rem auto;
    clip-path: polygon(20% 0, 80% 0, 80% 50%, 80% 100%, 20% 100%, 0 50%);
	position: relative;
	animation: fadeIn 2s ease-in-out 8s 1 normal both;
}
.c-invitationSec--title__name{
	font-family: "font1";
	font-size: 2.6rem;
	animation: fadeIn 2s ease-in-out 6s 1 normal both;
}
.c-invitationSec--title__date{
	font-family: "font1";
	margin-bottom: 0;
	font-size: 1.4rem;
	animation: fadeIn 2s ease-in-out 7s 1 normal both;
}
.c-invitationSec--invTxt {
	margin-top: -8rem;
	margin-bottom: 0;
	position: relative;
}
.c-invitationSec--invTxt__top {
	width: 15%;
    max-width: 100px;
    margin: 0 auto 3rem 3rem;
	position: relative;
}
.invTxt-circle-top-left {
	position: absolute;
	width: 25vw;
	height: 25vw;
	max-width: 200px;
	max-height: 200px;
	border-radius: 50vw;
	background-color: #e8e6df;
	top: -8rem;
    left: -6rem;
	z-index: -1;
}
.c-invitationSec--invTxt__middle {
	position: relative;
}
.invTxt-polygon-top-left {
	position: absolute;
	top: -5%;
	left: -15%;
	width: 45vw;
	height: 40vw;
	max-width: 420px;
	max-height: 380px;;
	clip-path: polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%);
	background-color: #f7f5ed;
	z-index: -1;
}
.c-invitationSec--invTxt__bottom {
	position: relative;
}
.invTxt-triangle-bottom-right {
	position: absolute;
	width: 50vw;
	height: 70vw;
	max-width: 500px;
	max-height: 700px;
	background: url(bgpattern.jpg) repeat;
	clip-path: polygon(100% 0, 0% 100%, 100% 100%);
	right: -3rem;
	bottom : 0;
	z-index: -1;
}
.c-invitationSec--img02 {
	z-index: 1;
}
.c-invitationSec--scheTxt {
	background-color: transparent;
	padding: 4rem 0;
	display: flex;
    margin: 0  2rem;
	z-index: 0;
}
.c-invitationSec--scheTxt__top {
	display: none;
}
.c-invitationSec--scheTxt__ttl {
	width: 15%;
	max-width: 94px;
	order: 2;
	position: relative;
}
.scheTxt-circle-top-right {
	position: absolute;
	top: -4rem;
	right: -3rem;
	width: 30vw;
	height: 30vw;
	max-width: 240px;
	max-height: 240px;
	border-radius: 50vw;
	background-color: #e8e6df;
	z-index: -3;
}
.c-invitationSec--scheTxt__bottom {
	position: relative;
}
.scheTxt-triangle-bottom-right {
	position: absolute;
	bottom: -5rem;
	left: -3rem;
	width: 35vw;
	height: 50vw;
	max-width: 300px;
	max-height: 450px;
	clip-path: polygon(0 0, 0% 100%, 100% 100%);
	background: url(bgpattern.jpg) repeat;
	z-index: -1;
}
.c-invitationSec--invTxt__middle,
.c-invitationSec--scheTxt__middle,
.c-invitationSec--toReply__txt,
.c-invitationSec--caption__txt {
	text-align: left;
}
.c-invitationSec--invTxt__middle,
.c-invitationSec--scheTxt {
	margin-left: 0;
	margin-right: 0;
	padding: 5rem 3rem;
}
.c-invitationSec--caption {
	margin-left: 0;
	margin-right: 0;
	padding: 5rem 3rem 0;
}
.c-invitationSec--scheTxt__middle {
	width: 100%;
	margin: 0;
	order: 1;
}
.c-invitationSec--toReply {
	margin-left: 0;
	margin-right: 0;
    padding: 0 3rem;
	position: relative;
}
.toReply-triangle-top-right {
	position: absolute;
	top: -4rem;
	right: -3rem;
	width: 25vw;
	height: 40vw;
	max-width: 200px;
  	max-height: 380px;
	clip-path: polygon(100% 0, 0 0, 100% 100%);
	background: url(bgpattern.jpg) repeat;
	z-index: -1;
}
.c-invitationSec--caption {
	border-color: #b78d39;
}
.c-buttonL,
.c-invitationSec--repForm .c-radioBtn{
    border-color: #b78d39;
	background-color: #fff;
}

/* プロフィール */
.c-invitationSec--profile__deco {
    width: 22%;
}