@charset "utf-8";

@import url("https://fonts.googleapis.com/css?family=Noto+Sans+JP:400,700&subset=japanese");
@import url("https://fonts.googleapis.com/css?family=Noto+Serif+JP:400,700&subset=japanese");

/* ------------------------------------------------------------------ BASE -- */
:root {
	--co-main: #f7cb00;
	--co-main-lite: #c1d9d7;
	--co-main-dark: #d4c272;

	--co-dark: #000F26;
	--co-dark-deep: #000F26;

	--co-text-light: #f2f2f2;
	--co-text-dark:  #000F26;

	--co-white: #FFFFFF;

	--co-sub1: #E94709;
	--co-sub2: #fddc0e;
	--co-sub3: #40924b;

	--te-mincho: YakuHanMP, 'Noto Serif JP', "游明朝" , sans-serif;
	--te-gosick: YakuHanJP, 'Noto Sans JP', sans-serif;
}

.pcOnly{ display: block; }
.tbOnly{ display: none; }
.spOnly{ display: none; }
@media screen and ( max-width:959px ) {
	.pcOnly{ display: none; }
	.tbOnly{ display: block; }
}
@media screen and ( max-width:599px) {
	.spOnly{ display: block; }
}


html{
	font-size: 16px;
	font-family: var(--te-gosick);
}
@media screen and ( max-width:959px ) {
	html {
		font-size: 15px;
	}
}

body{
	overflow-x: hidden;
	background-color: var(--co-text-light);
}

h1{
	font-size: 1.5rem;
	font-weight: 700;
	position: relative;
	font-family: var(--te-mincho);
}
h2{
	font-size: clamp(1.25rem, 1vw + 1rem, 2rem);
	font-weight: 700;
	position: relative;
	font-family: var(--te-mincho);
	margin-bottom: 1em;
	padding-bottom: 0.75em;
	width: 100%;
}
h2::after{
	content: "";
	width: 6em;
	height: 2px;
	background-color: var(--co-text-dark);
	margin: auto;
	bottom: 0;
	position: absolute;
	left: 0;
	right: 0;
	transform: skewX(-45deg);
}
h2 i{
	font-size: inherit;
	margin-right: 0.5em;
}
h3{
	font-size: 1.125rem;
	font-weight: 700;
	margin-bottom: 0.75em;
}
h3.border{
	border-bottom: 1px solid #333;
	margin-bottom: 0.75em;
	padding-bottom: 0.45em;
	position: relative;
	overflow: hidden;
	text-align: left;
}
h3.border::after{
	content: "";
	width: 6rem;
	height: 1px;
	background-color: #333;
	margin: auto;
	bottom: 0;
	position: absolute;
	left: -1em;
	transform: skewX( -45deg );
}
h4{
	font-size: 1rem;
	font-weight: 700;
	margin-bottom: 1.25em;
}
h4 img {
	height: 2em;
	width: auto!important;
}

h6{
	font-size: 0.75rem;
	font-weight: 700;
	font-family: YakuHanJP, 'Cinzel', serif;
	letter-spacing: 0.25rem;
	margin-bottom: 0.25rem;
}
h6 img {
	height: 1.5em;
}

p{
	padding-bottom: 0.75em;
}

p:last-of-type{
	padding-bottom: 0;
}

strong{
	font-weight: 700;
	font-size: inherit;
	margin: 0 0.15rem;
	background: linear-gradient(rgba(255,255,255,0) 80%,rgba(255, 191, 0, 0.5) 0);
}


.fontS{
	font-size: 0.5em;
	display: inline-block;
	font-family: inherit;
}
.fontL{
	font-size: 1.5em;
	display: inline-block;
	font-family: inherit;
}
.fontXL{
	font-size: 2em;
	display: inline-block;
	font-family: inherit;
}
.font8rem{
	font-size: 8rem;
}
@media screen and ( max-width:599px) {
	.fontXL .normalLink {
		font-size: 0.65em;
	}
}


