/*=================================================
 * CSS for PC
 * ================================================= */

#cnt{
	background: url(../../img/index/line.png) repeat-y top center #eceef0;
}
#platina_info{
	color: #fff;
	text-align: center;
	background: rgb(3,0,0);
	background: linear-gradient(345deg, rgba(3,0,0,1) 0%, rgba(40,18,63,1) 100%);
	margin: 80px 0 0 0;
	padding: 80px 0;
}
#platina_info h3{
	font-size: 0;
	line-height: 0;
	height: 500px;
	background: url(img/platina_info.png) no-repeat top center;
}

#platina_info .p1{
	font-size: 16px;
	line-height: 25px;
	margin: 0 0 30px 0;
}

#platina_info .p2{
	width: 500px;
	font-size: 13px;
	line-height: 20px;
	margin: 0 auto 50px auto;
	padding: 20px 0;
	border: 1px solid #222;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}

#platina_info .btgi:hover{
	background: none;
}


/** pla_mainv **/

header.fixed2+main{	padding-top: 0;}
header {
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.5s ease;
}

header.show {
	opacity: 1;
	visibility: visible;
}
#pla_mainv{
	color: #fff;
	padding: 0 0 80px 0;
	background: #000;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
#pla_mainv .pla_topv{
	position: relative;
	width: 100vw;
	height: 120vh;
	background-image: url(img/toptxt_bg.jpg) ;
}

#pla_mainv .pla_topv::after {
	content: "";
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	background-image: url(img/toptxt_bgc.png?t=0420);
	z-index: 0;
	transform: scale(0.9);
	filter: blur(20px) brightness(1);
	opacity: 0;
	animation: zoomBlur 1s cubic-bezier(0.2, 0.8, 0.2, 1) 0.6s forwards;
}

#pla_mainv .pla_topv,
#pla_mainv .pla_topv::after {
	background-size: auto var(--bg-size, 100%);
	background-position: center center;
	background-repeat: no-repeat;
}

@keyframes zoomBlur {
	0% {
		transform: scale(0.9);
		filter: blur(20px) brightness(1);
		opacity: 0;
	}
	80 {
		transform: scale(1);
		filter: blur(20px) brightness(2);
		opacity: 1;
	}
	100% {
		transform: scale(1);
		filter: blur(0px) brightness(1);
		opacity: 1;
	}
}


#pla_mainv h3{
	position: absolute;
	z-index: 1;
	inset: 0;
	display: inline-block;
	vertical-align: top;
	width: 100%;
	height: 100vh;
	font-size: 0;
	line-height: 0;
	aspect-ratio: 2 / 11;
	background: url(img/toptxt.png?t=0420) no-repeat 50% 50%;
	background-size: auto 90vh;
	filter:
		drop-shadow(0px 0px 10px rgba(0,0,0,0.7))
		drop-shadow(0px 0px 20px rgba(0,0,0,0.7));
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}


#pla_mainv .txt1{
	position: relative;
	font-family: "Sawarabi Mincho";
	text-align: center;
	margin: -20vh 0 50px 0;
	padding: 100px 0 100px 0;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
#pla_mainv .txt1:before,
#pla_mainv .txt1:after{
	content: "";
	width: 1px;
	background: #958e80;
	position: absolute;
	left: 50%;
}
#pla_mainv .txt1:before{
	height: 80px;
	top: 0;
}
#pla_mainv .txt1:after{
	height: 90px;
	bottom: 0;
}
#pla_mainv .txt1 p:nth-of-type(1){
	font-size: 33px;
	line-height: 1.2;
}
#pla_mainv .txt1 p:nth-of-type(2){
	font-size: 60px;
	line-height: 1.2;
	color: #bb9f6a;
}
#pla_mainv .txt1 p:nth-of-type(3){
	font-size: 20px;
	line-height: 1.2;
	color: #bb9f6a;
}
#pla_mainv .txt1 p:nth-of-type(2) br{	display: none;}
#pla_mainv .txt2:before{
	content: "";
	width: 15px;
	height: 15px;
	background: #fff;
	border-radius: 50%;
	box-shadow: 0px 0px 50px #bb9f6a;
	position: absolute;
	top: -50px;
	left: calc(50% - 7px);
	filter: 
	drop-shadow(0 0 20px rgba(187,159,106,1))
	drop-shadow(0 0 20px rgba(187,159,106,0.6))
	brightness(1.4);
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
#pla_mainv .txt2{
	position: relative;
	font-size: 16px;
	line-height: 28px;
	text-align: center;
	margin-bottom: 50px;
}
#pla_mainv .txt2 a{
	display: inline-flex;
	align-items: center;
	align-content: center;
	justify-content: center;
	width: 450px;
	height: 80px;
	font-family: "Sawarabi Mincho";
	font-size: 28px;
	line-height: 30px;
	color: #fff;
	border: 2px solid #bb9f6a;
	border-radius: 5px;
	margin: 0 0 70px 0;
	-webkit-transition	: 0.2s ease-in-out;
	-moz-transition	: 0.2s ease-in-out;
	-o-transition	: 0.2s ease-in-out;
	transition		: 0.2s ease-in-out;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
