@charset "UTF-8";

:root {
	--siteColor-main:#5c7bab;		/*サイトのメインカラー*/

	--bgColor-body:#fafafa;			/*bodyの背景色*/
	--bgColor-header:#fff;			/*headerの背景色*/
	--bgColor-main:#fff;			/*mainの背景色*/
	--bgColor-footer:#fff;			/*footerの背景色*/

	--btnColor-main:#5c7bab;		/*ボタンの背景色など*/
	--btnColor-sub:#fff;			/*ボタンの文字など*/

	--btnColor-main-negativ:#ddd;		/*disableボタンの背景色など*/
	--btnColor-sub-negativ:#fff;		/*disableボタンの文字など*/

	--navigationColor-main:#a0abbb;		/*ナビゲーション通常時*/
	--navigationColor-sub:#5c7bab;		/*ナビゲーションアクティブ時*/

	--textColor-main:#000;			/*文字色*/
	--textLinkColor-main:#000;		/*テキストリンク*/
	--borderColor-main:#e5e5e5;		/*ボーダー*/

	--mailStatusColor-main:#00B589;		/*未読*/
	--mailStatusColor-sub:#b9b9b9;		/*既読*/

	--paymentColor-main:#e69e02;		/*購入関連のメインカラー*/
	--paymentColor-sub:#c5aa52;		/*購入関連のサブカラー*/

	--height-header:72px;
	--height-pageHeading:16px;
	--height-btmNavi-sp:64px;
	--height-btmNavi-pc:72px;
	--height-messageSendBox:82px;
}

body{
	color: var(--textColor-main);
	background: var(--bgColor-body);
	font-family: "Helvetica Neue","Helvetica", "Arial", "Yu Gothic","Hiragino Kaku Gothic ProN","Hiragino Sans","Meiryo", sans-serif;
	font-weight: 500;
}

p{
	font-size: 1.5rem;
	line-height: 1.75;
}

a{
	color: var(--textLinkColor-main);
}

@media print, ( min-width : 1025px ){
	a:hover,button:hover,input[type="submit"]:hover,input[type="button"]:hover,.btn:hover{
		opacity: .75;
	}
}

img{
	pointer-events: none;
	-webkit-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.selectWapper{
	position: relative;
}

.selectWapper::before{
	position: absolute;
	top: calc(50% - 4px);
	right: 6px;
	content: "";
	display: block;
	width: 12px;
	height: 8px;
	clip-path: polygon(0 0, 100% 0%, 50% 100%);
	background: #7f8499;
}

/*----------------------------------------------
表
-----------------------------------------------*/
.baseTable{
	table-layout: fixed;
	width: 100%;
	margin: 8px auto 16px;
	font-size: 1.3rem;
}

.baseTable th{
	width: 200px;
	padding: .5em;
	text-align: left;
	background: #fafdff;
	border-bottom: 1px solid var(--borderColor-main);
}

.baseTable td{
	padding: .2em;
	text-align: center;
	border-bottom: 1px solid var(--borderColor-main);
}

/*----------------------------------------------
見出し系
-----------------------------------------------*/
h1.pageHeading{
	padding: 0 8px;
	height: var(--height-pageHeading);
	line-height: var(--height-pageHeading);
	font-size: 1rem;
	text-align: center;
	color: #6e6e6e;
	background: #eef2f2;
}

.pageTitle{
	font-size: 1.8rem;
	font-weight: bold;
}

.contentsTitle{
	margin: 0 auto;
	padding: 16px 8px;
	font-size: 1.6rem;
	font-weight: bold;
	color: var(--siteColor-main);
	background: #f8fafc;
	margin: 0 -8px;
}

@media print, ( min-width : 1025px ){
	.contentsTitle{
		margin: 0;
		font-size: 1.8rem;
		background: none;
		border-bottom: 4px solid #f8fafc;
	}
}

.imgContentsTitle{
	display: block;
	width: 96%;
	margin: 0 auto;
}

@media ( min-width : 1025px ){
	.imgContentsTitle{
		width: 360px;
	}
}

/*----------------------------------------------
テキスト系
-----------------------------------------------*/
/*年月日時分表示*/
.date{
	font-size: 1.2rem;
	font-weight: normal;
	margin-bottom: 4px;
	color: #777;
}

/*メール状態*/
.mailStatus{
	font-size: 1.1rem;
}

.unread{
	color:var(--mailStatusColor-main);
}

.read{
	color:var(--mailStatusColor-sub);
}

/*未読バッジ*/
.unreadCountBadge{
	position: absolute;
	top: 4px;
	right: 16px;
	display: block;
	width: 20px;
	height: 20px;
	line-height: 20px;
	font-size: 1rem;
	color:var(--btnColor-sub);
	background: var(--mailStatusColor-main);
	border-radius: 50%;
}

/*未読バッジ(新着情報)*/
.newArraivalsBadge{
	position: absolute;
	top: 14px;
	left: 122px;
	display: block;
	width: 20px;
	height: 20px;
	line-height: 20px;
	text-align:center;
	font-size: 1rem;
	color:var(--btnColor-sub);
	background: var(--mailStatusColor-main);
	border-radius: 50%;
}

.msg{
	font-size: 1.4rem;
}

.msg-confirm{
	background: #edffe8;
}

.msg-completed{
	background: #e3f3ff;
}

.msg-error{
	background: #d32f2f;
}

.msg-error2{
	background: #ffffff;
	color: #d32f2f;
	border: solid #d32f2f 1px;
}

.msg-purchase{
	background: #ffeec3;
}

/*----------------------------------------------
ボタン系
-----------------------------------------------*/
.btn{
	width: 72%;
	max-width: 320px;
	margin: 32px auto;
	padding: 12px;
	font-size: 1.5rem;
	color:var(--btnColor-sub);
	background: var(--btnColor-main);
	border: 1px solid #fff;
	border-radius: 24px;
	position: relative;
}

.btn-skip{
	background: #fff;
}

.btn-like{
	background: #EC1D27;
}

.horizontalBtns .btn{
	width: 46%;
}

#scrollToTop{
	width: 40px;
	height: 40px;
	right: 12px;
	bottom: 64px;
	background: url(../img/svg-arrow_circle_up.svg);
	background-size: contain;
	background-repeat: no-repeat;
}

/*ページネーション*/
.pagination_item.nowPage{
	background: #c5d1ea;
}

.textLink-blue{
	color: #0049d0;
	text-decoration: underline;
}

/*-----------------------------------------------
アイコン
-----------------------------------------------*/
.icon{
	display: block;
	width: 24px;
	height: 24px;
	-webkit-mask-size: cover;
	mask-size: cover;
}

.btn .icon{
	display: inline-block;
	vertical-align: bottom;
	background-color: var(--btnColor-sub);
}

.icon-home{
	-webkit-mask-image: url('../img/svg-home.svg');
	mask-image: url('../img/svg-home.svg');
}

.icon-search{
	-webkit-mask-image: url('../img/svg-search.svg');
	mask-image: url('../img/svg-search.svg');
}

.icon-chat{
	-webkit-mask-image: url('../img/svg-chat.svg');
	mask-image: url('../img/svg-chat.svg');
}

.icon-coin{
	-webkit-mask-image: url('../img/svg-coin.svg');
	mask-image: url('../img/svg-coin.svg');
}

.icon-user{
	-webkit-mask-image: url('../img/svg-user.svg');
	mask-image: url('../img/svg-user.svg');
}

.icon-heart{
	-webkit-mask-image: url('../img/svg-heart.svg');
	mask-image: url('../img/svg-heart.svg');
}

.icon-crossmark{
	-webkit-mask-image: url('https://meet-up.jp/img/svg-crossmark.svg');
	mask-image: url('https://meet-up.jp/img/svg-crossmark.svg');
}

.icon-exclamation{
	-webkit-mask-image: url('../img/svg-exclamation.svg');
	mask-image: url('../img/svg-exclamation.svg');
}

.icon-info{
	-webkit-mask-image: url('../img/svg-info.svg');
	mask-image: url('../img/svg-info.svg');
}

.icon-camera{
	-webkit-mask-image: url('../img/svg-camera.svg');
	mask-image: url('../img/svg-camera.svg');
}

.icon-edit{
	-webkit-mask-image: url('../img/svg-edit.svg');
	mask-image: url('../img/svg-edit.svg');
}

.icon-mail{
	-webkit-mask-image: url('../img/svg-mail.svg');
	mask-image: url('../img/svg-mail.svg');
}

.icon-question{
	-webkit-mask-image: url('../img/svg-question.svg');
	mask-image: url('../img/svg-question.svg');
}

.icon-menuCircle{
	-webkit-mask-image: url('../img/svg-menuCircle.svg');
	mask-image: url('../img/svg-menuCircle.svg');
}

.icon-smartphone{
	-webkit-mask-image: url('../img/svg-smartphone.svg');
	mask-image: url('../img/svg-smartphone.svg');
}

.icon-send{
	-webkit-mask-image: url('../img/svg-send.svg');
	mask-image: url('../img/svg-send.svg');
}

.icon-close{
	-webkit-mask-image: url('../img/svg-crossmark-circle.svg');
	mask-image: url('../img/svg-crossmark-circle.svg');
}

.icon-reload{
	-webkit-mask-image: url('../img/svg-reload.svg');
	mask-image: url('../img/svg-reload.svg');
}

.icon-threeDots{
	-webkit-mask-image: url('../img/svg-threeDots.svg');
	mask-image: url('../img/svg-threeDots.svg');
}

.icon-leftArrow{
	-webkit-mask-image: url('../img/svg-leftArrow.svg');
	mask-image: url('../img/svg-leftArrow.svg');
}

.icon-arrowRight-circle{
	-webkit-mask-image: url('../img/svg-arrowRight-circle.svg');
	mask-image: url('../img/svg-arrowRight-circle.svg');
}