section{
	padding: clamp(3rem, 8vw, 7rem) 0;
	position: relative;
	background: var(--co-text-light);
}

section:not(:first-of-type){
	border-top: 1px solid var(--co-white);
}


/* ------------------------------------------------------------------ LINK -- */
a{
	display: block;
}

a,a *{
	color: #2f3749;
	transition: all 0.2s linear;
	text-decoration: none;
}

a:hover,a:hover *{
	text-decoration: none;
}

a.imgLink {
	display: inline-block;
	transition: opacity 0.2s linear;
}
a.imgLink:hover {
	opacity: 0.7;
}



/* ----------------------------------------------------- PARTS//margin-set -- */
.mb-0 { margin-bottom:  0px !important; }
.mb-10{ margin-bottom: 10px !important; }
.mb-20{ margin-bottom: 20px !important; }
.mb-30{ margin-bottom: 30px !important; }
.mb-40{ margin-bottom: 40px !important; }
.mb-50{ margin-bottom: 50px !important; }
.mb-60{ margin-bottom: 60px !important; }
.mb-70{ margin-bottom: 70px !important; }
.mb-80{ margin-bottom: 80px !important; }

.ml-0 { margin-left:  0px !important; }
.ml-10{ margin-left: 10px; }
.ml-20{ margin-left: 20px; }
.ml-30{ margin-left: 30px; }
.ml-40{ margin-left: 40px; }

.mr-0 { margin-right:  0px !important; }
.mr-10{ margin-right: 10px; }
.mr-20{ margin-right: 20px; }
.mr-30{ margin-right: 30px; }
.mr-40{ margin-right: 40px; }

.mt-05rem{ margin-top: 0.5rem !important; }
.mt-1rem{ margin-top: 1rem !important; }
.mt-2rem{ margin-top: 2rem !important; }
.mt-3rem{ margin-top: 3rem !important; }
.mt-4rem{ margin-top: 4rem !important; }
.mt-5rem{ margin-top: 5rem !important; }
.mt-6rem{ margin-top: 6rem !important; }
.mt-7rem{ margin-top: 7rem !important; }
.mt-8rem{ margin-top: 8rem !important; }

.mt-10{ margin-top: 10px !important; }
.mt-20{ margin-top: 20px !important; }
.mt-30{ margin-top: 30px !important; }
.mt-40{ margin-top: 40px !important; }
.mt-50{ margin-top: 50px !important; }
.mt-60{ margin-top: 60px !important; }
.mt-70{ margin-top: 70px !important; }
.mt-80{ margin-top: 80px !important; }

.pa-0   {padding: 0!important;}
.pa-1_5 {padding: 1.5rem!important;}
.pa-2   {padding: 2rem!important;}
.pa-0_5em {padding: 0.25em 0.75em!important;}

.pt-10{ padding-top: 10px; }
.pt-20{ padding-top: 20px; }
.pt-30{ padding-top: 30px; }
.pt-40{ padding-top: 40px; }
.pt-50{ padding-top: 50px; }
.pt-60{ padding-top: 60px; }
.pt-70{ padding-top: 70px; }
.pt-80{ padding-top: 80px; }

.pb-10{ padding-bottom: 10px; }
.pb-20{ padding-bottom: 20px; }
.pb-30{ padding-bottom: 30px; }
.pb-40{ padding-bottom: 40px; }
.pb-50{ padding-bottom: 50px; }
.pb-60{ padding-bottom: 60px; }
.pb-70{ padding-bottom: 70px; }
.pb-80{ padding-bottom: 80px; }

.pt-1rem{ padding-top: 1rem !important; }
.pt-2rem{ padding-top: 2rem !important; }
.pt-3rem{ padding-top: 3rem !important; }
.pt-4rem{ padding-top: 4rem !important; }
.pt-5rem{ padding-top: 5rem !important; }
.pt-6rem{ padding-top: 6rem !important; }
.pt-7rem{ padding-top: 7rem !important; }
.pt-8rem{ padding-top: 8rem !important; }

