#content > section {
	width: 100%;
	color: #3F1825;
}
#content > section .inn {
	width: 1200px;
	max-width: 100%;
	margin-left: auto;
	margin-right: auto;
	min-height: 1%;
}
#content > section .inn p {
	line-height: 1.8;
}
p.btn {
	margin-top: 40px;
	text-align: center;
	display: block;
}
p.btn a {
	display: inline-block;
	font-size: 22px;
	font-size: 2.2rem;
	padding: 2rem 8rem;
	position: relative;
	background: #eb6082;
	color: #FFF;
	border: solid 1px #FFF;
}
p.btn a:hover {
	border: solid 1px #E65F5F;
	background: #FFF;
	color: #F4A4A6;
	transition: 1s;
	text-decoration: none;
}
p.btn a::after {
  content: '';
  width: 8px;
  height: 8px;
  border: 0px;
  border-top: solid 3px #FFF;
  border-right: solid 3px #FFF;
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  top: 50%;
  right: 15px;
  margin-top: -4px;
}
p.btn span {
	display: block;
	font-size: 17px;
	font-size: 1.7rem;
	margin-top: 5px;
}
.pc {display: block !important;}
.sp {display: none !important;}
sup {
	font-size: 10px;
	font-size: 1.0rem;
}
dd{
	margin-bottom: 0!important;
}
@media screen and (max-width: 810px){
}
@media screen and (max-width: 767px) {	
	.pc {display: none !important;}
	.sp {display: block !important;}	
	p.btn {margin: 40px 10px 0;}
	p.btn a {
		font-size: 2.0rem;
		padding: 2rem 0;
		width: 100%;
	}
}
/*----------------------------------
MAIN AREA
------------------------------------*/
#mainArea {
	position: relative;
	padding: 10px 0 0;
}
#mainArea img {
	width: 100%;
}
#mainArea .txt {
	margin: 40px 0;
}
#mainArea .txt p {
	text-align: center;
	font-size: 20px;
	font-size: 3.6rem;
	line-height: 1.5 !important;
	color: #FF6687;
}
#mainArea .txt p span.sub_text {
	font-size: 28px;
}
#mainArea .txt p span.marker {
	background: linear-gradient(
		transparent 70%,
		#FDF2F5 70%
	);
}
#mainArea .txt p.item_text {
	color: #3F1825;
}
#mainArea .txt p.kome {
	font-size: 13px;
	font-size: 1.3rem;
	line-height: 1.6 !important;
	margin-top: 30px;
}
.marker {
	font-weight: bold;
	background: linear-gradient(transparent 60%, #F9D4DA 60%);
}


.media-layout {
  display: flex;
  gap: 40px;
  justify-content: space-evenly;
  align-items: center;
  max-width: 1200px;
  margin: -64px auto 40px;
}
/* 左：メイン画像 */
.media-main {
  flex: 0 0 246px; /* 幅目安 */
}
.img-main {
  width: 100%;
  max-width: 246px;
}
/* 右側 */
.media-side {
	max-width: 748px;
	flex: 1;
	margin: 80px 0 0;
}
/* サムネ一覧 */
.thumb-list {
  display: flex;
  gap: 24px;
  margin-bottom: 20px;
  padding: 0;
  list-style: none;
}
.thumb-list li {
  position: relative; /* 注釈番号の基準 */
}

/* 注釈番号 */
.thumb-list .note {
  position: absolute;
  top: -0.5em;   /* 画像の少し上 */
  right: 0;      /* 右寄せ */
  font-size: 10px;
  line-height: 1;
}
.img-box {
  display: flex;
  align-items: center;
  justify-content: center;
}
.img-thumb {
	width: 100%;
	 max-width: 160px;
}

/* 注意書き */
.notes p {
max-width: 95%;
  font-size: 10px;
  line-height: 1.5;
  margin: 40px auto 40px;
}

@media screen and (max-width: 810px){
	#mainArea .txt {
		margin: 40px 20px;
	}
}
@media screen and (max-width: 767px) {
	#mainArea {
		padding: 0;
	}
	#mainArea .txt {
		margin: 30px 20px 0;
	}
	#mainArea .txt p {
		text-align: center;
		font-size: 2rem;
		line-height: 1.5 !important;
		letter-spacing: -0.05em;
	}
	#mainArea .txt p span.sub_text {
		font-size: 1.7rem;
	}
	#mainArea .txt p span.marker {
		background: linear-gradient(
			transparent 70%,
			#FDF2F5 70%
		);
	}
	#mainArea .txt p.item_text {
		color: #3F1825;
	}
	#mainArea .txt p.kome {
		font-size: 1.1rem;
		margin-top: 10px;
	}




	/* 全体を2カラムにする */
	.media-layout {
		display: grid;
		grid-template-columns: 4fr 6fr;
		gap: 16px;
		align-items: start;
		margin: 40px 0 0;
		padding: 0 20px;
	}
	/* 左：メイン画像 */
	.media-main {
		width: 100%;
		max-width: none;
		margin: 0;
	}
	.img-main {
		max-width: 100%;
		padding: 0;
	}
	/* 右：サムネ＋注釈 */
	.media-side {
		margin: 0;
		padding: 0;
	}

	/* サムネは2×2（SP） */
	.thumb-list {
		display: flex;
		flex-wrap: wrap;   /* ← これがないと1段になる */
		gap: 16px;
		margin-top: 12px;
	}
	.thumb-list li {
		width: calc(50% - 8px); /* 2カラム */
		box-sizing: border-box; /* 念のため */
	}

	.thumb-list .note {
		position: absolute;
		top: -0.2em;
		right: 0;
		font-size: 8px;
		line-height: 1;
	}
	/* 注釈テキストは下に回す */
	.notes p {
		max-width: 100%;
		width: 100%;
		grid-column: 1 / -1;
		margin-top: 20px;
		padding: 0 20px;
		font-size: 8px !important;
		line-height: 1.5 !important;
	}

}