.icon-arrowRight-line{
	-webkit-mask-image: url('../img/svg-arrowRight-line.svg');
	mask-image: url('../img/svg-arrowRight-line.svg');
}

.icon-searchForm{
	-webkit-mask-image: url('../img/svg-searchForm.svg');
	mask-image: url('../img/svg-searchForm.svg');
}

.icon-settings{
	-webkit-mask-image: url('../img/svg-settings.svg');
	mask-image: url('../img/svg-settings.svg');
}

.icon-yen{
	-webkit-mask-image: url('../img/svg-yen.svg');
	mask-image: url('../img/svg-yen.svg');
}

.icon-creditCard{
	-webkit-mask-image: url('../img/svg-creditCard.svg');
	mask-image: url('../img/svg-creditCard.svg');
}

.icon-sun{
	-webkit-mask-image: url('../img/svg-sun.svg');
	mask-image: url('../img/svg-sun.svg');
}

.icon-moon{
	-webkit-mask-image: url('../img/svg-moon.svg');
	mask-image: url('../img/svg-moon.svg');
}

.icon-logout{
	-webkit-mask-image: url('../img/svg-logout.svg');
	mask-image: url('../img/svg-logout.svg');
}

/*-----------------------------------------------
モーダルウィンドウ
-----------------------------------------------*/
.modal{
	display: none;
}

#overlay{
	position: fixed;
	top:0; 
	left:0; 
	width:100%; 
	height:100%;
	height:100vh;
	background:rgba(0,0,0,.75);
	z-index: 9998;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	margin: 0 auto;
}

.modalwindowContents{
	width: 90%;
	max-width: 480px;
	max-height: 60vh;
	overflow-y: scroll;
	margin: 0 auto;
	padding: 16px;
	background:#fff;
	border-radius: 8px;
	position: relative;
	-ms-overflow-style: none;/*スクロールバー非表示（IE・Edge）*/
	scrollbar-width: none; /*スクロールバー非表示（Firefox）*/
}

/*スクロールバー非表示（Chrome・Safari）*/
.modalwindowContents::-webkit-scrollbar{
	display:none;
}

.modalwindowContents .tmb{
	width: 90%;
	height: auto;
	border-radius: 0;
	margin: 0 auto;
}

.modalwindowContents .contentsTitle{
	padding: 8px;
	margin-bottom: 16px;
	text-align: center;
	color: var(--textColor-main);
	background: none;
	border-bottom: 1px solid var(--borderColor-main);
}

.closeModal .icon-close{
	position: absolute;
	right: 8px;
	top: 8px;
	width: 32px;
	height: 32px;
	background-color: var(--btnColor-main-negativ);
}

/*アクションシート*/
#actionSheet.modal #overlay{
	justify-content: flex-end;
	padding-bottom: 30%;
}

@media print, ( min-width : 1025px ){
	#actionSheet.modal #overlay{
		padding-bottom:32px;
	}
}

.actionSheetContents{
	width: 90%;
	max-width: 480px;
	margin: 0 auto;
	background: rgba(255,255,255,.90);
	border-radius: 8px;
}

.action{
	display: block;
	padding: 16px 8px;
	width: 100%;
	text-align: center;
	color: #0068d0;
}

.action:not(:last-child){
	border-bottom: 1px solid #B2B2B4;
}

.action.cancel-matching,
.action.report,
.action.block,
.action.viewGallery.is-active{
	color: #e40039;
}

/*ダイアログボックス*/
.modal .btn{
	background: #e40039;
	border-radius: 8px;
}

/* マッチング時モーダル */
#matchingDisplay.modal #overlay{
	background: linear-gradient(135deg,#582bd4,#7c139c);
}

#matchingDisplay.modal .modalwindowContents{
	width: 100%;
	height: auto;
	color: #fff;
	max-width: none;
	max-height: none;
	background:none;
}

#matchingDisplay.modal .modalwindowContents .contentsTitle{
	background: none;
	border: none;
	color: #fff;
	font-size: 5rem;
}

#matchingDisplay.modal .tmb{
	width: 80px;
	height: 80px;
	margin: 0;
	border-radius: 50%;
	border: 3px solid #fff;
}

#matchingDisplay.modal .tmb:last-child{
	margin-left: -16px;
}

#matchingDisplay.modal .btn{
	color: var(--btnColor-main);
	background: #fff;
}

#matchingDisplay.modal .btn .icon{
	background-color: var(--btnColor-main);
}

/*-----------------------------------------------
スナックバー
-----------------------------------------------*/
.snackBar{
	position: fixed;
	top: 24px; 
	left:0; 
	right: 0;
	margin: 0 auto;
	width: 90%;
    max-width: 480px;
	height:64px;
	line-height: 64px;
	text-align: center;
	font-weight: bold;
	color: #fff;
	background: #00B589;
	border-radius: 8px;
	z-index: 9998;
}

/*Nope Like表示用*/
.snackBarDisplay{
	position: fixed;
	top: 8px; 
	left:0; 
	right: 0;
	z-index: 9998;
}

.snackBar-skip{
	position: static;
	color: #fff;
	background: #656d7a;
	margin-bottom: 16px;
}

.snackBar-like{
	position: static;
	color: #fff;
	background: #EC1D27;
	margin-bottom: 16px;
}

/*----------------------------------------------
表示制御系
-----------------------------------------------*/
.hide-sp{
	display: none;
}

.show-pc{
	display: none;
}

@media ( min-width : 1025px ){
	.hide-pc{
		display: none;
	}

	.show-pc{
		display: block;
	}
}

.textOverflowEllipsis{
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
}

/*----------------------------------------------
汎用BOX
-----------------------------------------------*/
.inBox{
	padding: 16px;
	box-shadow: 0 0 16px #e2e2e2;
	border-radius: 8px;
}

/*-----------------------------------------------
全体レイアウト
-----------------------------------------------*/
.inner{
	width: 100%;
	padding: 8px;
}

@media ( min-width : 1025px ){
	.container{
		width: 980px;
	}

	.inner{
		width: 600px;
		margin: 0 auto;
	}
}

/*----------------------------------------------
ヘッダー
-----------------------------------------------*/
header{
	width: 100%;
	position: fixed;
	top: 0;
	z-index: 996;
	background: var(--bgColor-header);
	box-shadow: 0 0 12px #ddd;
}

.headerInner{
	width: 100%;
	padding: 0 8px;
	height: var(--height-header);
}

#nonMemberTopPage .headerInner,
#nonMemberPage .headerInner{
	height:calc(var(--height-header) - var(--height-pageHeading));
}

.headerInner_right,.headerInner_center,.headerInner_left{
	height: 100%;
	display: grid;
	place-items: center;
}

.headerInner .icon{
	display: block;
	width: 30px;
	height: 30px;
	margin: 0 auto;
	background-color: #7f8499;
}

.headerInner .btn{
	width: auto;
    max-width: none;
    margin: 0;
    padding: 0;
    font-size: 1.5rem;
    color: var(--btnColor-main);
    background: none;
    border:none;
    border-radius: unset;
}

.headerInner .pageBack{
	margin: -8px 0;
	font-size: 1rem;
	text-align: center;
	color: #797979;
}

/*-----------------------------------------------
メインコンテナ
-----------------------------------------------*/
/*ログイン前後-共通（ヘッダー付きページ用）*/
.container-main{
	min-height: 100dvh;
	padding-top: var(--height-header);
	padding-bottom: var(--height-btmNavi-sp);
	background: var(--bgColor-main);
}

/* ログイン後-ボトムナビ付ページ */
.container-main.is-btmNaviPage{
	padding-top:0;

}

/* ログイン後-トークページ */
.container-main.is-talkPage{
	padding-top: var(--height-header);
	padding-bottom: calc(var(--height-messageSendBox) + 64px);
}

/*-----------------------------------------------
フッター
-----------------------------------------------*/
footer{
	width: 100%;
}

.container-footer{
	background: var(--bgColor-footer);
}

/*ログイン前共通*/
#nonMemberTopPage footer,
#nonMemberPage footer,
#pricePage footer{
	position: sticky;
	color: #fff;
	background: #d59696;
}

#nonMemberTopPage footer .logo,
#nonMemberPage footer .logo,
#pricePage footer .logo{
	margin: 24px auto;
	width: 26%;
}

@media ( min-width : 1025px ){
	#nonMemberTopPage footer .logo,
	#nonMemberPage footer .logo,
	#pricePage footer .logo{
		width: 200px;
	}
}

.footerMenu{
	margin: 24px 0;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
}

.footerMenu_link{
	display: block;
	padding: .5em;
	font-size: 1.4rem;
	color: #f9f9f9;
}

.footerMenu_link::after{
	content: "";
	display: inline-block;
	margin-left: 16px;
	width: 1px;
	height: 12px;
	background: #fff;
}

.footerMenu_link:last-child::after{
	display: none;
}

/*-----------------------------------------------
タブメニュー
-----------------------------------------------*/
.tabMenuList_item{
	width: 49%;
	text-align: center;
	font-weight: bold;
	padding: 8px;
}

.tabMenuList_item_link{
	display: block;
	width: 100%;
	color: var(--btnColor-main-negativ);
}

.tabMenuList_item.active{
	color:var(--btnColor-main);
	border-bottom: 2px solid var(--btnColor-main);
}

/*-----------------------------------------------
ボトムナビゲーション
-----------------------------------------------*/
.bottomNavigationArea{
	position: fixed;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	z-index: 996;
}

.bottomNavigationArea .inner{
	padding: 0;
}

.bottomNavigation{
	background: var(--bgColor-main);
}

.bottomNavigation_item{
	display: block;
	flex: 1;
	text-align: center;
	font-size: 1rem;
}

.bottomNavigation_item:last-child{
	border:none;
}