.pb-1rem{ padding-bottom: 1rem !important; }
.pb-2rem{ padding-bottom: 2rem !important; }
.pb-3rem{ padding-bottom: 3rem !important; }
.pb-4rem{ padding-bottom: 4rem !important; }
.pb-5rem{ padding-bottom: 5rem !important; }
.pb-6rem{ padding-bottom: 6rem !important; }
.pb-7rem{ padding-bottom: 7rem !important; }
.pb-8rem{ padding-bottom: 8rem !important; }

.pt-1_5rem{ padding-top: 1.5rem !important; }


/* ------------------------------------------------------------- PARTS//BG -- */
.bgWhite {
	background-color: var(--co-dark-deep);
}
.bgDark {
	background-color: var(--co-dark);
	color: var(--co-text-light);
}
.bgDark h2::after { background-color: var(--co-text-light); }

.coWhite { color: var(--co-white); }
.coDark  { color: var(--co-text-dark) }


/* -------------------------------------------------------- PARTS//textSet -- */
.ta-l {
	text-align: left;
}

.ta-l h2::after,
h2.ta-l::after{
	right: auto;
}


/* ----------------------------------------------------------- PARTS//.col -- */
.col {
	max-width: 1200px;
	min-width: 960px;
	margin: auto;
	text-align: center;
	position: relative;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	margin-bottom: 3rem;
	padding-left:  2rem;
	padding-right: 2rem;
	gap: 1.5rem;
}
.col:last-of-type {
	margin-bottom: 0;
	padding-bottom: 0!important;
}
.col.fix {
	max-width: none;
	min-width: auto;
	padding: 0%;
}

.colIn {
	flex-grow: 1;
}
.colIn img {
	max-width: 100%;
}
.colIn.Txt {
	padding: 7.5% 5%;
}
.colIn.Txt > div {
	width: 100%;
}

@media screen and ( max-width:959px ) {
	.col {
		max-width: calc(100% - 2rem);
		min-width: auto;
	}
}
@media screen and ( max-width:599px) {
	.col {
		max-width: 100%;
		margin-bottom: 1rem;
		padding-left:  1rem;
		padding-right: 1rem;
	}
}


/* ----------------------------------------------------- PARTS//.col.Title -- */
.col.title {
	position: relative;
	padding-top: 0;
	padding-bottom: 0;
	display: block;
	margin-bottom: 1.5rem;
}
.col.title.close {
	position: relative;
	padding-top: 5rem;
	padding-bottom: 5rem;
	display: block;
	margin-bottom: 1.5rem;
}

/* ---------------------------------------------------- PARTS//.col.single -- */
.col.single .colIn{
	width: 100%;
}

/* -------------------------------------------------------- PARTS//.col.Db -- */
.col.db .colIn {
	width: 40%;
	flex-grow: 1;
}

/* ---------------------------------------------------- PARTS//.col.Db.fix -- */
.col.db.fix {
	gap: 0;
}
.col.db.fix .colIn{
	width: calc(100% / 2);
}
@media screen and ( max-width:959px ) {
	.col.db {
		flex-direction: column;
		gap: 1rem;
	}
	.col.db .colIn ,
	.col.db.fix .colIn {
		width: 100%;
	}
	.col.db .colIn:last-of-type ,
	.col.db.fix .colIn:last-of-type {
		margin-bottom: 0;
	}
	.col.db.fix .colIn:last-of-type {
		padding: 1.5em;
	}
}
@media screen and ( max-width:599px) {
	.col.db {
		gap: 1rem;
	}
}


/* ------------------------------------------------------- PARTS//.col.Db2 -- */
.col.db2 .colIn:first-of-type{
	width: 10%;
}
.col.db2 .colIn:last-of-type {
	width: 60%;
}