#pla_mainv .txt2 a:hover{
	text-decoration: none;
	color: #000;
	background: #bb9f6a;
}
.pla_num{
	width: 1200px;
	margin: 0 auto;
}
.pla_numbox{
	display: flex;
	align-items: center;
	align-content: center;
	justify-content: flex-start;
}
.pla_numbox:nth-of-type(even){
	flex-direction: row-reverse;
}
.pla_numbox > div{
	text-align: left;
}
.pla_numbox > div h4{
	display: flex;
	align-items: center;
	align-content: center;
	justify-content: flex-start;
	margin: 0 0 20px 0;
	z-index: 1 !important;
}
.pla_numbox > div h4 span{
	position: relative;
	font-family: "FontA";
	font-size: 150px;
	line-height: 1;
	margin-right: 10px;
	text-shadow: 0px 0px 90px #bb9f6a;
}
.pla_numbox > div h4 span:before,
.pla_numbox > div h4 span:after{
	content: "";
	width: 50px;
	height: 1px;
	background: #bb9f6a;
	position: absolute;
	-webkit-transform: rotate(-45deg);
	   -moz-transform: rotate(-45deg);
	    -ms-transform: rotate(-45deg);
	     -o-transform: rotate(-45deg);
	        transform: rotate(-45deg);
}
.pla_numbox > div h4 span:before{
	top: -25px;
	right: -50px;
}
.pla_numbox > div h4 span:after{
	bottom: -25px;
	left: -50px;
}
.pla_numbox > div h4 em{
	font-family: "Sawarabi Mincho";
	font-size: 32px;
	line-height: 1.2;
	color: #bb9f6a;
}
.pla_numbox > div h4 em i{
	font-style: normal;
	font-size: 86px;
}
.pla_numbox > div p{
	font-size: 16px;
	line-height: 28px;
}
.pla_numbox > img{
	width: 595px;
	height: auto;
}



.kousei{
	color: #333;
	background: none;
}
.kousei div{	margin-bottom: 0;}