.bottomNavigation_item_link{
	display: grid;
    place-items: center;
	padding-top: 8px;
	width: 100%;
	height: var(--height-btmNavi-sp);
	font-weight: bold;
	color:var(--navigationColor-main);
	position:relative;
}

.bottomNavigation_item_link.is-active{
	color:var(--navigationColor-sub);
}

.bottomNavigation_item_link::before{
	content: '';
	display: block;
	width: 30px;
	height: 30px;
	-webkit-mask-size: cover;
	mask-size: cover;
	background-color: var(--navigationColor-main);
}

.bottomNavigation_item_link.is-active::before{
	background-color:var(--navigationColor-sub);
}

.bottomNavigation_item_link.toTop::before{
	-webkit-mask-image: url('../img/icon-check-circle.png');
	mask-image: url('../img/icon-check-circle.png');
}

.bottomNavigation_item_link.toLikeList::before{
	-webkit-mask-image: url('../img/icon-thumbsUp.png');
	mask-image: url('../img/icon-thumbsUp.png');
}

.bottomNavigation_item_link.toTalkList::before{
	-webkit-mask-image: url('../img/icon-chat.png');
	mask-image: url('../img/icon-chat.png');
}

.bottomNavigation_item_link.toMyPage::before{
	-webkit-mask-image: url('../img/icon-user.png');
	mask-image: url('../img/icon-user.png');
}

/*-----------------------------------------------
入力フォーム
-----------------------------------------------*/
.formBox{
	padding: 24px
}

.formBox_item{
	padding: 16px 0;
}

@media ( min-width : 1025px ){
	.formBox_item{
		padding: 24px 0;
	}
}

/*写真加工*/
.formBox_item-effect{
	padding: 16px 0 0;
	width: 50%;
	margin: 0 auto;
}

/*ステップ表示*/
.stepsList{
	margin-bottom: 24px;
}

.stepsList_item{
	width: 50%;
	text-align: center;
	color: #a3a3a3;
	position: relative;
}

.stepsList_item .number{
	display: block;
	margin: 0 auto 4px;
	width: 24px;
	height: 24px;
	text-align: center;
	background:  #fff;
	border: 1px solid #e5e5e5;
	border-radius: 50%;
}

.stepsList_item.is-active{
	color: var(--siteColor-main);
	font-weight: bold;
}

.stepsList_item.is-active .number{
	color: #fff;
	background:var(--siteColor-main);
	border-color: var(--siteColor-main);
}

.stepsList_item.is-active:nth-of-type(2):before{
	background: var(--siteColor-main);
}

.stepsList_item:nth-of-type(2):before{
	position: absolute;
	top: 8px;
	left: -40%;
	content: "";
	display: block;
	width: 80%;
	height: 2px;
	background: #e5e5e5;
}

input[type="checkbox"]:checked + .altCheckBox{
	color: var(--btnColor-main);
}

input[type="checkbox"]:checked + .altCheckBox:after{
    border: 2px solid #5c7bab;
}

input[type="checkbox"]:checked + .altCheckBox:before{
	opacity: 1;
	border-right: 3px solid #5c7bab;
	border-bottom: 3px solid #5c7bab;
}

.checkboxMust{
	color: #ff0000;
	font-size: 1.25rem;
}

/*-----------------------------------------------
slick slider
-----------------------------------------------*/
.slick-slider {
	margin-bottom: 0;
}

.slick-prev,
.slick-next{
	top: 46%;
}

.slick-prev{
	left: 8px;
	z-index: 1;
}

.slick-next{
	right: 8px;
}

.slick-prev,.slick-next{
	width: 32px;
	height: 32px;
}

.slick-prev:before,.slick-next:before{
	content: '';
	display: block;
	width: inherit;
	height: inherit;
}

.slick-prev:before,.slick-next:before{
	background-color: rgba(0, 0, 0,.2);
	background-size: 30%;
	background-repeat: no-repeat;
	background-position: center;
	border-radius: 50%;
}

.slick-prev:before{
	background-image: url(../img/img-icon-arrowLeft-circle.png);
}

.slick-next:before{
	background-image: url(../img/img-icon-arrowRight-circle.png);
}

.slick-dots{
	bottom: 0;
}

.slick-dots li button:before{
	content: '';
	width: 12px;
	height: 12px;
	background: #000;
	opacity: .5;
}

.slick-dots li.slick-active button:before{
	background: #fff;
}

.slider.slick-initialized {
	opacity: 1
}

/*-----------------------------------------------
事前登録用(サービスイン後削除)
-----------------------------------------------*/
/*事前登録用バナー*/
body.preOpen-topPage footer{
	padding-bottom: 130px;
}

.preRegistBanner{
	position: fixed;
	left: 0;
	right: 0;
	bottom: 16px;
	margin: auto;
	width: 360px;
	display: block;
	border: 2px solid #fff;
	box-shadow: 0 0 8px #fff;
	z-index: 999;
}

@media ( min-width : 1025px ){
	.preRegistBanner{
		left: unset;
		right: 24px;
		bottom: 24px;
		width: 720px;
	}
}

.preOpen-thanksPage .inner{
	width: auto;
	margin: 0 auto;
}

.preThanksText{
	font-weight: bold;
	text-align: center;
}

.preThanksText-md{
	font-size:1.8rem;
}

.preThanksText-lg{
	font-size: 4rem;
	font-weight: bold;
	text-align: center;
}

.preThanksMsg{
	margin: 32px auto;
}

.preThanksCampaignMsg{
	margin: 32px auto;
	padding: 16px;
	border: 1px solid #f00;
	background: #fff;
	border-radius: 8px;
}

.preOpen-thanksPage .memo{
	border: none;
	font-weight: bold;
}

.preOpen-thanksPage .memo p{
	margin-bottom: 8px;
	font-size: 1.6rem;
	text-align: center;
	color: #000;
}

.contactmemo a{
	font-weight: bold;
	color: #5c7bab;
}

@media ( min-width : 1025px ){
	body#thanksPage.preOpen-thanksPage .contentsTitle{
		font-size: 3.2rem;
	}
	
	.preThanksText{
		font-size: 2rem;
	}
	
	.preThanksText-md{
		font-size: 3rem;
	}

	.preThanksText-lg{
		font-size: 8rem;
	}

	.preOpen-thanksPage .memo p{
		font-size: 2rem;
	}
}

/*-----------------------------------------------
ログイン前TOP
-----------------------------------------------*/
/*header*/
#nonMemberTopPage header{
	transition: 0.3s;
	transform: translateY(-100px);
}

#nonMemberTopPage header.is-show{
	transform: translateY(0px);
}

#nonMemberTopPage header .headerInner{
	height: var(--height-header);
}

#nonMemberTopPage .headerInner .logo{
	display: block;
	width: 100px;
}

@media ( min-width : 1025px ){
	#nonMemberTopPage .headerInner .logo{
		width: 120px;
	}
}

#nonMemberTopPage .headerInner .headerInner_right{
	display: flex;
	justify-content: center;
	width: 192px;
}

@media ( min-width : 1025px ){
	#nonMemberTopPage .headerInner .headerInner_right{
		width: 320px;
	}
}

#nonMemberTopPage .headerInner .textLink-toRegistration{
	color: #d59696;
}

#nonMemberTopPage .headerInner .btn-toLogin{
	color: #d59696;
	width: 96px;
	padding: 0.25em;
	text-align: center;
	background: none;
	border: 1px solid #d59696;
	border-radius: 24px;
}

@media ( min-width : 1025px ){
	#nonMemberTopPage .headerInner .btn-toLogin{
		width: 160px;
		padding: 0;
	}
}

.textLink-toRegistration,.btn-toLogin,.btn-toNewRegist{
	display: block;
	width: 96px;
	margin: 0 auto;
	padding: .25em;
	text-align: center;
	color: #000;
	font-weight: bold;
}

@media ( min-width : 1025px ){
	.textLink-toRegistration,.btn-toLogin,.btn-toNewRegist{
		width: 160px;
		height: 40px;
		line-height: 40px;
		padding: 0;
	}
}

#nonMemberTopPage .btn{
	color: #fff;
	background: #d59696;
}

/*コンテンツ共通*/
/*main*/
#nonMemberTopPage main{
	background: var(--bgColor-main);
}

.contents{
	width: 100%;
	padding-top: 40px;
}

.minchoFont{
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "MS P明朝", "MS 明朝", serif;
}

#nonMemberTopPage .list{
	width: 85%;
	margin: 0 auto;
	padding:24px 0;
}

#nonMemberTopPage .list_item{
	margin-bottom: 24px;
	padding: 16px 10px;
	border: none;
	align-items: center;
}

@media ( min-width : 1025px ){
	#nonMemberTopPage .list{
		width: 100%;
		padding:48px 0;
		align-items: flex-start;
	}
	.securityList_item{
	width: 25%;
	}
}

/*ファーストビュー*/
.firstViewWrapper{
	height: 100vh;
	background-image:url(../img/firstViewWrapperBg.jpg);
	background-size: cover;
	background-position: center center;
}

.firstView{
	width: 100%;
	height: 100vh;
	position: relative;
}

.firstView_top{
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	padding-right: 4%;
}

.firstView_top_ribon{
	display: block;
	width: 40%;
	max-width: 215px;
	object-fit: contain;
}

.firstView_top_btns{
	display: flex;
	justify-content: center;
	width: 50%;
	max-width: 320px;
	padding-top: 24px;
	gap: 4%;
}

.firstView_top_btns .btn-toLogin, .firstView_top_btns .btn-toNewRegist{
	background: rgba(255, 255, 255, 0.7);
	border-radius: 128px;
	border: 1px solid #000;
}

.firstView_bottom{
	position: absolute;
	top: 70%;
	left: 0;
	right: 0;
	margin: 0;
}

.firstView_bottom_siteName{
	display: block;
	width: 120px;
	margin: -16px auto 0;
}