/* ------------------------------------------------------ PARTS//.col.Db2b -- */
.col.db2b .colIn:first-of-type{
	width: calc(60% - 3rem);
}
.col.db2b .colIn:last-of-type{
	width: 40%;
}
@media screen and ( max-width:959px ) {
	.col.db2b {
		flex-direction: column;
	}
	.col.db2b .colIn:first-of-type {
		width: 100%;
		margin-bottom: 1.5rem;
	}
	.col.db2b .colIn:last-of-type {
		width: 100%;
	}
	.col.qua .colIn {
		width: calc(100% / 2 - 10px);
		max-width: none;
	}
}
@media screen and ( max-width:599px) {
	.col.db2 ,
	.col.db2b {
		flex-direction: column;
	}
	.col.db2 .colIn:first-of-type ,
	.col.db2 .colIn:last-of-type ,
	.col.db2b .colIn:first-of-type ,
	.col.db2b .colIn:last-of-type {
		width: 100%;
	}
	.col.db2 .colIn:not(:last-of-type) {
		margin-bottom: 2rem;
	}
}

/* ------------------------------------------------------- PARTS//.col.Tri -- */
.col.tri .colIn{
	width: calc(100% / 3 - 10px);
	margin-top: 1rem;
}
.col.tri .colIn:nth-of-type(1),
.col.tri .colIn:nth-of-type(2),
.col.tri .colIn:nth-of-type(3){
	margin-top: 0;
}
@media screen and ( max-width:599px) {
	.col.tri {
		flex-direction: column;
	}
	.col.tri .colIn ,
	.col.tri.fix .colIn {
		width: 100%;
	}
	.col.tri .colIn:not(:last-of-type) {
		margin-bottom: 1rem;
	}
}


/* ------------------------------------------------------- PARTS//.col.Tri -- */
.col.tri.fix .colIn{
	width: calc(100% / 3);
}


/* ------------------------------------------------------- PARTS//.col.Qua -- */
.col.qua {
	gap: 1px;
}
.col.qua .colIn{
	flex-grow: 1;
	width: calc(100% / 5);
}
.col.qua .colIn.w590{
	width: calc(100% / 2 - 10px);
	max-width: 590px;
}
@media screen and ( max-width:599px) {
	.col.qua .colIn {
		width: 100%;
	}
}



/* --------------------------------------------------------------- .flexUL -- */
.flexUL {
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	justify-content: center;
	gap: 0.25rem 1rem;
}
.flexUL dl {
	display: flex;
	align-items: stretch;
	font-size: 12px;
	line-height: 1.4;
}
.flexUL dl dt {
	font-weight: bold;
}
.flexUL dl dd {
	text-align: left;
	margin-left: 0.5em;
}


/* ------------------------------------------------------------- .compInfo -- */
.compInfo {
	padding: 2rem 0;
	background: var(--co-main-lite);
}
footer {
	background: var(--co-main);
	font-size: 10px;
	padding: 1.5em 1rem;
	color: var(--co-white);
	text-align: center;
}

/* --------------------------------------------------------------- mainImg -- */
.mainImg {
	padding: 3rem 0;
	position: relative;
	-webkit-background-size: 90px 90px;
	-moz-background-size: 90px 90px;
	background-size: 90px 90px;
	background-color: var(--co-main-dark);
	background-image:        -webkit-gradient(linear, 0 0, 100% 100%, color-stop(.25, var(--co-main)), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, var(--co-main)), color-stop(.75, var(--co-main)), color-stop(.75, transparent), to(transparent));
	background-image: -webkit-linear-gradient(-45deg, var(--co-main) 25%, transparent 25%, transparent 50%, var(--co-main) 50%, var(--co-main) 75%, transparent 75%, transparent);
	background-image:    -moz-linear-gradient(-45deg, var(--co-main) 25%, transparent 25%, transparent 50%, var(--co-main) 50%, var(--co-main) 75%, transparent 75%, transparent);
	background-image:     -ms-linear-gradient(-45deg, var(--co-main) 25%, transparent 25%, transparent 50%, var(--co-main) 50%, var(--co-main) 75%, transparent 75%, transparent);
	background-image:      -o-linear-gradient(-45deg, var(--co-main) 25%, transparent 25%, transparent 50%, var(--co-main) 50%, var(--co-main) 75%, transparent 75%, transparent);
	background-image:         linear-gradient(-45deg, var(--co-main) 25%, transparent 25%, transparent 50%, var(--co-main) 50%, var(--co-main) 75%, transparent 75%, transparent);
}