/*----------------------------------
SECONDARY AREA
------------------------------------*/
#secondaryArea > div > h2 {
	text-align: center;
	position: relative;
}
#secondaryArea > div > h2 span {
	font-size: 25px;
	font-size: 2.5rem;
	font-weight: bold;
	background: #eb6082;
	color: #FFF;
	padding: 10px 30px;
	display: inline-block;
	border-radius: 50vh;
	position: relative;
	z-index: 10;
	
}
#secondaryArea > div > h2::after {
	content: "";
	border-top: dotted 4px #eb6082;
	width: 100%;
	height: 1px;
	position: absolute;
	top:50%;
	left: 0;
	z-index: 1;
}
#secondaryArea > div > h3 {
	font-size: 30px;
	font-size: 3.0rem;
	line-height: 1.5;
	color: #eb6082;
	text-align: center;
	margin-top: 30px;
}
#secondaryArea .flex,
#secondaryArea .flex03 {
	display: flex;
	justify-content: space-around;
	margin-top: 40px;
}
#secondaryArea .flex02 {
	display: flex;
	justify-content: space-evenly;
	margin-top: 40px;
}
#secondaryArea .flex > div.txt {
	width: 40%;
}
#secondaryArea .flex > div.txt p,
#secondaryArea > div > p,
#secondaryArea .flex > div.txt ul li,
#secondaryArea .flex02 p {
	font-size: 18px;
	font-size: 1.8rem;
	text-align: justify;
	margin-bottom: 20px;
	line-height: 1.8;
}
#secondaryArea > div > p {margin: 40px 40px 0;}
#secondaryArea .flex > div.txt p.kome {
	font-size: 13px;
	font-size: 1.3rem;
}
#secondaryArea .flex > div.txt ul li::before {
    content:  "";
    width:  12px;
    height:  12px;
    display:  inline-block;
    background-color: #9A72AF;
    border-radius:  50%;
	margin-left: -17px;
	margin-right: 5px;
}
#secondaryArea .flex > div.pic {
	width: 50%;
	text-align: center;
}
#secondaryArea .flex > div.pic img,
#secondaryArea .flex > div.txt p img {
	max-width: 500px;
	width: 100%;
}
#secondaryArea > div > h2:nth-of-type(2),
#secondaryArea > div > h2:nth-of-type(3) {
	margin-top: 50px;
}
#secondaryArea > div > h2:nth-of-type(2) span {
	background: #9A72AF;
	
}
#secondaryArea > div > h2:nth-of-type(2)::after {
	border-top: dotted 4px #9A72AF;
}
#secondaryArea > div > h3:nth-of-type(2) {
	color: #9A72AF;
}
#secondaryArea > div > h2:nth-of-type(3) span {
	background: #9DC92A;
}
#secondaryArea > div > h2:nth-of-type(3)::after {
	border-top: dotted 4px #9DC92A;
}
#secondaryArea > div > h3:nth-of-type(3) {
	color: #9DC92A;
}
#secondaryArea .flex02 div {
	width: 40%;
	margin-top: 20px;
}
#secondaryArea .flex02 div img {
	width: 100%;
}
#secondaryArea .flex02 div p:last-of-type {text-align: center;}
#secondaryArea .flex02 div:nth-of-type(2) img {width: 100%;}
#secondaryArea .flex02 div h3 {
	font-size: 22px;
	font-size: 2.2rem;
	text-align: center;
	padding: 10px;
	border-top: solid 1px #3f1825;
	border-bottom: solid 1px #3f1825;
	margin-bottom: 20px;
}