.koisei_flex{
	display: flex;
	width: 1100px;
	margin: 0 auto;
	border: 5px solid #e9e1d1;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}

.koisei_flex_l{
	display: inline-flex;
	align-items: center;
	align-content: center;
	justify-content: center;
	width: 295px;
	background: #f2ede3;
}
.koisei_flex_l h3{	margin-bottom: 0;}
.koisei_flex_r{
	position: relative;
	display: inline-flex;
	align-items: center;
	align-content: center;
	justify-content: center;
	width: 795px;
	background: #fff;
	padding: 30px 0;
}
.koisei_flex_r img{
	width: 620px;
	height: auto;
}

.koisei_flex_r .kotxt{
	font-size: 13px;
	line-height: 20px;
	position: absolute;
	left: 350px;
	bottom: 45px;
}


.kbox_bg{
	width: 1130px;
	font-size: 0;
	line-height: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	margin: 0 auto 30px auto;
}

.kbox{
	width: calc(100% / 3 - 30px);
	height: auto;
	text-align: left;
	margin: 0 15px 20px 15px;
	padding: 0 0 30px 0;
	border: none;
	border-bottom: 1px solid #ddd;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}

.kbox h4{
	font-family: "Rounded Mplus 1c";
	font-size: 24px;
	font-weight: 300;
	line-height: 25px;
	color: #b3831d;
	margin: 0 0 15px 0;
	padding: 5px 0 5px 45px;
}

.kbox li{
	font-size: 13px;
	line-height: 16px;
	padding: 2px 0;
}

.kbox li span{
	display: inline-block;
	vertical-align: top;
	font-size: 15px;
	line-height: 20px;
	margin: -2px 2px 0 0;
}
.kbox li .red{	color: #ff0000;}

#platinum .kbox:nth-of-type(1) h4{ background: url(../img/i1.png) no-repeat; -webkit-background-size: 35px auto; background-size: 35px auto;}
#platinum .kbox:nth-of-type(2) h4{ background: url(../img/i2.png) no-repeat; -webkit-background-size: 35px auto; background-size: 35px auto;}
#platinum .kbox:nth-of-type(3) h4{ background: url(../img/i3.png) no-repeat; -webkit-background-size: 35px auto; background-size: 35px auto;}
#platinum .kbox:nth-of-type(4) h4{ background: url(../img/i4.png) no-repeat; -webkit-background-size: 35px auto; background-size: 35px auto;}
#platinum .kbox:nth-of-type(5) h4{ background: url(../img/i5.png) no-repeat; -webkit-background-size: 35px auto; background-size: 35px auto;}
#platinum .kbox:nth-of-type(6) h4{ background: url(../img/i6.png) no-repeat; -webkit-background-size: 35px auto; background-size: 35px auto;}
#platinum .kbox:nth-of-type(7) h4{ background: url(../img/i7.png) no-repeat; -webkit-background-size: 35px auto; background-size: 35px auto;}
#platinum .kbox:nth-of-type(8) h4{ background: url(../img/i8.png) no-repeat; -webkit-background-size: 35px auto; background-size: 35px auto;}
#platinum .kbox:nth-of-type(9) h4{ background: url(../img/i10.png) no-repeat; -webkit-background-size: 35px auto; background-size: 35px auto;}


.fee_pla{
	display: flex;
	width: 1100px;
	margin: 0 auto;
	box-shadow:0px 3px 3px 0px rgba(0, 0, 0, 0.2);
	border-radius: 10px;
}

.fee_pla_l{
	display: inline-flex;
	align-items: center;
	align-content: center;
	justify-content: center;
	width: 300px;
	background: #f5f5f5;
	border-radius: 10px 0 0 10px;
}
.fee_pla_l h3{	margin-bottom: 0;}

.fee_pla_r{
	display: inline-flex;
	align-items: center;
	align-content: center;
	justify-content: center;
	width: 800px;
	background: #fff;
	border-radius: 0 10px 10px 0;
}


/** order **/

.order{
	background: #faf3e5;
	padding: 80px 0 60px 0;
}
.order .price_h3 br.pc_none{	display: none;}
.order .price_h3 em{ 	color:#d1ab59; }
.order p{
	font-size: 16px;
	line-height: 25px;
	text-align: center;
	margin: 40px 0 50px 0;
}


/** pla_sysbox2 **/

.pla_sysbox2{
	margin: 0 auto;
	padding: 40px;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}

.pla_sysbox2 dl{
	display: table;
	font-family: "Sawarabi Mincho";
	table-layout: fixed;
	width: 100%;
	font-size: 0;
	line-height: 0;
	border-left: 1px solid #ccc;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
.pla_sysbox2 dt,
.pla_sysbox2 dd{
	display: table-cell;
	vertical-align: middle;
	text-align: center;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
.pla_sysbox2 dl:first-of-type{
	border-top: 1px solid #ccc;
}
.pla_sysbox2 dl:first-of-type dd:first-of-type,
.pla_sysbox2 dt{	width: 200px;}

.pla_sysbox2 dl:first-of-type dd{
	font-size: 26px;
	line-height: 30px;
	padding: 15px 0;
	color: #333;
	background: #ddd;
}

.pla_sysbox2 dt{
	font-size: 26px;
	line-height: 48px;
	background: #f5f5f5;
}
.pla_sysbox2 dt br{	display: none;}

.pla_sysbox2 dd{
	font-size: 26px;
	line-height: 48px;
	padding: 20px 0;
}
.pla_sysbox2 dd em{
	font-size: 46px;
	font-style: normal;
}

.pla_sysbox2 .camprice{
	color: #ff0000;
}

.pla_sysbox2 .camprice span{
	display: block;
	font-family: Meiryo, "MS PGothic", Osaka, sans-serif;
	font-size: 16px;
	line-height: 1.2;
	font-weight: bold;
}

.pla_sysbox2 .camprice p{
	color: #000;
	font-weight: normal;
	text-decoration: line-through;
	font-size: 20px;
	line-height: 1;
}

.pla_sysbox2 .pla_p1{
	font-size: 20px;
	line-height: 30px;
	margin: 20px 0 0 0;
}
.pla_sysbox2 .pla_p2{
	font-size: 14px;
	font-weight: normal;
	line-height: 30px;
}
.pla_sysbox2 .pla_p2 span{	color: #ff0000;}


.flow h3.f_title{
	font-family: "Sawarabi Mincho";
	font-size: 40px;
	line-height: 50px;
	text-align: center;
	margin-bottom: 20px;
}
.flow h3.f_title span{	color: #d1ab59;}



/*=================================================
 * CSS for SP
 * ================================================= */

@media screen and (max-width: 650px) {
	body{	padding-top: 0;}

	#platina_info{
		margin: 30px 0 0 0;
		padding: 30px 10px;
	}
	#platina_info h3{
		font-size: 0;
		line-height: 0;
		width: auto;
		height: auto;
		padding-top: calc(500 / 750 * 100%);
		background:
		url(img/platina_info.png) top left / cover no-repeat
		-webkit-background-size: contain;
		background-size: contain;
	}

	#platina_info .p1{
		font-size: 14px;
		line-height: 22px;
		text-align: left;
		margin: 0 0 20px 0;
		padding: 0 10px;
	}
	#platina_info .p2{
		width: auto;
		font-size: 12px;
		line-height: 20px;
		text-align: left;
		margin: 0 10px 20px 10px;
		padding: 10px;
	}


	/** pla_mainv **/
	#pla_mainv{
		padding: 0 0 50px 0;
	}
	#pla_mainv .pla_topv{
		position: relative;
		width: 100vw;
		height: 100vh;
		height: 100lvh;
	}
	#pla_mainv .pla_topv,
	#pla_mainv .pla_topv::after {
		background-size: var(--bg-size, 130%) auto;
	}

	#pla_mainv h3{
		height: 93vh;
		background-size: auto 70vh;
	}
	#pla_mainv .txt1{
		margin: -50px 0 50px 0;
		padding: 80px 15px 80px 15px;
	}
	#pla_mainv .txt1:before,
	#pla_mainv .txt1:after{
		content: "";
		width: 1px;
		height: 50px;
		background: #bb9f6a;
		position: absolute;
		left: 50%;
	}
	#pla_mainv .txt1:before{
		top: 0;
	}
	#pla_mainv .txt1:after{
		bottom: 0;
	}
	#pla_mainv .txt1 p:nth-of-type(1){
		font-size: 15px;
		line-height: 1.2;
		margin: 0 0 10px 0;
	}
	#pla_mainv .txt1 p:nth-of-type(2){
		font-size: 36px;
		line-height: 1.2;
		color: #bb9f6a;
		margin-bottom: 5px;
	}
	#pla_mainv .txt1 p:nth-of-type(3){
		font-size: 14px;
	}
	#pla_mainv .txt1 p:nth-of-type(2) br{	display: inline;}
	#pla_mainv .txt2:before{
		content: "";
		width: 15px;
		height: 15px;
		background: #fff;
		border-radius: 50%;
		box-shadow: 0px 0px 50px #bb9f6a;
		position: absolute;
		top: -50px;
		left: calc(50% - 7px);
	}
	#pla_mainv .txt2{
		font-size: 14px;
		line-height: 24px;
		text-align: left;
		margin: 0 0 30px 0;
		padding: 0 15px;
	}
	#pla_mainv .txt2 a{
		display: flex;
		width: 80%;
		height: 60px;
		font-size: 20px;
		line-height: 30px;
		margin: 0 auto 40px auto;
	}
	.pla_num{
		width: auto;
		margin: 0;
		padding: 0 20px;
	}
	.pla_numbox{
		position: relative;
		flex-wrap: wrap;
		flex-direction: row;
		margin: 0 0 50px 0;
	}
	.pla_numbox:last-of-type{	margin-bottom: 0;}
	.pla_numbox > div{
		order: 2;
		width: 100%;
		text-align: left;
	        margin-top: -40px;
	}
	.pla_numbox > div h4{
		display: block;
		width: 80px;
		margin: 0;
		position: absolute;
	}
	.pla_numbox:nth-of-type(odd) > div h4{
		top: 0;
		right: 0;
	}
	.pla_numbox:nth-of-type(even) > div h4{
		top: 0;
		left: 0;
	}
	.pla_numbox > div h4 span{
		position: relative;
		display: inline-block;
		font-family: "FontA";
		font-size: 76px;
		line-height: 1;
		margin: 0 0 10px 0;
		text-shadow: 0px 0px 90px #bb9f6a;
	}
	.pla_numbox > div h4 span:before,
	.pla_numbox > div h4 span:after{
		content: "";
		width: 10px;
		height: 1px;
		background: #bb9f6a;
		position: absolute;
		-webkit-transform: rotate(-45deg);
		   -moz-transform: rotate(-45deg);
		    -ms-transform: rotate(-45deg);
		     -o-transform: rotate(-45deg);
		        transform: rotate(-45deg);
	}
	.pla_numbox > div h4 span:before{
		top: -5px;
		right: -5px;
	}
	.pla_numbox > div h4 span:after{
		bottom: -0px;
		left: -0px;
	}
	.pla_numbox > div h4 em{
		font-size: 18px;
		line-height: 1.1;
		writing-mode: vertical-rl;
		text-orientation: upright;
		filter: drop-shadow(0px 0px 5px rgba(0, 0, 0, 1));
	}
	.pla_numbox > div h4 em i{
		font-style: normal;
		font-size: 50px;
	}
	.pla_numbox > div p{
		font-size: 14px;
		line-height: 24px;
	}
	.pla_numbox > img{
		order: 1;
		width: 100%;
		height: auto;
		margin: 0 auto 10px auto;
	}






	.kousei{
		color: #333;
		background: none;
	}
	.kousei div{	margin-bottom: 0;}
	.koisei_flex{
		display: block;
		width: auto;
		margin: 0 10px;
		border: 3px solid #e9e1d1;
	}
	.koisei_flex_l{
		display: block;
		width: auto;
		padding: 15px 0 0 0;
	}
	.koisei_flex_l h3{	margin-bottom: 0;}
	.koisei_flex_r{
		display: block;
		width: auto;
		padding: 10px;
	}
	.koisei_flex_r img{
		width: 100%;
		height: auto;
	}
	.koisei_flex_r .kotxt{
		font-size: 12px;
		line-height: 20px;
		position: static;
		padding: 10px 0 0 0;
	}


	.kbox_bg{
		width: auto;
		display: block;
		font-size: 0;
		line-height: 0;
		margin: 0;
		padding: 0;
	}

	.kbox{
		display: block;
		width: auto;
		height: auto;
		text-align: left;
		margin: 0 0 20px 0;
		padding: 0 0 20px 0;
		border: none;
		border-bottom: 1px solid #ddd;
		-webkit-box-sizing: border-box;
		   -moz-box-sizing: border-box;
		        box-sizing: border-box;
	}


	.fee_pla{
		display: block;
		width: auto;
		margin: 0 10px;
		box-shadow:0px 3px 3px 0px rgba(0, 0, 0, 0.2);
		border-radius: 10px;
	}
	.fee_pla_l{
		display: block;
		width: auto;
		padding: 20px 0 0 0;
		border-radius: 10px 10px 0 0;
	}
	.fee_pla_r{
		display: block;
		width: auto;
		border-radius: 0 0 10px 10px;
	}
	.fee h3{	margin-bottom: 0;}


	/** order **/
	.order{
		padding: 30px 10px;
	}
	.order .price_h3 br.pc_none{	display: inline;}
	.order p{
		font-size: 14px;
		line-height: 24px;
		text-align: left;
		margin: 0 0 20px 0;
	}


	/** pla_sysbox2 **/
	.pla_sysbox2{
		width: 100%;
		padding: 10px;
	}
	.pla_sysbox2 dl:first-of-type dd:first-of-type,
	.pla_sysbox2 dt{	width: 60px;}

	.pla_sysbox2 dl:first-of-type dd{
		font-size: 16px;
		line-height: 20px;
		padding: 10px 0;
	}
	.pla_sysbox2 dt{
		font-size: 14px;
		line-height: 16px;
		padding: 10px 0;
	}
	.pla_sysbox2 dt br{	display: inline;}
	.pla_sysbox2 dd{
		font-size: 4vw;
		line-height: 1.3;
		padding: 10px 0;
	}
	.pla_sysbox2 dd em{
		font-size: 7vw;
		font-style: normal;
	}
	.pla_sysbox2 .camprice {
		line-height: 1;
	}
	.pla_sysbox2 .camprice span{
		font-size: 2.5vw;
	}
	.pla_sysbox2 .camprice p{
		font-size: 14px;
		padding-top: 4px;
	}
	.pla_sysbox2 .pla_p1{
		font-size: 14px;
		line-height: 20px;
		margin: 10px 0 0 0;
	}
	.pla_sysbox2 .pla_p2{
		font-size: 12px;
		line-height: 18px;
	}


	.flow h3.f_title{
		font-size: 23px;
		line-height: 30px;
		margin-bottom: 10px;
	}
	
	#foot_tel{ display: none;}
	#foot_tel.show{ display: block;}
	
	.sp_none{ display: none;}
}