.firstView_bottom .btn-toRegistration{
	margin: 0 auto;
}

.firstView_bottom .textCaution{
	color: #000;
}

@media ( min-width : 1025px ){
	.firstView_bottom .btn-toRegistration{
		width: 400px;
		font-size: 2rem;
		border-radius: 128px;
	}
	
	.firstView_bottom .textCaution{
		font-size: 2rem;
	}
}


/*meetとは*/
.about_text{
	padding: 16px;
}

.about_cautionWrapper{
	position: relative;
	width: 100%;
	margin-bottom: 16vh;
}

.about_cautionBox{
	position: absolute;
	top: 100%; /*親要素の下端（高さの100%）を基準に配置*/
	left: 50%; /*親要素の横幅の50%（中央）に配置*/
	transform: translate(-50%, -30%); /* 自分の幅の50%左、高さの50%上に移動（= 中央補正） */
	padding: 8px 16px;
	width: 92%;
	max-width: 720px;
	background:#f7f1e8;
	border-radius: 10px;
	box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.4);
	z-index: 1;
}

.about_cautionBox_title{
	margin-bottom: 8px;
	font-size: clamp(16px, 1.8vw, 30px);
	font-weight: bold;
	text-align: center;
}

.about_cautionBox_text{
	font-size: 3vw;
}

@media ( min-width : 1025px ){
		.about_text{
		text-align: left;
	}

	.about_cautionBox_text{
	font-size: 1.6rem;
	}
}

/*Meetの特徴*/
.featureList_item_title{
	width: 100%;
	text-align: center;
	font-weight: bold;
	margin-bottom: 8px;
	padding-bottom: 8px;
	border-bottom: 1px solid #d59696;
}

.featureList_item{
	padding-bottom: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-evenly;
	padding: 0;
}

.feature_pic{
	display: block;
	width: 45%;
	object-fit: contain;
}

.feature_text{
	width: 55%;
	padding: 16px;
}

@media ( min-width : 1025px ){
	.featureList{
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
	}

	.featureList_item{
		width: 30%;
		margin: 0;
		flex-direction: column;
	}

	.featureList_item_title{
		width: 250px;
		order: 2;
		border-bottom-width: 2px;
	}

	.feature_pic{
		order: 1;
		width: 240px;
		margin: 0 auto 16px;
	}

	.feature_text{
		width: 100%;
		order: 3;
	}
}

/*お悩み*/
.contents.contents-problem{
	padding: 0;
}

/*支持率*/

.worryImg{
	display: block;
	margin: 0 auto;
	width:50%;
}

.problemTextArea{
	padding: 48px 0;
	background: #f7f1e8;
	position: relative;
	font-size: clamp(18px, 1.8vw, 30px);
}

.problemTextArea::after{
	content: '';
	position: absolute;
	left: 50%;
	bottom: -10px;
	transform: translateX(-50%);
	width: 0;
	height: 0;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-top: 10px solid #f7f1e8; 
}

.problemTextPoint{
	color: #d59696;
	font-size: clamp(20px, 2vw, 32px);
}

.problemText{
	font-size: clamp(16px, 1.2vw, 28px);
}

@media ( min-width : 1025px ){
	.problemWrapper{
		background: #f7f1e8;
	}

	.contents-problem{
		position: relative;
	}

	.worryImg{
		width: 30%;
        position: absolute;
        left: -14px;
        top: -56px;
        z-index: 1;
	}
}

.supportTextArea{
	padding-bottom: 80px;
}

.supportTextPoint{
	color: #d59696;
	font-size: clamp(20px, 2vw, 32px);
}

.supportText{
	font-size: clamp(16px, 1.2vw, 28px);
}

@media ( min-width : 1025px ){
	.graphImg{
	display: flex;
	}
}

.graph_pic{
	display: block;
	width: 72%;
	max-width: max-content;
	margin: 0 auto 8%;
}

/*安心と安全の対策*/
.securityList_item .icon{
	display: block;
	margin: 0 auto;
	width: 80px;
	height: auto;
}

.securityList_item_title{
	color: #d59696;
	font-weight: bold;
	padding: .8em;
	text-align: center;
	font-size: 1.8rem;
}

.securityList a{
	text-decoration: underline;
}

@media ( min-width : 1025px ){
	.contents-security h2{
		padding-bottom: 8px;
		border-bottom: 2px solid #000;
	}

	.securityList{
		display: flex;
		align-items: center;
	}
}

/*コミュニティガイドライン*/
.contents-faq{
	padding: 32px 0;
}

.guidelineList_item{
	display: block;
	margin: 0 auto;
	width: 100%;
	height: auto;
	box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.4);
	border-radius: 24px;
}

.guidelineList_item .icon{
	display: block;
	margin: 0 auto;
	width: 60px;
	height: auto;
}

.guidelineList_item_title{
	color: #d59696;
	font-weight: bold;
	padding: .8em;
	text-align: center;
	font-size: 1.8rem;
}

.guidelineList_item_text{
	padding: 0px 16px;
}

.guidelineList_item_text a{
	text-decoration: underline;
}

.faq_anchorLink{
	font-size: 1.75rem;
	text-decoration: underline;
	padding-bottom: 40px;
}

@media ( min-width : 1025px ){
	.contents-guideline h2{
		padding-bottom: 8px;
	}

	.guidelineList{
		display: flex;
	}

	.guidelineList_item{
		width: 48%;
		padding: 24px 16px;
	}
}

/*今すぐ無料登録*/
.enrtyWrapper{
	background: #fbf8f3;
}

.contents-enrty{
	padding: 40px 0;
	position: relative;
	overflow: hidden;
	z-index: 0;
}

.entry-leadTitle{
	text-align: center;
	font-size: 1.75rem;
}

.imgContentsTitle-substantial{
	margin-bottom: 24px;
}

.substantial_pic{
	display: block;
	width: 44%;
	margin: 0 auto;
}

.captureImg{
	width: 90%;
	max-width: 640px;
	margin: 0 auto 8%;
}

@media ( min-width : 1025px ){
	.contents-enrty{
		padding: 64px 0;
	}
	
	.contents-enrty::before{
		width: 980px;
		height: 980px;
		top: -690px;
	}
	
	.imgContentsTitle-substantial{
		width: 420px;
	}
	
	.entry_pic{
		width: 555px;
	}
}

/*ご利用の流れ*/
.contents-usage .sliderWrapper{
	display: flex;
	align-items: center;
	flex-direction: column;
	padding: 24px 0;
}

.contents-usage .mobileFrame{
	width: 240px;
	height: 480px;
	z-index: 1;
	overflow: hidden;
}

/*スライダー*/
.step-leadTitle{
	font-size: 1.75rem;
}

.slider-mobileDisplay{
	position: absolute;
	width: 220px;
	height: 470px;
	opacity: 0;
	transition: opacity .2s linear;
	border-radius: 32px;
	overflow: hidden;
}

.slider-mobileDisplay .slider_item{
	padding-top: 32px;
}

.usage_steps{
	display: block;
	width: 90%;
	max-width: 640px;
	margin: 0 auto;
}

@media ( min-width : 1025px ){
	.sliderWrapper{
		margin-left: 140px;
	}

	.contents-usage_inner{
		display: flex;
		justify-content: space-around;
		align-items: center;
	}

	.usage_steps{
		width: 400px;
		margin: 0;
	}
}

/*オープン1周年*/
.anniversaryWrapper{
	display: grid;
	place-items: center;
	align-items: center;
	margin: 40px auto;
	padding: 64px 0 24px;
	background-image: url(../img/bg_glitter.jpg);
	background-position: 50%;
	background-size: cover;
}

.anniversaryText{
	display: block;
	width: 72%;
	max-width: 640px;
}

/*利用者の声*/
.slider-review{
	width: 95%;
	margin: 0 auto;
	overflow: hidden;
}

@media ( min-width : 1025px ){
	.slider-review{
		width: 100%;
	}
}

.slider-review .slick-prev,
.slider-review .slick-next{
	width: 24px;
	height: 24px;
	top: 47%;
}

.slider-review .slick-prev{
	left: 0;
}

.slider-review .slick-next{
	right: 0;
}

@media ( min-width : 1025px ){
	.slider-review .slick-prev,
	.slider-review .slick-next{
		width: 32px;
		height: 32px;
		top: 48%;
	}

	.slider-review .slick-prev{
		left: 8px;
	}

	.slider-review .slick-next{
		right: 8px;
	}
}

.slider-review .slick-prev:before, 
.slider-review .slick-next:before {
    background-color: rgb(233 94 94 / 40%);
}

#nonMemberTopPage .list.reviewList{
	margin: 0 8px;
	padding: 0;
	display: flex;
	justify-content: space-evenly;
	flex-direction: column;
}

#nonMemberTopPage .reviewList_item{
	margin-bottom: 32px;
	padding: 16px;
	background: #f7f1e8;
	border-radius: 24px;
}

@media ( min-width : 1025px ){
	#nonMemberTopPage .reviewList_item{
		margin-bottom: 24px;
		padding: 16px 30px;
	}
}

.reviewer{
	padding-bottom: 16px;
	border-bottom: 1px solid #d59696;
}

.reviewer_details{
	width: calc(100% - 80px);
}

.reviewerNumber{
	width: 45%;
}

.reviewTitle{
	padding: 8px 0;
	font-size: 1.5rem;
	font-weight: bold;
	color: #d59696;
}

@media ( min-width : 1025px ){
	.reviewTitle{
		font-size: 1.6rem;
	}
}

.reviewer_pic{
	width: 80px;
	height: 80px;
}

.reviewText{
	padding: 16px 0;
}