.mainImg .col.title {
	margin-bottom: 0;
}
.mainImg::after {
	content: "";
	position: absolute;
	background: rgb(77,182,172);
	background:    -moz-linear-gradient(top,  rgba(255,255,255,0.9) 0%, rgba(255,255,255,0.5) 70%, rgba(0,0,0,1) 70%, rgba(255,255,255,0) 100%);
	background: -webkit-linear-gradient(top,  rgba(255,255,255,0.9) 0%, rgba(255,255,255,0.5) 70%, rgba(0,0,0,1) 70%, rgba(255,255,255,0) 100%);
	background:   linear-gradient(to bottom,  rgba(255,255,255,0.9) 0%, rgba(255,255,255,0.5) 70%, rgba(0,0,0,1) 70%, rgba(255,255,255,0) 100%);
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	opacity: 0.2;
	mix-blend-mode: multiply;
}
.mainImg::after {
	content: "";
	position: absolute;
	background: rgb(77,182,172);
	background:    -moz-linear-gradient(top,  rgba(255,255,255,0.9) 0%, rgba(255,255,255,0.5) 70%, rgba(0,0,0,1) 70%, rgba(255,255,255,0) 100%);
	background: -webkit-linear-gradient(top,  rgba(255,255,255,0.9) 0%, rgba(255,255,255,0.5) 70%, rgba(0,0,0,1) 70%, rgba(255,255,255,0) 100%);
	background:   linear-gradient(to bottom,  rgba(255,255,255,0.9) 0%, rgba(255,255,255,0.5) 70%, rgba(0,0,0,1) 70%, rgba(255,255,255,0) 100%);
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	opacity: 0.2;
	mix-blend-mode: multiply;
}
.mainImg img {
	max-width: 800px;
}


/* ------------------------------------------------------------ FORM style -- */
form.mktoForm .mktoFormRow fieldset > .mktoFormRow .mktoFormCol .mktoFieldWrap input,
form.mktoForm .mktoFormRow fieldset > .mktoFormRow .mktoFormCol .mktoFieldWrap select.mktoField,
form.mktoForm .mktoFormRow fieldset > .mktoFormRow .mktoFormCol .mktoFieldWrap textarea.mktoField,
form.mktoForm .mktoFormRow fieldset > .mktoFormRow .mktoFormCol .mktoFieldWrap .mktoRadioList label,
form.mktoForm .mktoFormRow fieldset > .mktoFormRow .mktoFormCol .mktoFieldWrap .mktoCheckboxList label {
	font-size: 18px;
}


form.mktoForm .mktoFormRow fieldset {
	margin: 0 0 3px 0!important;
	background: var(--co-white);
	border-top: 3px solid var(--co-main);
}

form.mktoForm .mktoButtonRow {
	background: var(--co-main-lite);
}
form.mktoForm .mktoFormRow:nth-of-type(2) fieldset {
	border-radius: 0.75rem 0.75rem 0 0;
}
form.mktoForm .mktoButtonRow {
	border-radius: 0 0 0.75rem 0.75rem;
}


form.mktoForm .mktoButtonRow .mktoButtonWrap .mktoButton:disabled {
	background: #b3b3b3;
	border: 2px solid #7c7c7c;
	box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.3);
	margin-bottom: 0px;
	margin-top: 5px;
	opacity: 1;
	color: #7c7c7c;
	text-shadow: none;
}

