form:invalid .valid {
	display: none !important;
}
form:invalid .invalid {
	display: block !important;
}

form:valid .valid {
	display: block !important;
}
form:valid .invalid {
	display: none !important;
}

.form-control:invalid {
	border-color: red;
}
.red {
	color :red;
}

.margin-auto {
	margin: auto;
}

.margin-0 {
	margin: 0 !important;
}

.gap-20px {
	margin: 0 20px;
}

.margin-top-20px {
	margin-top: 20px;
}
.margin-bottom-10px {
	margin-bottom: 10px;
}
.float-right {
	float: right;
}
.padding-top-0 {
	padding-top : 0px !important;
}
.padding-bottom-100px {
	padding-bottom: 100px !important;
}
.padding-top-10px {
	padding-top: 10px !important;
}
.padding-bottom-10px {
	padding-bottom: 10px !important;
}
.position-relative {
	position: relative;
}
.w100px {
	width: 100px;
}
.w100per {
	width: 100% !important;
}
.h100per {
	height: 100% !important;
}
.w60px {
	width: 60px;
}
.crop {
	display: block;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
}
.display-flex {
	display: flex;
}
.flex-1 {
	flex: 1;
}
.height-250 {
	height: 250px !important;
}
#loading {
	display: none;
}
.loader {
	align-items: center;
	background: rgba(255,255,255, 0.5);
	bottom: 0;
	display: flex;
	flex-direction: column;
	justify-content: center;
	left: 0;
	position: fixed;
	right: 0;
	top: 0;
	z-index: 999;
	text-align: center;
	font-weight: bold;
}
.loader::before, .progress {
	animation: loader 0.5s linear infinite;
	border: 3px solid #ffa500;
	border-radius: 50%;
	border-right: 3px solid rgba(255,165,0, 0.2);
	border-top: 3px solid rgba(255,165,0, 0.2);
	content: "";
	margin-bottom: 20px;
	display: block;
	height: 70px;
	width: 70px;
	margin: auto;
	margin-top: 200px;
}

@keyframes loader {
	0% {
		transform: rotate(0);
	}

	100% {
		transform: rotate(360deg);
	}
}
.text-right {
	text-align: right;
}

/* === ボタンを表示するエリア ============================== */
.switchArea {
	line-height    : 36px;                /* 1行の高さ          */
	letter-spacing : 0;                   /* 文字間             */
	text-align     : center;              /* 文字位置は中央     */
	font-size      : 15px;                /* 文字サイズ         */

	position       : relative;            /* 親要素が基点       */
	width          : 85px;               /* ボタンの横幅       */
	background     : #fff;                /* デフォルト背景色   */
}

/* === チェックボックス ==================================== */
.switchArea input[type="checkbox"] {
	display        : none;            /* チェックボックス非表示 */
}

/* === チェックボックスのラベル（標準） ==================== */
.switchArea label {
	display        : block;               /* ボックス要素に変更 */
	box-sizing     : border-box;          /* 枠線を含んだサイズ */
	height         : 36px;                /* ボタンの高さ       */
	border         : 2px solid #999999;   /* 未選択タブのの枠線 */
	border-radius  : 18px;                /* 角丸               */
}

/* === チェックボックスのラベル（ONのとき） ================ */
.switchArea input[type="checkbox"]:checked +label {
	border-color   : #78bd78;             /* 選択タブの枠線     */
}

/* === 表示する文字（標準） ================================ */
.switchArea label span:after{
	content        : "OFF";               /* 表示する文字       */
	padding        : 0 0 0 21px;          /* 表示する位置       */
	color          : #999999;             /* 文字色             */
}

/* === 表示する文字（ONのとき） ============================ */
.switchArea  input[type="checkbox"]:checked + label span:after{
	content        : "ON";                /* 表示する文字       */
	padding        : 0 21px 0 0;          /* 表示する位置       */
	color          : #78bd78;             /* 文字色             */
}

/* === 丸部分のSTYLE（標準） =============================== */
.switchArea .swImg {
	position       : absolute;            /* 親要素からの相対位置*/
	width          : 28px;                /* 丸の横幅           */
	height         : 28px;                /* 丸の高さ           */
	background     : #999999;             /* カーソルタブの背景 */
	top            : 4px;                 /* 親要素からの位置   */
	left           : 4px;                 /* 親要素からの位置   */
	border-radius  : 14px;                /* 角丸               */
	transition     : .2s;                 /* 滑らか変化         */
}

/* === 丸部分のSTYLE（ONのとき） =========================== */
.switchArea input[type="checkbox"]:checked ~ .swImg {
	transform      : translateX(49px);    /* 丸も右へ移動       */
	background     : #78bd78;             /* カーソルタブの背景 */
}