@media screen and (max-width: 810px){
}
@media screen and (max-width: 767px) {
	#secondaryArea {margin-top: 30px;}
	#secondaryArea > div > h2 span {
		font-size: 2.0rem;
	}
	#secondaryArea > div > h2::after {
		border-top: dotted 2px #eb6082;
	}
	#secondaryArea > div > h2:nth-of-type(2),
	#secondaryArea > div > h2:nth-of-type(3) {margin-top: 20px;}
	#secondaryArea > div > h2:nth-of-type(2)::after {
		border-top: dotted 2px #9A72AF;
	}
	#secondaryArea > div > h2:nth-of-type(3)::after {
		border-top: dotted 2px #9DC92A;
	}
	#secondaryArea > div > h3 {
		font-size: 2.0rem;
		margin-top: 15px;
	}
	#secondaryArea .flex {
		flex-direction: column-reverse;
		margin-top: 25px;
	}
	#secondaryArea .flex {
		padding: 0 20px;
	}
	#secondaryArea .flex > div.txt {
		width: 100%;
		margin-top: 20px;
	}
	#secondaryArea .flex > div.txt p,
	#secondaryArea > div > p,
	#secondaryArea .flex > div.txt ul li,
	#secondaryArea .flex02 p {
		font-size: 1.5rem;
	}
	#secondaryArea > div > p {margin: 30px 20px 0;}
	#secondaryArea .flex > div.txt ul {
		margin-left: 17px;
	}
	#secondaryArea .flex > div.pic {
		width: 100%;
	}
	#secondaryArea .flex:nth-of-type(4) {
		flex-direction: column;
	}
	#secondaryArea .flex:nth-of-type(4) > div.txt {
		margin-top: 0;
	}
	#secondaryArea .flex:nth-of-type(4) > div.pic {
		margin-top: 20px;
	}
	#secondaryArea .flex02 {
		flex-direction: column;
		margin-top: 10px;
	}
	#secondaryArea .flex02 div {
		width: 100%;
		margin-top: 10px;
		text-align: left;
	}
	#secondaryArea .flex02 div img {
		width: 100%;
	}
	#secondaryArea .flex02 div:nth-of-type(2) img {width: 100%;}
	#secondaryArea .flex02 div h3 {
		font-size: 1.8rem;
		margin: 0 20px 20px;
	}
	#secondaryArea .flex02 div p:first-of-type {
		margin: 0 20px 20px;
	}
}

/*----------------------------------
THIRDARY AREA
------------------------------------*/
#thirdaryArea h2 {
	font-size: 35px;
	font-size: 3.5rem;
	text-align: center;
	padding: 20px 0;
	border-top: solid 1px #3F1825;
	border-bottom: solid 1px #3F1825;
	margin-top: 50px;
}
#thirdaryArea dl {
	display: flex;
	margin: 60px 0 0;
	flex-wrap: wrap;
	font-size: 17px;
	font-size: 1.7rem;
}
#thirdaryArea dl dt {
	width: 30%;
	color: #eb6082;
	font-weight: bold;
	border-bottom: dotted 1px #3F1825;
	padding: 30px 0 30px 50px;
}
#thirdaryArea dl dd {
	line-height: 1.8;
	width: 70%;
	border-bottom: dotted 1px #3F1825;
	padding: 30px 0;
}
#thirdaryArea dl dd ol {margin-left: 20px;}
#thirdaryArea dl dd ol li {
	list-style: decimal;
}
#thirdaryArea .flex03 {
	display: flex;
	justify-content: center;
	margin-top: 40px;
	border-bottom: dotted 1px #3F1825;
    padding: 0 0 40px;
    margin-bottom: -60px;
}
#thirdaryArea .flex03 div {
	width: 40%;
	margin-top: 20px;
}
#thirdaryArea .flex03 div img {
	width: 100%;
}
#thirdaryArea .flex03 div p:last-of-type {text-align: center;}
#thirdaryArea .flex03 div:nth-of-type(2) img {width: 100%;}
#thirdaryArea .flex03 div h3 {
	font-size: 22px;
	font-size: 2.2rem;
	text-align: center;
	padding: 10px;
	border-top: solid 1px #3f1825;
	border-bottom: solid 1px #3f1825;
	margin-bottom: 20px;
}
#thirdaryArea .flex03 > div.pic {
	width: 25%;
	text-align: center;
}
#thirdaryArea .flex03 > div.pic img,
#thirdaryArea .flex03 > div.txt p img {
	max-width: 332px;
	width: 50%;
	margin: 0 0 20px;
}
#thirdaryArea .flex03 > div p.item_text {
	font-size: 1.7rem;
	line-height: 1.7;
}