@media ( min-width : 1025px ){
	#nonMemberTopPage .list.reviewList{
		flex-direction: row;
	}

	.reviewList_item{
		width: 48%;
	}

	.reviewer{
		border-bottom-width: 2px;
		gap: 20px;
	}

	.reviewTitle{
		font-size: 1.75rem;
	}

	.reviewer_pic{
		width: 160px;
		height: 160px;
	}

	.reviewText{
		padding: 24px 0;
	}
}

/*よくある質問*/
#faq{
    padding-top: 72px;
}

.faqList{
	padding: 32px;
}

.faq_details{
	width: 100%;
	padding: 16px;
	border-bottom:  solid 1px #C0C0C0;
}

.faq_details .flexNoWrap{
	align-items: center;
}

.icon-q, .icon-a {
    width: 30px;
    height: 30px;
    background-size: cover;
}

.icon-q {
    background: url(../img/icon-question.png);
    margin: 8px 0px;
}

.icon-a {
    background: url(../img/icon-answer.png);
    margin: 8px 0px;
}

.faq_q{
	padding-bottom: 16px;
}

.faq_question, .faq_answer{
	width: calc(100% - 30px);
	padding: 0 8px;
}

.faq_question{
	color: #d59696;
	font-size: 2rem;
	font-weight: bold;
	line-height: 2.25rem;
}

.faq_answer{
	line-height: 2rem;
}

/*Meetの想い*/
.mindWrapper{
	padding-bottom: 240px;
}

.containerWrapper-mind{
	height: 72vh;
	background-image: url(../img/couple_pic.jpg);
	background-repeat: no-repeat;
	background-position: 54%;
	background-size: cover;
	position: relative;
}

@media ( min-width : 1025px ){
	.containerWrapper-mind{
		height: 793px;
		background-position: top center;
	}
}

.contents.contents-mind{
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translate(-50%, -65%);
    z-index: 1;
}

.mindPicForSp{
	display: block;
	height: 72vh;
	object-fit: cover;
	object-position: top;
}

.mindTextArea{
    margin-bottom: 4%;
}

.mindTitle{
	font-size: clamp(24px, 2.4vw, 32px);
	color: #fff;
}

.mindText{
	color: #fff;
	padding: 0 16px;
	font-size: 1.4rem;
}

.mindEntryArea{
	width: 90%;
	margin: 0 auto;
	padding: 24px 16px;
	background: #fff;
	box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.4);
}

.mindEntryArea .btn{
	margin: 24px auto;
}

@media ( min-width : 1025px ){
	.mindPicForSp{
		display: none;
	}

	.contents.contents-mind{
		width: 40%;
		transform: translate(-50%, -80%);
	}
}

/*-----------------------------------------------
モーダルウィンドウ（TOP年齢確認用のポップアップ）
-----------------------------------------------*/
#modalAge{
	display: none;
}

#modalwindowAge{
	position: fixed;
	top:0; 
	left:0; 
	width:100%; 
	height:100%;
	height:100vh;
	background:rgba(0,0,0,.75);
	z-index: 9998;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	margin: 0 auto;
}

#modalAge.forNotification .modalwindowAgeContents{
	width: 90%;
	max-width: 480px;
	max-height: 80vh;
	overflow-y: scroll;
	margin: 0 auto;
	padding-bottom: 24px;
	background:#fff;
	border-radius: 8px;
	position: relative;
	-ms-overflow-style: none;/*スクロールバー非表示（IE・Edge）*/
	scrollbar-width: none; /*スクロールバー非表示（Firefox）*/
}

/*スクロールバー非表示（Chrome・Safari）*/
#modalAge.forNotification .modalwindowAgeContents::-webkit-scrollbar{
	display:none;
}

#modalAge.forNotification .modalwindowAgeContents .contentsTitle{
	border-bottom: 1px solid var(--borderColor-main);
}

.modalAge_sitelogo{
	width:100%;
	background: #d59696;
}

.modalAge_sitelogo img{
	width: 24%;
	top: 0;
	left: 0;
	margin: 0 auto;
}

.modalAge_img{
	padding: 10px;
}

.modalAge_icon{
	width: 16%;
	top: 0;
	left: 0;
	margin: 0 auto;
}

.modalAgeTitle{
    color: #d59696;
    font-weight: bold;
    text-align: center;
    font-size: 1.8rem;
}
.modalwindowAgeContents .btn-cancel {
    color: var(--btnColor-main);
    background: var(--btnColor-sub);
    border: 1px solid #fff;
    margin-bottom: 0;
}

/*-----------------------------------------------
料金案内（ログイン後前共通）
-----------------------------------------------*/
body#pricePage{
	background: #fff;
}

#pricePage .contentsWrapper{
	padding: 0 30px;
	margin: 0 auto;
}

#pricePage .contentsTitle{
	padding: 32px 0;
	text-align: center;
	color: #000;
	background: none;
	border: none;
}

@media ( min-width : 1025px ){
	#pricePage .contentsTitle{
		padding: 64px 0;
		font-size: 2.6rem;
	}
}

#pricePage .hide-pc .tmb{
	margin-bottom: 24px;
}

@media ( min-width : 1025px ){
	#pricePage .show-pc .tmb{
		margin-bottom: 48px;
	}
}

#pricePage .paymentsWrapper{
	margin-top: 72px;
	background: var(--siteColor-main);
}

.paymentsWrapper .tmb{
	margin-top: -72px;
	box-shadow: 0 0 8px #c7c7c7;
}

@media ( min-width : 1025px ){
	.paymentsWrapper .btn{
		font-size: 2rem;
		border-radius: 48px;
	}
}	

/*-----------------------------------------------
会社概要（ログイン前）
-----------------------------------------------*/
.companyTitle{
	display: block;
	width: 30%;
	left: 0;
	right: 0;
	margin: 0 auto;
	padding-top: 40px;
}

.contentsCompany{
	padding-bottom: 48px;
}

.companyList_itemList .flexNoWrap{
	align-items: center;
}

.companyProfile, .companyHistory{
	padding: 12px 0;
	text-align: center;
	font-size: 2.4rem;
	font-weight: bold;
	background: none;
	border-bottom: 1px solid var(--siteColor-main);
}

.companyList_itemList{
	padding-top: 24px;
}

.companyList_item{
	padding-bottom: 16px;
}

.companyList_item_title{
	color: var(--siteColor-main);
	font-weight: bold;
	width: 20%;
}

.companyList_item_text{
	line-height: 2rem;
	margin-left: 16px;
	width:80%;
}

.companyList_item_year{
	font-weight: bold;
	width: 30%;
}

.companyList_item_memo{
	line-height: 2rem;
	margin-left: 16px;
	width: 70%;
}

.login-caution a{
	color: var(--siteColor-main);
}

/*-----------------------------------------------
初期登録
-----------------------------------------------*/
.altRadioBtn.female,.altRadioBtn.male{
	width: 48%;
	border-radius: 24px;
}

/* メイン写真 */
.formBox-registrationPic .preview{
	width: 240px;
	height: 360px;
	margin: 0 auto;
}

/*-----------------------------------------------
アカウント作成
-----------------------------------------------*/
.regist_explain {
	height:200px;
	overflow-y:scroll;
	border:1px solid #e5e5e5;
	margin-bottom:20px;
	padding: 10px 50px;
}

.registExplainTitle {
	font-weight: bold;
	text-align: center;
	font-size: 2rem;
}

.altCheckBox-agree{
	color: #000;
	font-weight: normal;
}

.altCheckBox-agree:before{
	top:5%;
}

input[type="checkbox"]:checked + .altCheckBox-agree{
	font-weight: normal;
}

.registCaution{
	color: #666;
}

.errorLinkCaution {
	color: #fff;
	text-decoration: underline;
}

/*-----------------------------------------------
アカウント作成完了
-----------------------------------------------*/
.registCompletePage img {
	width:0px;
	height:0px;
}

/*-----------------------------------------------
登録完了
-----------------------------------------------*/
body#thanksPage{
	background: url(../img/bg-thanks.jpg);
	background-size: cover;
	background-attachment: fixed;
}

#thanksPage .container-main{
	background: none;
}

#thanksPage .container-main .inner{
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	height: calc(100dvh - var(--height-btmNavi-sp) - 16px);
}

#thanksPage .contentsTitle{
	padding: 0;
	text-align: center;
	font-size: 2.4rem;
	background: none;
	border: none;
}

.oniku{
	display: block;
	width: 60px;
	margin: 40px auto;
}

#thanksPage .btn{
	width: 90%;
	max-width: none;
	margin: 40px auto;
	font-size: 2.4rem;
	color: var(--btnColor-main);
	border: 1px solid var(--btnColor-main);
	background: none;
	border-radius: 8px;
}

#thanksPage .btn .icon{
	width: 40px;
	height: 40px;
	margin-right: 8px;
	margin-bottom: 4px;
	background-color: var(--btnColor-main);
	vertical-align: middle;
}

.letsMeet{
	display: block;
	width: 120px;
}

@media ( min-width : 1025px ){
	.oniku{
		width: 120px;
	}

	#thanksPage .btn{
		font-size: 3.2rem;
	}

	.letsMeet{
		width: 200px;
	}
}

#thanksPage .bottomNavigation{
	background: none;
}

/*-----------------------------------------------
初期設定
-----------------------------------------------*/
body#initialSettingPage{
	background: #fff;
}

#initialSettingPage main{
	padding-top: var(--height-header);
}

#initialSettingPage .contentsWrapper{
	padding: 24px 0;
}

@media ( min-width : 1025px ){
	#initialSettingPage p{
		text-align: center;
	}

	#initialSettingPage .contentsWrapper{
		padding: 40px 0;
	}
}

#initialSettingPage .contentsTitle{
	margin: 0 auto;
	font-size: 1.8rem;
	text-align: center;
	font-weight: bold;
	background: none;
}

#initialSettingPage .memo{
	margin: 24px auto;
	padding: 8px;
	color: #fff;
	background: #ec1d27;
	border-radius: 8px;
}