.yellow-card {
	position: absolute;
	width: 100%;
	background-color: #FFFBD0;
	color :darkgoldenrod;
	top: 0px;
	left: 0px;
	z-index: 9999;
	display: flex;
	gap :10px;
	padding: 10px;
	align-items: center;
}
.yellow-card i {
	font-size: 30px;
}
.yellow-icon {
	color :darkgoldenrod;
	font-size: 16px;
}

#menuPc .notiIcon {
	background: red;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	position: absolute;
	right: 15px;
	z-index: 999;
}

.guest-mode .diary-img-cover {
	position: relative;
	display: inline-block;
	overflow: hidden;
}
.guest-mode .diary-img-cover img {
	filter: blur(8px);
}
.diary-img-cover .require-login {
	display: none;
}
.guest-mode .diary-img-cover .require-login {
	display: block;
	position: absolute;
	background-color: #fff;
	top: 50%;
	left: 50%;
	width: calc(100% - 20px);
	transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);

	text-align: center;
	padding: 10px;
	max-width: 250px;
}
.guest-mode .diary-img-cover .require-login h5 {
	font-weight: bold;
	font-size: 120%;
	margin-bottom: 10px;
}
.guest-mode .diary-img-cover .require-login p {
	font-size: 80%;
}
.guest-mode .diary-img-cover .require-login a {
	background-color: #f47983;
	color : white;
	padding: 5px;
	display: block;
	text-align: center;
	margin-top: 10px;
}
.guest-mode .diary-img-cover .require-login a:last-child {
	background-color: #03a678;
}
.mb20px {
	margin-bottom: 20px;
}
.button2022 button {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin: 0 auto;
	margin-bottom: 30px;
	padding: 1em 2em;
	width: 90%;
	color: #fff;
	font-size: 18px;
	font-weight: 700;
	background-image: linear-gradient(170deg, #2f2f2f, #000);
	border-radius: 50vh;
	transition: 0.3s;
}
.button_flow3 button, .button_flow3 a {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin: 0 auto;
	margin-top: 50px;
	margin-bottom: 30px;
	border : none;
	padding: 1em 2em;
	width: 90%;
	color: #fff;
	font-size: 18px;
	font-weight: 700;
	background-image: linear-gradient(170deg, #EB1747, #EB1747);
	border-radius: 50vh;
	transition: 0.3s;
	text-align: center;
}

.error-alert {
	background-color: #F5D8EF;
	padding: 5px;
	border : solid 2px red;

}

.common-button {
	display: flex;
	align-items: center;
	justify-content: center;
}
.line-text {
	color : #06c755;
	font-weight: bold;
	font-size: larger;
	animation: blinkAnime 1s infinite alternate;
}
@keyframes blinkAnime{
	0% { color: #fff }
	100% { color: #06c755 }
}

.aitorkDayTop .aitorkDayTopHidden, .aitorkDayTopShow {
	display: none;
}
.aitorkDayTop .aitorkDayTopShow {
	display: block;
}
.aitorkDayTop .aitorkDayTopWhite * {
	color : white !important;
}

.breadList ol {
	display: flex;
	margin-bottom: 5px;
}
.breadList li::after {
	content: ">";
	margin-left: 5px;
	margin-right: 5px;
	color: grey;
}
.breadList li:last-child::after {
	content : "";
}
.breadList a {
	color : grey;
}

body.guest-user .girlsArea img,
body.guest-user .diaryArea img,
body.guest-user .diaryPicArea img,
body.guest-user .cards-girl-general img,
body.guest-user .p_order img,
body.guest-user .modal_imgDiary img,
body.guest-user .VoiceArea img
{
	filter: blur(4px);
}

/*
.flex-control-nav.flex-control-paging {
	display: none;
}

.acc__Area ul.closed, .fetiInner.closed {
	display: -webkit-box !important;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: 78px;
}
.acc__Area ul.closed {
	min-height: 78px;
}
.fetiInner.closed {
	min-height: 76px;
}
.wrapSingleFet a {
	display: inline-block !important;
	margin-right: 8px;
	margin-bottom: 8px;
}
.hmark {
	vertical-align: middle;
}

 */


.talkalert_modal {
	top : -200%;
}
.talkalert_modal.talkalert_modal_open {
	top : 45px;
}
.mygirlsmap_container {
	padding-bottom: 100px;
}
@media screen and (max-width: 600px) {
	.talkalert_statusbar {
		top : 45px;
	}
	.talkalert_modal.talkalert_modal_open {
		top : 90px;
	}
}