@media screen and (max-width: 767px) {
	#thirdaryArea .flex03 {
		display: flex;
		justify-content: center;
		margin: 20px 20px -20px;
		padding: 0 0 20px;
		margin-bottom: 0;
	}
	#thirdaryArea h2 {
		font-size: 2.0rem;
	}
	#thirdaryArea dl {
		display: block;
		margin: 20px 0 0;
		font-size: 1.5rem;
		padding: 0 20px;
	}
	#thirdaryArea dl dt {
		font-size: 1.8rem;
		width: 100%;
		border-bottom: none;
		padding: 15px 0 10px 0;
		text-align: center;
	}
	#thirdaryArea dl dd {
		width: 100%;
		padding: 15px 0;
	}
	#thirdaryArea .flex03 > div.pic {
		width: 33.3%;
	}
	#thirdaryArea .flex03 > div.pic img, #thirdaryArea .flex03 > div.txt p img {
		width: 90%;
	}
	#thirdaryArea .flex03 > div p.item_text {
		font-size: 1.2rem;
		line-height: 1.5;
	}
}

/*----------------------------------
FOURDARY AREA
------------------------------------*/
#fourdaryArea {
	background: #E6E6E6;
	margin-top: 50px;
	padding: 40px 0;
}
#fourdaryArea .inn {
	background: #FFF;
	padding: 40px;
}
#fourdaryArea h2 {
	font-weight: bold;
}
#fourdaryArea .terms {
  max-height: 415px;
  overflow-y: auto;
  padding: 40px;
  border: 1px solid #ddd;
  font-size: 14px;
  line-height: 1.6;
  background: #fff;
}
#content > section#fourdaryArea h2 {
	font-size: 20px;
	font-size: 2.0rem;
	margin-top: 0;
	text-align: center;
}
#fourdaryArea ul {
	margin: 40px 80px 0;
}
#fourdaryArea ul li {
	font-size: 14px;
	font-size: 1.4rem;
	list-style: disc;
	line-height: 1.8;
	margin-bottom: 15px;
}
#fourdaryArea div {
	font-size: 14px;
	font-size: 1.4rem;
	line-height: 1.8;
	margin: 40px 80px 0;
	margin-bottom: 15px;
}
#fourdaryArea h4 {
	margin: 0;
	font-weight: bold;
}
#fourdaryArea a {
	color: #F49090;
}
#fourdaryArea a:hover {
	text-decoration: underline;
}

@media screen and (max-width: 767px) {
	#fourdaryArea {
		padding: 40px 20px 40px;
	}
	#fourdaryArea .inn {
		padding: 20px 0;
	}
	#fourdaryArea .terms {
		max-height: 240px;
		overflow-y: auto;
		padding: 20px 0;
		border: 1px solid #ddd;
		font-size: 14px;
		line-height: 1.6;
		background: #fff;
	}
	#content > section#fourdaryArea h2 {
		margin-bottom: 20px;
	}
	#content > section#fourdaryArea h2::before {
		display: none;
	}
	#content > section#fourdaryArea h2::after {
		display: none;
	}
	#fourdaryArea ul {
		margin: 20px 30px 0 0;
	}
	#fourdaryArea ul li {
		font-size: 1.2rem;
		text-align: justify;
		margin-left: 20px;
	}
	#fourdaryArea div {
		margin: 0 30px 0 0;
		font-size: 1.2rem;
		text-align: justify;
		margin-left: 20px;
	}
}