@media ( min-width : 1025px ){
	#initialSettingPage .inner{
		width: 100%;
	}

	#initialSettingPage .pageTitle{
		font-size: 2.6rem;
	}

	#initialSettingPage .contentsTitle{
		font-size: 2.6rem;
		border: none;
	}

	.show-pc.img-initialSetting_bookMark{
		display: block;
		width: 650px;
		margin: 64px auto;
	}
}

.browserModeListTitle{
	padding: 16px;
	font-weight: bold;
	text-align: center;
	border-bottom: 2px solid var(--siteColor-main);
}

@media ( min-width : 1025px ){
	.browserModeListTitle{
		font-size: 2.4rem;
		border-bottom-width: 6px;
	}
}

.browserModeList{
	padding: 24px 0;
}

.browserModeList .browserModeList_item{
	padding: 16px 8px;
}

.browserModeList_item .icon-browser{
	display: block;
	width: 48px;
	height: 48px;
	margin-right: 8px;
}

@media ( min-width : 1025px ){
	.browserModeList{
		display: flex;
		justify-content: space-evenly;
		align-items: center;
	}

	.img-notificationSetting{
		display: block;
		width: 630px;
		margin: 64px auto 0;
	}
}

.img-notificationSetting-sp{
	display: block;
}

.img-notificationSetting-sp:not(:last-of-type){
	margin-bottom: 16px;
}

.img-icon-arrow-red-under{
	display: block;
	margin: 16px auto;
	width: 30px;
}

@media ( min-width : 1025px ){
	.notificationSettingFlow-pc{
		padding: 40px 0;
	}

	.img-notificationSetting-pc{
		display: block;
	}

	.img-icon-arrow-red-right{
		display: block;
		margin: 16px;
		width: 30px;
	}
}

/*-----------------------------------------------
プロフィール項目関連
-----------------------------------------------*/
.tmb{
	display: block;
	object-fit: cover;
}

.name,.area,.age{
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}

.comment{
	padding: 16px 0;
}

.badge{
	display: inline-block;
	width: 20px;
	height: 20px;
	object-fit: cover;
	margin:0 0 4px 4px;
	vertical-align: middle;
}

/*スライダー（プロフィール写真用)*/
.slider-userPics .slick-dots{
	top: 8px;
	bottom: unset;
}

.slider-userPics .tmb{
	width: 100%;
	height: 80vh;
}

/*-----------------------------------------------
おすすめ(index)
-----------------------------------------------*/
#memberTopPage .container-main{
	background: none;
}

#memberTopPage .container-main .inner{
	padding: 0;
	min-height: calc(100dvh - var(--height-btmNavi-sp));
	background: var(--bgColor-main);
}

.recommendUser{
	position: relative;
}

.recommendUser .slider-userPics{
	overflow: hidden;
}

.recommendUser .slider-userPics .tmb{
	height:calc(100dvh - var(--height-btmNavi-sp));
	/* 画面の高さから フッターメニュー56px引く */
}

.recommendUser .userProfile{
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	padding: 0 16px 8px;
	color: #fff;
	background: linear-gradient(rgba(0,0,0,0) 1% ,rgba(0,0,0,.8) 75%);
	overflow: hidden;
}

.recommendUser .userProfile .btnWrapper .btnName{
	display: inline-block;
	width: 100%;
	font-size: 1.1rem;
	text-align: center;
}

.recommendUser .userProfile .btn{
	margin: 8px auto 0;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	border: none;
}

.recommendUser .userProfile .btn-toProfileDetails{
	margin: 0;
	padding: 0;
	width: 30px;
	height: 30px;
	background: #fff;
}

.btn-toLikeDetails{
	margin: 0;
	padding: 0;
	width: 30px;
	height: 30px;
	background: #fff;
}

@media ( min-width : 1025px ){
	.recommendUser .userProfile .btnWrapper .btnName{
		margin-top: 4px;
		font-size: 1.6rem;
	}
	
	.recommendUser .userProfile .btn{
		width: 64px;
		height: 64px;
	}
	
	.recommendUser .userProfile .btn-toProfileDetails{
		width: 40px;
		height: 40px;
	}
}

.recommendUser .userProfile_inner{
	color: #fff;
}

.recommendUser .userProfile_inner .name{
	font-weight: bold;
	font-size: 3.2rem;
}

.recommendUser .userProfile_inner .age,
.recommendUser .userProfile_inner .area{
	font-size: 2rem;
}

.recommendUser .userProfile_inner .comment{
	margin-bottom: 16px;
	padding: 0;
	font-size: 1.5rem;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 4;
	overflow: hidden;
} 

/*-----------------------------------------------
データ無し用表示
-----------------------------------------------*/
.noData{
	margin: 25% auto 0;
	height: 100%;
}

.noData .icon{
	display: block;
	width: 160px;
	height: 160px;
	margin: 32px auto;
	background-color: #dfdfdf;
}

.noData_text{
	text-align: center;
	font-weight: bold;
	color: #797979;
}

/*-----------------------------------------------
ユーザ一覧（相手から/マッチング中）
-----------------------------------------------*/
.userList .list_item{
	width: 49%;
	height: calc(100vh / 3);
	min-height: 220px;
	margin-bottom: 16px;
	border: none;
	position: relative;
}

.userList .tmb{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border-radius: 8px;
}

.userList .userProfile{
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	padding: 16px 12px;
	background: linear-gradient(rgba(0,0,0,0) 1% ,rgba(0,0,0,.8) 75%);
	border-radius: 8px;
	overflow: hidden;
}

.userList .userProfile_inner{
	width: calc(100% - 40px);
	color: #fff;
}

.userList .name{
	font-size: 2rem;
	font-weight: bold;
}

.userList .btn{
	margin: 0;
	padding: 0;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	border: none;
	display: grid;
	place-items: center;
}

.userList .btn-skip,
.userList .btn-like{
	padding: 8px;
}

/*相手から男性プラン未加入用*/
.userList-forMen .list_item{
	overflow: hidden;
	border-radius: 8px;
}

.userList-forMen .tmb{
	filter: blur(10px); 
}

#matchingDisplayUserList.userList{
	padding-top: 8px;
}

/*マッチング中リスト*/
#matchingUserList.userList{
	padding-top:8px;
}

/*-----------------------------------------------
トーク中
-----------------------------------------------*/
#talkingUserList .item_left{
	position: relative
}

#talkingUserList .item_left .tmb{
	width: inherit;
	height: inherit;
	border-radius: 50%;
}

#talkingUserList .mailStatus{
	position: absolute;
	bottom: 0;
	right: 4px;
}

#talkingUserList .mailStatus .read,
#talkingUserList .mailStatus .unread{
	width: 18px;
	height: 18px;
	border-radius: 50%;
	border: 2px solid #fff;
}

#talkingUserList .mailStatus .read{
	background:var(--mailStatusColor-sub);
}

#talkingUserList .mailStatus .unread{
	background:var(--mailStatusColor-main);
}

.message{
	font-size: 1.4rem;
	width: 100%;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}

/*-----------------------------------------------
トーク
-----------------------------------------------*/
.partner{
	overflow: hidden;
}

.partner .tmb{
	width: 48px;
	height: 48px;
	margin: 0;
	border-radius: 50%;
}

.partner .name{
	width: calc(100% - 56px);
	max-width: none;
	padding:0 8px;
	font-weight: bold;
}

.messageList{
	padding: 0 16px;
}

.messageList_item{
	margin-bottom: 16px;
	padding: 8px;
}

.messageArea{
	padding-left: 20%;
	width: 100%;
}

.messageArea .balloon{
	padding: 8px;
	background: #fafafa;
	border-radius: 8px;
	position: relative;
}

.messageArea .balloon:before{
	display: block;
	content: " ";
	width: 12px;
	height: 12px;
	background: #fafafa;
	transform: rotate(45deg);
	position: absolute;
	top: 16px;
	right: -6px;
}

.messageArea .tmb{
	margin-top: 8px;
	width: 96px;
	border-radius:8px;
}

.messageArea .tmb-stamp{
	width: 185px;
}

.messageArea .date{
	margin-top: 8px;
	text-align: right;
}

.viewPicLink-send{
	display:block;
	margin-left: calc(100% - 96px);
}

.viewPicLink-sendStamp{
	margin-left: calc(100% - 185px);
}

.viewPicLink-receive{
	display:block;
	width: 96px;
}

.viewPicLink-receiveStamp{
	width: 185px;
}

.messageArea.fromPartner{
	padding-left: 0;
	padding-right: 20%;
}

.messageArea.fromPartner .balloon:before{
	left: -6px;
}

.messageArea.fromPartner .date{
	text-align: left;
}

.btn-viewPic{
	margin: 8px 0;
	width: 140px;
	padding: 4px 8px;
}

#messageSendForm .container{
	background: #fafafa;
}

.messageSendBox .inner{
	padding: 0;
	position: relative;
}

.messageSendBox .mask{
	position: absolute;
	top: 0;
	left:0;
	width: 100%;
	height: 100%;
	background: #fefefe;
	z-index: 997;
	display: none;
}

.messageSendBox .mask .icon{
	background-color: #bfbfbf;
}

.messageSendBox .altFileUpload,
.messageSendBox .openStampWindow{
	display: block;
	width: 40px;
	height: 40px;
	padding: 8px;
	border-radius: 50%;
	background: var(--btnColor-main);
	position: relative;
}

.messageSendBox .openStampWindow{
	margin-left: 4px;
	cursor: pointer;
}

.messageSendBox .icon{
	background-color: var(--btnColor-sub);
}

.messageSendBox .icon.fileUpload{
	-webkit-mask-image: url('../img/svg-plus.svg');
	mask-image: url('../img/svg-plus.svg');
}