.checkBtn {
	appearance: none;
	-webkit-appearance: none;
	background: var(--co-main);
	border: none;
	font-size: 18px;
	padding: 0.675em 2.875em;
	border-radius: 3em;
	cursor: pointer;
	font-weight: bold;
	transition: background 0.2s linear, opacity 0.2s linear;
	color: var(--co-dark);
}

.checkBtn.confirm {
	background: var(--co-main);
}

.checkBtn:hover {
	opacity: 0.7;
}
.checkBtn:disabled {
	background: #b3b3b3;
	color: #7c7c7c;
	cursor: auto;
	opacity: 1!important;
}

.modalWrapp {
	height: 100%;
	position: fixed;
	width: 100%;
	z-index: 90000;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	visibility: visible;
	display: none;
}

.addBG {
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 1200;
	background: #000000;
	transition: all 0.1s linear;
	opacity: 0;
	transform: translateY(-100%);
}
.modalWrapp .addBG {
	transform: translateY(0%);
	opacity: 0.6;
}
.is-view .addBG {
	opacity: 0.6;
	transform: translateY(0%);
}
.modalWrapp .addInner {
	border-radius: 1.25rem;
	height: auto;
	top: 0;
	position: relative;
	overflow: visible;
	padding: 3rem 0.05rem 0.05rem 0.05rem;
	transform: translateY(0);
	opacity: 1;
	z-index: 2400;
	background: var(--co-white);
	max-width: calc(100% - 2rem);
}
.modalWrapp .addInner i {
	background: var(--co-sub1);
	font-size: 1.7rem;
	width: 2.25em;
	height: 2.25em;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 3em;
	color: var(--co-text-light);
	position: absolute;
	top: -1.15em;
	border: 3px solid var(--co-white);
	left: 0;
	right: 0;
	margin: auto;
}

.modalWrapp .addInnerIn {
	padding: 0 1.5rem 1.5rem;
}
.modalWrapp .addInnerIn h4 {
  margin-top: 0;
  padding-bottom: 0;
  border: none;
  text-align: center;
  margin-bottom: 1em;
}
.modalWrapp .addInnerIn p {
  text-align: center;
}
.modalWrapp .addInnerIn p.noticeTxt {
	color: var(--co-sub1);
	margin-top: 0.25em;
	font-size: 1.25em;
}
.modalWrapp .addInnerIn p > span {
	font-size: 32px;
	display: inline-block;
	font-weight: bold;
	margin-top: 0.05em;
	margin-bottom: 0.15em;
	color: var(--co-main);
	line-height: 1.1;
	margin-right: 0.15em;
}

.modalWrapp .addInnerIn .Details dl {
	padding-top: 1rem;
}
.modalWrapp .addInnerIn .Details dl dd {
	position: relative;
}
.modalWrapp .addInnerIn .Details dl dd input {
	width: 100%;
	text-align: center;
	font-size: 32px;
	font-weight: bold;
	padding: 0.25em 0.5em;
	line-height: 1.2;
	letter-spacing: 0.25em;
}
.modalWrapp .addInnerIn .Details dl .errorTxt {
	position: absolute;
	font-size: 0.875rem;
	padding: 0.5em 1.5em;
	background: var(--co-sub1);
	color: var(--co-white);
	font-weight: bold;
	border-radius: 0.35em;
	margin: auto;
	left: 0;
	right: 0;
	top: 4em;
	transform: translateY(1em);
	opacity: 0;
	transition: all 0.2s linear;
}
.modalWrapp.error .addInnerIn .Details dl dd input {
	transition: all 0.2s linear;
	background: #ffebe4;
	color: var(--co-sub1);
}
.modalWrapp.error .addInnerIn .Details dl .errorTxt {
	transform: translateY(0);
	opacity: 1;
}