.messageSendBox .icon.fileUpload.active{
	-webkit-mask-image: url('../img/svg-clip.svg');
	mask-image: url('../img/svg-clip.svg');
}

.messageSendBox .icon.smile{
	-webkit-mask-image: url('../img/svg-smile.svg');
	mask-image: url('../img/svg-smile.svg');
}

.messageSendBox textarea{
	margin: 0 8px;
	height: auto;
	background: #fff;
	resize: none;
}

.messageSendBox textarea::-webkit-scrollbar {
	width: 4px;
	height: 4px;
	border-radius: 8px;
	background: #eeeeee;
}

.messageSendBox .btn-send{
	margin: 0;
	width: 96px;
}

/* スタンプ */
.stampList{
	display: flex;
	justify-content: flex-start;
	align-items: center;
	flex-wrap: wrap;
}

.stampList_item{
	width: 25%;
	padding: 8px;
	cursor: pointer;
}

@media ( min-width : 1025px ){
	.stampList_item:hover{
		opacity: .75;
	}
}

.stampOriginalSize{
	display: block;
	width: 80%;
	max-width: 370px;
	margin: 0 auto;
}

/*-----------------------------------------------
マイページ
-----------------------------------------------*/
.userProfile-myPage{
	margin: -8px -8px 16px;
	padding: 16px;
	background: #fafafa;
}

@media ( min-width : 1025px ){
	.userProfile-myPage{
		background: none;
	}
}

.userProfile-myPage .tmb{
	width: 80px;
	height: 80px;
	border-radius: 50%;
}

.userProfile-myPage_inner{
	width: calc(100% - 80px);
	padding-left: 8px;
}

.userProfile-myPage_inner .name{
	width: 100%;
	margin-bottom: 8px;
	font-weight: bold;
	font-size: 1.7rem;
}

.userProfile-myPage_inner .btn{
	margin: 0;
	width: 80%;
	max-width: 240px;
	padding: .25em;
	color: var(--btnColor-main);
	background: var(--btnColor-sub);
	border: 1px solid var(--btnColor-main);
}

.msg-recommendAgeVerify,
.msg-recommendSubscription{
	box-shadow: 0 0 16px #e2e2e2;
}

.msg-recommendAgeVerify .msg_title,
.msg-recommendSubscription .msg_title{
	font-size: 1.8rem;
	font-weight: bold;
	margin-bottom: 8px;
}

.msg-recommendAgeVerify .btn,
.msg-recommendSubscription .btn{
	margin: 16px auto 8px;
}

.msg-recommendAgeVerify .msg_title{
	color: #00B589;
}

.msg-recommendAgeVerify .btn{
	background:#00B589;
}

.msg-recommendSubscription .msg_title{
	color: var(--paymentColor-main);
}

.msg-recommendSubscription .btn{
	background:var(--paymentColor-main);
}

/*利用中のプラン*/
.subscriptionDetails{
	margin: 8px auto;
	padding: 8px;
}

.subscriptionDetails_item{
	margin-bottom: 8px;
	padding: 16px 8px;
	font-weight: bold;
	font-size: 1.8rem;
	text-align:left;
	border-bottom: 1px solid var(--borderColor-main);
}

.subscriptionDetails_item .headline{
	display: inline-block;
	width: 33%;
	max-width: 120px;
	margin-right: 16px;
	padding: 8px;
	font-size: 1.3rem;
	text-align: center;
	color: var(--siteColor-main);
	background: #f8fafc;
	border-radius: 4px;
}

.subscriptionDetails_inner{
	margin: 24px auto 8px;
	padding: 16px;
	border: 1px solid var(--borderColor-main);
	border-radius: 4px;
}

.subscriptionDetails_inner .contentsTitle{
	margin-bottom: 16px;
	padding: 0 0 4px 8px;
	background: none;
	border-bottom: 2px solid #f8fafc;
}

.subscriptionDetails_inner .renew.on{
	font-weight: bold;
	color: var(--siteColor-main);
}

.subscriptionDetails_inner .btn{
	margin: 0 ;
	width: 45%;
	font-size: 1.3rem;
}

.myPageMenuList .icon{
	display: inline-block;
	vertical-align: bottom;
	margin-right: 16px;
	background-color: var(--navigationColor-main);
}

.myPageMenuList .link_text{
	position: relative;
	display: inline-block;
}

.myPageMenuList .link_text .newArraivalsBadge{
	right: -24px;
    top: 0;
    left: auto;
}

/*-----------------------------------------------
プロフィール（詳細/確認共通）
-----------------------------------------------*/
.userProfile-details .userPicsWrapper{
	position: relative;
}

/*プロフィール確認画面用*/
.userProfile-detailsPreview{
	padding-bottom: 80px;
}

.userProfile-detailsPreview .btn{
	position: fixed;
	bottom: 90px;
	left: 0;
	right: 0;
	margin: auto;
}

.userProfile-details .operateBtns{
	width: 100%;
	padding: 16px 0;
	position: absolute;
	bottom:0;
	left: 0;
	background:linear-gradient(rgba(0,0,0,0) 0% ,rgba(0,0,0,.8) 100%) ;
}

.userProfile-details .operateBtns .btn{
	margin: 8px auto 0;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	border: none;
}

.userProfile-details .operateBtns .btnWrapper .btnName {
	margin-top: 4px;
	font-size: 1.6rem;
	color: #fff;
}

.userProfile-details .comment{
	border-top: 1px solid var(--borderColor-main);
}

.userProfile-details .name{
	text-align: center;
	font-weight: bold;
	font-size: 3.2rem;
}

.userProfile-details .settingList{
	padding: 16px 0;
	border-top: 1px solid var(--borderColor-main);
	border-bottom: 1px solid var(--borderColor-main);
}

.userProfile-details .settingList:last-of-type{
	border-top: none;
}

.userProfile-details .settingList .list_item{
	border: none;
	padding: 4px;
}

.userProfile-details .settingList .item_left{
	color: var(--siteColor-main);
	font-weight: bold;
}

.userProfile-details .settingList .item_right{
	color: var(--textColor-main);
}

.userProfile-details #settingList-detail.settingList .item_right{
	font-weight: bold;
	text-align: left;
	font-size: 1.5rem;
}

.userProfile-details .settingList .timeZoneWrap{
	width: 55%;
}

@media print, ( min-width : 1025px ){
	.userProfile-details .settingList .timeZoneWrap{
		width: 32%;
	}
}

.timeZone{
	width: 88px;
	font-size: 1.3rem;
	padding: 0 1em;
	text-align: center;
	color: #aaa;
	border: 1px solid #aaa;
	border-radius: 128px;
}

.timeZone .icon{
	display: inline-block;
	margin-right: 4px;
	width: 14px;
	height: 14px;
	vertical-align: middle;
	background-color: #aaa;
}

.timeZone-day.on{
	color: #ff3366;
	border-color: #ff3366;
}

.timeZone-day.on .icon{
	background-color: #ff3366;
}

.timeZone-night.on{
	color: #8133ff;
	border-color: #8133ff;
}

.timeZone-night.on .icon{
	background-color: #8133ff;
}

.galleryList{
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	padding: 24px 16px;
}

.galleryList_item{
	width: 30%;
	padding-bottom: 16px;
}

.galleryList_item .tmb{
	height: 130px;
	border-radius: 5px;
}

@media print, ( min-width : 1025px ){
	.galleryList_item .tmb{
		height: 240px;
	}
}

/*
FancyBox5用　ここから
*/
.galleryList_item .fancybox{
	height: 130px;
	border-radius: 5px;
	overflow: hidden;
	cursor: pointer;
}

.galleryList_item .fancybox .tmb{
	height: inherit;
	border-radius: 5px;
}

/*fancyboxモーダル　画像表示領域*/
.fancybox__content{
	width: 100% !important;
	min-width: 50vw;
	height: 90vh !important;
}

@media print, ( min-width : 1025px ){
	.galleryList_item .fancybox{
		height: 240px;
	}

	.fancybox__content{
		max-width: 480px ;
	}

	.fancybox-image{
		object-fit: contain;
	}
}

.lightboxOverlay{
	height: 100vh !important;
}

.lightbox{
	top: 20px !important;
}

/*-----------------------------------------------
プロフィール編集
-----------------------------------------------*/
.memo-editPic{
	padding: 0 0 16px 0;
	border: none;
	font-size: 1.2rem;
	text-align: center;
}

.icon-upLoard,.icon-delete{
	display: inline-block;
	width: 16px;
	height: 16px;
	vertical-align: sub;
}

.icon-upLoard{
	background: url('../img/svg-fileUpload-24.svg');
}

.icon-delete{
	background: url('../img/svg-crossmark-solid-circle.svg');
}

.userPicList{
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	padding: 24px;
}

.userPicList_item{
	width: 30%;
	padding-bottom: 16px;
	position: relative;
}

.userPicList_item_headline{
	font-size: 1.2rem;
	color: #777;
}

.userPicList_item .preview{
	display: block;
	height: 130px;
}

@media print, ( min-width : 1025px ){
	.userPicList_item .preview{
		height: 240px;
	}
}

.userProfile-edit .btn-cancel{
	display: none;
	position: absolute;
	bottom: 8px;
	right: -12px;
	width: 24px;
	height: 24px;
	background-size: 24px;
	background-repeat: no-repeat;
	background-position: center;
	border-radius: 50%;
	cursor: pointer;
	background-image: url(../img/svg-crossmark-solid-circle.svg);
}

.userProfile-edit .comment{
	height: 160px;
	overflow-y: scroll;
}

.userProfile-edit .comment a{
	-webkit-tap-highlight-color:rgba(0,0,0,0);
}

/*-----------------------------------------------
写真変更関連
-----------------------------------------------*/
.formBox-editPic .preview{
	width: 240px;
	height: 360px;
	margin: 0 auto;
}

/*-----------------------------------------------
自己紹介文編集・各種設定・検索条件関連
-----------------------------------------------*/
.formBox-editComment textarea{
	height: 320px;
}

.settingList .item_left{
	width: 40%;
	height: auto;
}

.settingList .item_right{
	width: 60%;
	padding: 0;
	color: var(--btnColor-main);
	font-size: 1.3rem;
	font-weight: bold;
	text-align: right;
}

.rangeSliderWrapper{
	width: 80%;
	margin: 64px auto;
}

/*nouisliderカスタマイズ*/
.noUi-horizontal{
	height: 8px;
}

.noUi-horizontal .noUi-handle{
	width: 24px;
	height: 24px;
	border-radius: 50%;
	top: -10px;
}

.noUi-connect {
    background: #685ef0;
}

.noUi-tooltip{
	padding: 0;
	border: none;
	background: none;
}

.noUi-handle:after, .noUi-handle:before,
.noUi-handle:after, .noUi-handle::after{
	display: none;
}

.item_label{
	display: block;
	height: 100%;
	margin: -8px;
	padding: 8px;
	position: relative;
	user-select: none;
}

.item_label::before{
	position: absolute;
	top:calc(50% - 12px);
	right:16px;
	content: '';
	display: block;
	width: 8px;
	height: 16px;
	border-right: 2px solid var(--siteColor-main);
	border-bottom: 2px solid var(--siteColor-main);
	transform: rotate(45deg);
	display: none;
}

.checkBox:checked + .item_label::before{
	display: block;
}

/*-----------------------------------------------
年齢確認
-----------------------------------------------*/
#aboutAgeVerification{
	margin-bottom: 16px;
	padding: 0 16px;
	background: #fafafa;
	border-radius: 8px;
}

#aboutAgeVerification .detail{
	display: none;
	padding: 16px 0;
	font-size: 1.5rem;
	background: #fafafa;
	border: var(--borderColor-main);
	border-top: 1px solid var(--borderColor-main);
}

#aboutAgeVerification .text-caution{
	font-size: 1.2rem;
	font-weight: bold;
}

#aboutAgeVerification .steps{
	margin: 16px 0 8px;
	width: 20%;
}

.ageVerificationForm{
	padding: 24px;
}

/*-----------------------------------------------
お知らせ一覧関連（ログイン前後共通）
-----------------------------------------------*/
.infomationTitle{
	display: inline-block;
	width: 85%;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}

/*-----------------------------------------------
退会
-----------------------------------------------*/
body#unsubsribePage{
	background: #fff;
}

#unsubsribePage main{
	padding-top: var(--height-header);
}

#unsubsribePage .containerWrapper{
	background: rgba(92, 123, 171,.3);
}

#unsubsribePage .contentsWrapper{
	padding: 24px 0;
}

#unsubsribePage .leadText{
	margin-bottom: 40px;
	padding-top: 28.906%;
	background: url(../img/unsubsribe_pic-01.jpg);
	background-size: cover;
	position: relative;
}

#unsubsribePage .leadText .tmb{
	width: 240px;
	object-fit: cover;
	position: absolute;
	right: 16px;
	bottom: 8px;
}

@media ( min-width : 1025px ){
	#unsubsribePage .leadText{
		margin-bottom: 160px;
	}

	#unsubsribePage .leadText .tmb{
		width: 480px;
		right: calc(50% - 480px);
		bottom: 24px;
	}
}

@media ( min-width : 1025px ){
	#unsubsribePage .contentsWrapper{
		padding: 40px 0;
	}
}

#unsubsribePage .contentsTitle{
	margin: 0 auto;
	color: var(--siteColor-main);
	font-size: 1.8rem;
	text-align: center;
	font-weight: bold;
	background: none;
}

#unsubsribePage p{
	text-align: center;
}

#unsubsribePage .tmb{
	width: 50%;
}

#unsubsribePage .textLink{
	color: var(--btnColor-main);
}

#unsubsribePage .memo{
	margin: 24px auto;
	padding: 8px;
	text-align: left;
	border-radius: 8px;
}

#unsubsribePage .btn-cancel{
	color: var(--btnColor-main);
	background: var(--btnColor-sub);
	border: 1px solid var(--btnColor-main);
}

@media ( min-width : 1025px ){
	#unsubsribePage .inner{
		width: 100%;
	}

	#unsubsribePage .pageTitle{
		font-size: 2.6rem;
	}

	#unsubsribePage .contentsTitle{
		font-size: 2.6rem;
		border: none;
	}

	#unsubsribePage p{
		font-size: 2rem;
	}
}

/*-----------------------------------------------
よくある質問・ヘルプ
-----------------------------------------------*/
.faqList{
	padding: 16px;
}

.faqList_item{
	padding: 8px 4px;
	border: 1px solid var(--borderColor-main);
	border-radius: 8px;
}

.faqList_item:not(:last-child){
	margin-bottom: 24px;
}

.question{
	padding: 8px 4px;
	user-select:none;
}

.answer{
	display: none;
	padding: 16px;
	border-top: 1px solid var(--borderColor-main);
}

.answer .textLink{
	color: #0049d0;
}

/*-----------------------------------------------
購入関連
-----------------------------------------------*/
/* 支払い方法選択 */
.paymentList{
	padding: 24px 0;
}

.paymentList .icon{
	display: inline-block;
	vertical-align: bottom;
	margin-right: 16px;
	background-color: var(--paymentColor-sub);
}

.paymentList .paymentNote{
	display:block;
	margin-left: 40px;
	font-weight: bold;
	color: var(--paymentColor-sub);
}

.paymentList .paymentNote span{
	font-weight: normal;
	color: var(--textColor-main);
}

@media ( min-width : 1025px ){
	.paymentList .paymentNote{
		display: inline-block;
	}
}

/* プラン選択 */
.purchaseList{
	padding: 24px 16px;
}

.purchaseList_item{
	width: 46%;
	margin-bottom: 24px;
	padding: 0;
	border-radius: 8px;
	box-shadow: 0 8px 10px #bbbbbb;
	overflow: hidden;
}

.purchaseList_item .list_item_link{
	margin: 0;
	padding: 0;
}

.purchaseList_item_inner{
	padding: 16px;
	text-align: center;
}

.planeTitle{
	padding:8px 16px;
	font-size: 2.8rem;
	text-align: center;
	font-weight: bold;
	color: #fff;
}

.purchaseList_item-primary{
	border:3px solid var(--paymentColor-main);
}

.purchaseList_item-primary .planeTitle{
	background:var(--paymentColor-main);
}

.purchaseList_item-secondary{
	border:3px solid var(--paymentColor-sub);
}

.purchaseList_item-secondary .planeTitle{
	background:var(--paymentColor-sub);
}

.price{
	font-weight: bold;
	font-size: 3rem;
	letter-spacing: -.125rem;
}

.price-total{
	padding: .2em 0;
	font-size: 1.2rem;
	color: #666666;
	letter-spacing:unset;
	background: #f5f3ec;
	border-radius: 128px;
}

/* 購入確認 */
.btn-coupon{
	margin: 0;
	width: 30%;
	padding: 10px;
	margin-left: 8px;
	border-radius: 0;
}
/*-----------------------------------------------
銀行振込
-----------------------------------------------*/
.bankAccount{
	margin: 24px auto;
	font-weight: bold;
	border: 1px solid var(--borderColor-main);
}

.bankAccount th,
.bankAccount td{
	padding: .5em 1em;
}

.bankAccount th{
	background: #fafafa;
	border-right: 1px solid var(--borderColor-main);
}

.bankAccount td{
	text-align: left;
}

/*----------------------------------------------
ぼかし機能
-----------------------------------------------*/
.altRadioBtn.blur_off,.altRadioBtn.blur_on1,.altRadioBtn.blur_on2,.altRadioBtn.blur_on3{
	width: 48%;
	border-radius: 24px;
}
input[type="radio"]#blur_off:checked + .altRadioBtn{
	color:#fff;
	background-color: #ff4f89;
}
input[type="radio"]#blur_on1:checked + .altRadioBtn{
	color:#fff;
	background-color: #ff4f89;
}
input[type="radio"]#blur_on2:checked + .altRadioBtn{
	color:#fff;
	background-color: #ff4f89;
}
input[type="radio"]#blur_on3:checked + .altRadioBtn{
	color:#fff;
	background-color: #ff4f89;
}

/*----------------------------------------------
お問合せ　ログイン前後共通
-----------------------------------------------*/

.contactAttention a{
	color: var(--siteColor-main);
	text-decoration: underline;
}

/*----------------------------------------------
年齢認証
-----------------------------------------------*/

.idcardsBtnArea{
	padding: 16px 8px;
}

.btnMsg{
	font-size: 1.75rem;
}

.ageBtnArea{
	text-align: center;
}

.ageBtnArea .span{
	font-weight: bold;
	font-size: 1.75rem;
}

.ageBtn{
	width: 78%;
	max-width: 320px;
	margin: 16px auto;
	padding: 12px;
	font-size: 1.5rem;
	color: #fff;
	background: #5c7bab;
	border: 1px solid #5c7bab;
	border-radius: 40px;
	position: relative;
}

.ekycCaution{
	padding: 24px 16px;
}

.aboutExamination{
	margin-bottom: 32px;
}

.aboutExamination_inner{
	margin: 32px auto 24px;
	padding: 16px 0;
	border-top: 1px solid #000;
	border-bottom: 1px solid #000;
}

.aboutExamination .icon{
	margin: 0 auto;
}

.aboutExamination .title,
.ekyInformation .title{
	font-size: 1.8rem;
	font-weight: bold;
	color: #5c7bab;
	text-align: center;
}

.ekyInformation{
	margin-bottom: 32px;
	padding: 16px;
	color: #5c7bab;
	border: 3px solid #5c7bab;
}