.buttonArea {
	display: flex;
	flex-direction: row;
	gap: 0.5rem;
	max-width: 600px;
	width: 100%;
	background: var(--co-main-lite);
	border-radius: 0 0 1.2rem 1.2rem;
	padding: 0.75rem;
}
.buttonArea button {
	flex-grow: 1;
	width: 100%;
}

.checkBtn.Sub2 {
	background: #b3b3b3;
}
.buttonArea .checkBtn {
	padding: 0.75em 1.5em;
}

input:disabled {
	background: #e5e5e5!important;
}

.success::after {
	font-family: "Font Awesome 5 Free";
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	display: inline-block;
	font-style: normal;
	font-variant: normal;
	text-rendering: auto;
	line-height: 1;
	font-weight: 900;
	content: "\f00c";
	position: absolute;
	bottom: 0.55em;
	height: 2em;
	background: var(--co-main);
	z-index: 100;
	display: flex!important;
	width: 2em;
	color: #FFFFFF;
	justify-content: center;
	align-items: center;
	border-radius: 10rem;
	font-size: 0.875rem;
	right: 0.75em;
}
.checkBtn:not(:last-of-type) {
	margin-right: 0.75em;
}



#pageComp .modalWrapp {
	display: flex;
}
#pageComp .modalWrapp .addBG {
	transform: translateY(0%);
	opacity: 0.6;
	background: #FFF;
	opacity: 1;
}
#pageComp .modalWrapp .addInner {
	box-shadow: 0px 10px 30px -15px #000000;
}
#pageComp .modalWrapp .addInnerIn {
	text-align: center;
}
.material-symbols-outlined {
	font-size: 8rem;
	color: var(--co-main);
}

@keyframes rotate {
    0% { transform: rotate(0deg);}
  100% { transform: rotate(-360deg);}
}
.material-symbols-outlined {
  animation:rotate 5s linear infinite;
}




/* ------------------------------------------------------------ .floatInfo -- */
.floatInfo {
	display: flex;
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	background: rgb(11 11 10 / 67%);
	z-index: 1000000;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	transition: all 0.5s linear;
	opacity: 0;
}

.floatInfo.is-show {
	opacity: 1;
}

.float__Wrapp {
	background: var(--co-white);
	width: 50vw;
	padding: 1.5rem 2rem;
	position: relative;
	border: 2px solid var(--co-main);
	box-shadow: 0px 0px 0px 10px var(--co-white);
}
.float__Wrapp h3 {
	text-align: center;
	color: var(--co-main);
	font-size: 1.5em;
	margin: 0;
	display: flex;
	align-items: center;
	flex-direction: column;
	margin-bottom: 0.25em;
}
.float__Wrapp h3 i {
	font-size: 4em;
}

.float__Wrapp p {
	position: relative;
}
.float__Wrapp {
	text-align: center;
}

.float__Wrapp__closeBtn {
	display: inline-flex;
	align-items: center;
	flex-direction: row;
	font-size: 0.675rem;
	cursor: pointer;
	justify-content: center;
	background: var(--co-main-dark);
	width: auto;
	padding: 1em 5em!important;
	border-radius: 0.5em;
}
.float__Wrapp__closeBtn i {
	width:  2em;
	height: 2em;
	margin-right: 0.25em;
	position: relative;
	font-size: inherit;
}
.float__Wrapp__closeBtn i::after,
.float__Wrapp__closeBtn i::before {
	content: "";
	height: 1px;
	width: 100%;
	background-color: var(--co-white);
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
}
.float__Wrapp__closeBtn i::after {
	transform:rotate(45deg);
}
.float__Wrapp__closeBtn i::before {
	transform:rotate(-45deg);
}
.float__Wrapp .float__Wrapp__closeBtn span {
	font-size: 1.5em;
	color: var(--co-white);
}

@media screen and ( max-width:599px) {
	.float__Wrapp {
		width: 90vw;
		padding: 2rem;
	}
}