@charset "utf-8";
/* CSS Document */

:root {
  --main-color: #f97212; /* オレンジ */
	--sub-color1: #0aae46; /* 緑 */
	--sub-color2: #d92346; /* 赤 */
	--bg-color: #ffe5d4; /* クリーム */
	--gray-color: #666; /* グレー */
	--lightgray-color: #aaa; /* ライトグレー */
}



/*====================================================================
　全体設定
====================================================================*/
html {
	overflow: auto;
	height: 100%;
}

body {
	margin: 0;
	padding: 0;
	background: #fff;
	color: #666;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Verdana, sans-serif;
	font-size: 4vw;
	line-height: 1.4;
	text-align: left;
	/*position: relative;*/
    /*animation: fadeIn 3s ease 0s 1 normal;
    -webkit-animation: fadeIn 3s ease 0s 1 normal;*/
}

body.modal-open {
	overflow: hidden;
	height: 100%;
}

main {
	padding-bottom: constant(safe-area-inset-bottom);
	padding-bottom: env(safe-area-inset-bottom);
}

.clearfix::after {
	content: " ";
	clear: both;
	display: block;
}

/*--------------------リンク文字--------------------*/
a {
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	color: var(--sub-color2);
}

/*--------------------基本画像サイズ--------------------*/
img {
	width: 100%;
}

/*--------------------画像サイズ調整--------------------*/
.w50 {
	width: 50%;
}

.w80 {
	width: 80%;
}

.w100 {
	width: 100%;
}

/*--------------------文字--------------------*/
.small {
	font-size: 3.4vw;
	display: inline-block;
	line-height: 1.2;
}

/*--------------------対象なし--------------------*/
.no-course {
	margin: 0;
	padding: 1em;
	font-size: 16px;
	/*text-align: center;*/
}

/*--------------------エラー--------------------*/
.error {
	margin-bottom: 1em;
	padding: 0.5em;
	border: 1px dashed #e84057;
	border-radius: 10px;
	background: #fdf0f0;
	color: #e84057;
	text-align: center;
}

/*--------------------注意文（ブルー）--------------------*/
.pass_attention {
	margin-bottom: 1em;
	padding: 0.5em;
	border: 1px dashed #2a6c8a;
	border-radius: 1vw;
	background: #d4e8f1;
	color: #2a6c8a;
}

/*--------------------ページトップへ--------------------*/
#pagetop {
	position: fixed;
	bottom: 60px;
	right: 20px;
	height: 50px;
	width: 50px;
	border-radius: 50%;
	background: #ccc;
}

#pagetop a {
	color: #fff;
	font-size: 40px;
	text-align: center;
	display: block;
	margin-top: -5px;
}



/*====================================================================
　枠設定
====================================================================*/
/*-------------------- フッターメニュー用 --------------------*/
section {
	padding-bottom: 17.8vw;
}

/*--------------------  --------------------*/
.block {
	padding: 3vw;
	text-align: left;
}

/*-------------------- 白枠 --------------------*/
.wrap {
	background: #fff;
	border: 0.75vw solid var(--main-color);
	border-radius: 1vw;
	padding: 2vw;
	margin: 2.5vw 0;
}



/*====================================================================
　ボタン設定
====================================================================*/
/*-------------------- ボタン（小） --------------------*/
.button_s {
	box-sizing: border-box;
	-webkit-appearance: none;
	background: #fff;
	border-radius: 2vw;
	border: 0.5vw solid var(--main-color);
	color: var(--main-color);
	display: inline-block;
	font-weight: bold;
	padding: 1vw 2vw;
	text-align: center;
	text-decoration: none;
}

/*-------------------- ボタン（大） --------------------*/
.button_l {
	box-sizing: border-box;
	-webkit-appearance: none;
	background: #fff;
	border-radius: 2vw;
	border: 0.5vw solid var(--main-color);
	color: var(--main-color);
	display: block;
	font-size: 5vw;
	font-weight: bold;
	padding: 3vw;
	margin: 0.75em auto 0;
	width: 90%;
	text-align: center;
	text-decoration: none;
}

/*-------------------- ボタン（色） --------------------*/
.bt_orange {
	border: 0.5vw solid var(--main-color);
	background: var(--main-color);
	color: #fff;
}

.bt_green {
	border: 0.5vw solid var(--sub-color1);
	background: var(--sub-color1);
	color: #fff;
}

.bt_red {
	border: 0.5vw solid var(--sub-color2);
	background: var(--sub-color2);
	color: #fff;
}

.bt_gray {
	border: 0.5vw solid var(--lightgray-color);
	background: var(--lightgray-color);
	color: #fff;
}

.bt_white {
	border: 0.5vw solid #fff;
	background: transparent;
	color: #fff;
}

.bt_goal::before {
	content: "";
	background: url(../img/bg_bt_goal.svg) no-repeat center center / 100% auto;
}

.bt_pop_close {
	border: 1px solid #fff;
	border-radius: 100vw;
	display: inline-block;
	padding: 0.5vw 3vw;
	margin: 3vw 0 0;
}

.bt_pop_close i {
	display: inline-block;
	margin-right: 1em;
}

/*@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}*/



/*====================================================================
　ヘッダ設定
====================================================================*/
header {
	position: relative;
}

header > img {
	width: 100%;
}



/*====================================================================
　ページタイトル
====================================================================*/
/* 未調整 */
.page-title {
	padding: 0.5em;
	background: #fafafa;
	color: #036eb8;
	font-size: 5vw;
	font-weight: bold;
	text-align: left;
	box-shadow: 0 5px 5px -3px rgba(0,0,0,0.15);
}

h1 {
	background: #fafafa;
	color: var(--main-color);
	font-size: 5vw;
	font-weight: bold;
	margin: 0;
	padding: 0.5em;
	text-align: center;
	box-shadow: 0 5px 5px -3px rgba(0,0,0,0.15);
}

h2 {
	margin: 1em 0 0;
	padding: 0.5em 0;
	color: var(--main-color);
	font-size: 4.5vw;
}

h3 {
	color: var(--sub-color1);
	font-size: 3.8vw;
	font-weight: bold;
}



/*====================================================================
　フッター設定
====================================================================*/
footer {
	padding-bottom: calc(env(safe-area-inset-bottom));
	box-sizing: border-box;
	width: 100%;
	background: #ffe07d;
	border-top: 0.75vw solid var(--main-color);
	/*height: 10vh;*/
	position: fixed;
	bottom: 0;
	left: 0;
	z-index: 200;
}

footer ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-around;
	align-items: flex-end;
}

footer li {
	text-align: center;
	width: calc(100% / 4);
}

footer li a {
	display: block;
	padding: 0;
}

footer li img {
	display: block;
	width: 100%;
}



/*====================================================================
　初回起動時画面
====================================================================*/
.firstselect {
	box-sizing: border-box;
	background: #84c7f4 url(../img/bg_firstselect.jpg) no-repeat bottom center / 100% auto;
	height: 100vh;
	position: relative;
}

.firstselect_logo {
	padding: 10vh 0 0;
	text-align: center;
}

.firstselect_logo img {
	width: 80%;
}

.firstselect .buttons {
	width: 100%;
	position: absolute;
	top: 25vh;
	left: 0;
}

.firstselect .buttons .button_l {
	margin-top: 5vh;
}

.firstselect_message {
	position: absolute;
	bottom: 5vh;
	left: 0;
}



/*====================================================================
　参加登録画面設定
====================================================================*/
/* 和暦早見表はこちら */
.jump {
	display: inline-block;
	margin-left: 10vw;
}

.jump::before {
	font-family: 'Font Awesome 5 Free';
	content: "\f0da";
	display: inline-block;
	color: var(--main-color);
	font-weight: bold;
	margin-right: 0.25em;
}

/* 和暦早見表ポップアップ */
.calendar-popup {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	box-sizing: border-box;
	width: 100%;
	height: 100%;
	padding: 1em;
	background: rgba(0,0,0,0.80);
	text-align: center;
	z-index: 10000;
	overflow: auto;
}

.calendar-inner {
	margin-top: calc(env(safe-area-inset-top));
	padding: 1em;
	border-radius: 10px 10px 0 0;
	background: #fff;
}

.calendar-popup h2 {
	margin: 0;
}

.calendar-close {
	box-sizing: border-box;
	border-top: 1px solid #666;
	border-radius: 0 0 10px 10px;
	background: #fff;
	color: var(--main-color);
	font-size: 4vw;
	font-weight: bold;
	padding: 2vw;
	text-align: center;
}



/*====================================================================
　トップページ設定
====================================================================*/
.top {
	/*background: var(--bg-color);*/
	font-weight: bold;
	overflow-y: hidden;
}

/*-------------------- ユーザーID・グループID・日数 --------------------*/
.user {
	background: #fff;
	border-bottom: 0.75vw solid var(--main-color);
	font-size: 3.2vw;
	font-weight: bold;
	display: flex;
	justify-content: space-between;
	padding: 2vw 1vw;
}

.user span {
	color: var(--main-color);
}

.user .user_group a {
	border-radius: 1vw;
	background: var(--sub-color1);
	color: #fff;
	padding: 1vw;
	text-decoration: none;
}

.user .user_group a::before {
	font-family: 'Font Awesome 5 Free';
	display: inline-block;
	font-size: 3vw;
	margin-right: 0.1em;
	content: "\f0c0";
}

.user .user_group a::after {
	font-family: 'Font Awesome 5 Free';
	display: inline-block;
	font-size: 3vw;
	margin-left: 0.25em;
	content: "\f055";
}

/*-------------------- トップページ項目タイトル --------------------*/
.top .title {
	margin: -1.5vw 0 3vw;
}

.top .title span {
	background: var(--main-color);
	color: #fff;
	font-size: 4.5vw;
	padding: 1vw 5vw;
}

/*-------------------- お知らせ --------------------*/
.top_topics {
	margin-top: 0;
}

.top_topics a {
	color: var(--gray-color);
}

/*-------------------- あなたのポイント --------------------*/
.top_info_wrap {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
}

/* ユーザーアイコン */
.top_info_img {
	align-self: center;
	border: 0.5vw solid var(--gray-color);
	border-radius: 100vw;
	height: 10vw;
	width: 10vw;
	position: relative;
}

.top_info_img img {
	border-radius: 100vw;
	object-fit: cover;
	height: 10vw;
	width: 10vw;
}

.top_info_img i {
	color: var(--sub-color1);
	font-size: 5vw;
	position: absolute;
	bottom: -3vw;
	right: -3vw;
}

/* ポイント数 */
.top_info_points {
	display: flex;
	justify-content: center;
	text-align: center;
}

.top_info_points > div {
	align-self: flex-end;
}

.top_info_points span {
	background: var(--bg-color);
	border-radius: 100vw;
	font-size: 3.1vw;
	display: block;
	padding: 1vw 3vw;
	margin: 0 0 1vw;
}

.top_info_points strong {
	color: var(--main-color);
	font-size: 5vw;
}

/* ランキングボタン */
.top_info_ranking a {
	display: block;
	width: 12vw;
}

/*-------------------- 歩数と消費カロリー --------------------*/
/* 枠 */
.top_status_wrap {
	display: flex;
	align-items: flex-start;
}

/* 更新・履歴ボタン */
.top_status_graph ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
	display: flex;
	justify-content: center;
}

.top_status_graph li {
	padding: 0 1vw;
}

/* 円グラフ */
.top_status_graph {
	font-size: 3.2vw;
	text-align: center;
	width: 45%;
}

.top_status_graph_detail_step,
.top_status_graph_detail_kcal {
	position: relative;
}

.top_status_graph_detail_step div:nth-of-type(1),
.top_status_graph_detail_kcal div:nth-of-type(1) {
	box-sizing: border-box;
	padding: 0 5vw 0 3vw;
}

.top_status_graph_detail_step div:nth-of-type(2),
.top_status_graph_detail_kcal div:nth-of-type(2) {
	box-sizing: border-box;
	background: #fff;
	border-radius: 100vw;
	height: 25vw;
	width: 25vw;
	padding-top: 5vw;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(54%, -54%);
	-webkit-transform: translate(-54%, -54%);
/*
	position: absolute;
	top: 6.75vw;
	left: 6vw;
*/
}

.top_status_graph_detail_step canvas,
.top_status_graph_detail_kcal canvas {
	height: 35vw!important;
}

.top_status_graph_detail_step strong {
	color: var(--main-color);
	display: block;
	font-size: 5.5vw;
}

.top_status_graph_detail_step p {
	color: var(--main-color);
	font-size: 4vw;
	margin: 0;
}

.top_status_graph_detail_kcal strong {
	color: var(--sub-color1);
	display: block;
	font-size: 5.5vw;
}

.top_status_graph_detail_kcal p {
	color: var(--sub-color1);
	font-size: 3.5vw;
	margin: 0;
}

/* 詳細情報 */
.top_status_value {
	width: 55%;
}

.top_status_value_detail {
	text-align: center;
}

.top_status_value_detail dl {
	margin: 0;
}

.top_status_value_detail dt {
	background: var(--bg-color);
	border-radius: 1vw;
	font-size: 3.8vw;
	padding: 1vw;
	margin: 2vw 0;
	position: relative;
}

.top_status_value_detail dt::before {
	font-family: 'Font Awesome 5 Free';
	content: "\f0d7";
	font-size: 4.5vw;
	position: absolute;
	top: 0;
	right: 2vw;
	-webkit-transition: all .2s;
	transition: all .2s;
}

.top_status_value_detail dt.active::before {
	-webkit-transform: rotate(180deg);
	transform: rotateZ(180deg);
}

.top_status_value_detail dd {
	display: none;
	font-size: 3.4vw;
	padding: 1vw;
	margin: 0;
}

.top_status_value_detail dd strong {
	color: var(--main-color);
	font-size: 5.5vw;
}

/*-------------------- 医療費抑制効果 --------------------*/
/* 金額 */
.top_suppress_detail {
	display: flex;
	justify-content: center;
	margin: 0 auto;
	text-align: center;
	width: 90%;
}

.top_suppress_detail > div {
	align-self: flex-end;
}

.top_suppress_detail span {
	background: var(--bg-color);
	border-radius: 100vw;
	font-size: 3.2vw;
	display: block;
	padding: 1vw 3vw;
	margin: 0 0 1vw;
}

.top_suppress_detail strong {
	color: var(--main-color);
	font-size: 5.5vw;
}

/* メッセージ */
.top_suppress_message {
	background: url(../img/bg_top_suppress_message.png) no-repeat right center / auto 100%;
	padding: 3vw 18vw 0 0;
}

.top_suppress_message p {
	background: var(--bg-color);
	border-radius: 1vw;
	font-size: 3.2vw;
	padding: 1vw;
	margin: 0;
	position: relative;
}

.top_suppress_message p::after {
	content: "";
	background: url(../img/top_suppress_message_arrow.svg) no-repeat center center / 100% auto;
	display: block;
	width: 3vw;
	height: 3vw;
	position: absolute;
	top: 1vw;
	right: -2.5vw;
}

.top_suppress_message span {
	color: var(--main-color);
}

/*-------------------- 日々の目標 --------------------*/
.top_goal_wrap {
	display: flex;
	justify-content: space-between;
}

/* 3つの目標 */
.top_goal ul {
	list-style-type: none;
	margin: 2vw 0 3vw 5vw;
	padding: 0;
	width: 70%;
}

.top_goal li + li {
	margin-top: 2.5vw;
}

.top_goal li label {
	display: block;
	padding: 1.5vw 0 0 9vw;
	position: relative;
}

.top_goal li label input {
	position: absolute;
	top: 0;
	left: 0;
}

/* 目標設定ボタン */
.top_goal_wrap div {
	margin: 3vw 5vw 0 0;
}

.top_goal button::before {
	content: "";
	display: inline-block;
	background: url(../img/bg_bt_goal.svg) no-repeat top center / 100% auto;
	height: 5vw;
	width: 3vw;
	margin-right: 0.25em;
}

/* 達成ボタン下文言 */
.top_goal p {
	font-size: 3.4vw;
	margin: 0.5em auto 0;
	width: 90%;
}

.top_goal p span {
	color: var(--main-color);
}

/*-------------------- 抽選会参加・抽選応募ボタン --------------------*/
.top_buttons a:nth-of-type(1)::before {
	font-family: 'Font Awesome 5 Free';
	display: inline-block;
	margin-right: 0.5em;
	content: "\f005";
}

.top_buttons a:nth-of-type(2)::before {
	font-family: 'Font Awesome 5 Free';
	display: inline-block;
	margin-right: 0.5em;
	content: "\f06b";
}

/*-------------------- 目標未設定・達成ポップアップ --------------------*/
.top_goal_popup {
	display: none;
	padding-top: 20px;
	padding-top: constant(safe-area-inset-top);
	padding-top: env(safe-area-inset-top);
	padding-bottom: constant(safe-area-inset-bottom);
	padding-bottom: env(safe-area-inset-bottom);
}

.top_goal_background {
	position: fixed;
	background: rgba(0, 0, 0, 0.8);
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 99;
}

.top_goal_popup_inner {
	margin-top: calc(env(safe-area-inset-top));
	box-sizing: border-box;
	background: #fff;
	border-radius: 1.5vw;
	text-align: center;
	overflow: hidden;
	position: fixed;
	width: 70%;
	top: 10vw;
	left: 15%;
	z-index: 100;
}

.top_goal_popup_icon {
	background: url(../img/bg_popup_icon.svg) no-repeat top 40vw center / 100% auto;
	overflow: hidden;
	padding: 5vw 0;
	position: relative;
	z-index: 101;
}

.top_goal_popup_icon img {
	width: 60%;
	position: relative;
	z-index: 101;
}

.top_goal_popup_message {
	background: var(--main-color);
	color: #fff;
	font-weight: bold;
	padding: 2vw 2vw 5vw;
}

.top_goal_popup_message p {
	margin: 0;
}



/*====================================================================
　トピックス設定
====================================================================*/
/*-------------------- トピックス一覧 --------------------*/
.topics_list ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

.topics_list li {
	border-bottom: 1px dotted #ccc;
}

.topics_list li a {
	color: #444;
	display: block;
	padding: 2vw 3vw 2vw 6vw;
	text-decoration: none;
	position: relative;
}

.topics_list li a::before {
	font-family: 'Font Awesome 5 Free';
	color: var(--main-color);
	content: "\f111";
	font-size: 2.6vw;
	font-weight: bold;
	position: absolute;
	top: 7.5vw;
	left: 2vw;
}

.topics_list li a::after {
	font-family: 'Font Awesome 5 Free';
	color: var(--main-color);
	content: "\f054";
	font-weight: bold;
	position: absolute;
	top: 35%;
	right: 3vw;
}

.topics_list li.sumi a::before {
	content: none;
}

.topics_list li.sumi a .topics_title {
	font-weight: normal;
}

.topics_date {
	color: #999;
	font-size: 3.4vw;
	margin: 0 3vw 0 0;
}

.topics_title {
	color: #333;
	font-weight: bold;
	font-size: 3.8vw;
}

.topics_main {
	margin: 0 3vw 0 0;
}

/*-------------------- トピックス詳細 --------------------*/
.topics_detail {
	padding: 3vw 3vw 0;
	margin: 0;
}

.topics_detail_text {
	border-top: 1px dotted #a7a7aa;
	margin-top: 3vw;
	padding-top: 3vw;
}

.topics_detail_text a {
	color: var(--main-color);
	word-break: break-all;
}

/*-------------------- アンケート --------------------*/
.topics_detail_quest {
	border-top: 1px dotted #a7a7aa;
	margin-top: 3vw;
	padding-top: 3vw;
}



/*====================================================================
　プロフィール画像編集画面設定
====================================================================*/
/* プロフィール表示画像 */
.profile_img_pic {
	border: 1px solid var(--main-color);
	border-radius: 2vw;
	padding: 3vw;
	text-align: center;
}

.profile_img_pic img {
	width: 45%;
}

.profile_img_pic p {
	font-weight: bold;
	font-size: 3.2vw;
	margin: 0;
}

/* 対応機種・注意事項 */
.prifile_img_text {
	margin: 5vw 0;
}

.prifile_img_text p {
	background: #eee;
	padding: 1vw;
}

/* ファイル選択ボタン */
.profile_img_inputgroup {
	margin: 5vw auto;
	text-align: center;
}

.profile_img_inputgroup input[type="file"] {
	display: none;
}

.profile_img_inputgroup label {
	background: var(--main-color);
	color: #fff;
	font-weight: bold;
	/*position: relative;*/
}

/*.profile_img_inputgroup label::after {
	content: "選択されていません";
	color: #333;
	font-weight: normal;
	font-size: 3.2vw;
	position: absolute;
	right: -30vw;
	top: calc(50% - 10px);
}

.profile_img_inputgroup label.changed::after {
	content: "";
}*/

.profile_img_inputgroup .filename {
	display: block;
	font-size: 3.2vw;
	margin: 2vw 0;
	word-break: break-all;
	width: 100%;
}



/*====================================================================
　ランキングページ
====================================================================*/
/*--------------------総合・地域別・年代別切り替えタブ--------------------*/
.menu_ranking {
	list-style-type: none;
	margin: 1em 0 0;
	padding: 0;
	position: relative;
	display: flex;
}

.menu_ranking li {
	box-sizing: border-box;
	background: #ccc;
	border-right: 1px solid #fff;
	text-align: center;
	width: calc(100%/3);
}

.menu_ranking li:nth-child(3) {
	border-right: none;
}

.menu_ranking li:nth-child(1).select {
	background: #3aabd2;
}
.menu_ranking li:nth-child(1).select::after {
	content: " ";
	display: block;
	background: #3aabd2;
	height: 4px;
	width: 100%;
	position: absolute;
	bottom: -4px;
	left: 0;
}

.menu_ranking li:nth-child(2).select {
	background: #67af31;
}
.menu_ranking li:nth-child(2).select::after {
	content: " ";
	display: block;
	background: #67af31;
	height: 4px;
	width: 100%;
	position: absolute;
	bottom: -4px;
	left: 0;
}

.menu_ranking li:nth-child(3).select {
	background: var(--main-color);
}
.menu_ranking li:nth-child(3).select::after {
	content: " ";
	display: block;
	background: var(--main-color);
	height: 4px;
	width: 100%;
	position: absolute;
	bottom: -4px;
	left: 0;
}

.menu_ranking li button {
	border: none;
	background: transparent;
	color: #fff;
	display: block;
	width: 100%;
	padding: 3vw 0;
	font-size: 4vw;
	font-weight: bold;
}

/*--------------------地域別・年代セレクトタグ--------------------*/
.ranking_select {
	box-sizing: border-box;
	margin: 3vw auto 0;
	width: 100%;
}

/*--------------------前日・前月切り替えタブ--------------------*/
#ranking_tab {
	margin: 0.5em 0 0;
	padding: 1em;
	list-style-type: none;
	display: flex;
}

#ranking_tab li {
	width: 50%;
	text-align: center;
}

#ranking_tab li a {
	box-sizing: border-box;
	display: block;
	width: 90%;
	margin: 0 auto;
	border: 1px solid var(--main-color);
	border-radius: 5px;
	color: var(--main-color);
	font-size: 4vw;
	padding: 1vw;
	text-decoration: none;
}

#ranking_tab .present a {
	background: var(--bg-color);
}

/*--------------------表示枠--------------------*/
.ranking {
	margin-bottom: 5vw;
}

.ranking > p:nth-child(1) {
	margin: 0 1em;
	padding-bottom: 0.5em;
	border-bottom: 1px solid var(--main-color);
	color: var(--main-color);
	font-size: 4vw;
	font-weight: bold;
	text-align: center;
}

.ranking > p:nth-child(2) {
	padding: 0 1em;
	font-size: 3.2vw;
}

.ranking > div {
	margin: 1em;
	text-align: center;
	color: var(--main-color);
	font-weight: bold;
}

.ranking > div strong {
	color: #d9a441;
	font-size: 7vw;
}

.ranking > div span {
	background: var(--bg-color);
	border-radius: 5px;
	display: inline-block;
	padding: 1vw 5vw;
	margin: 2vw 0 0;
}

/*--------------------順位表示--------------------*/
.ranking_list {
	box-sizing: border-box;
	width: 94vw;
	margin: 0 auto;
	padding: 0 3vw;
	border-collapse: collapse;
}

.ranking_list tr {
	border-bottom: 1px solid #dadada;
}

.ranking_list tr:nth-child(even) { background: #f9f9f7; }

.ranking_list th,
.ranking_list td {
	padding: 3vw;
}

.ranking_list th {
	width: 20%;
	text-align: center;
}

.ranking_list th p {
	margin: 0;
}

.ranking_list th p i {
	display: block;
}

.ranking_list tr td span {
	font-size: 90%;
	color: #666;
}

.ranking_list tr td:last-child { width: 5em; padding-right: 10px; text-align: right; color: #FF4500; font-weight: bold;}

.gold i { color: #D9A441!important; font-size: 7vw!important; }
.silver i { color: #999!important; font-size: 6vw!important; }
.blonz i { color: #B8860B!important; font-size: 5vw!important; }

.ranking_list tr:nth-child(1) { font-size: 5.5vw; }
.ranking_list tr:nth-child(2) { font-size: 4.5vw; }
.ranking_list tr:nth-child(3) { font-size: 3.8vw; }



/*====================================================================
　私の目標
====================================================================*/
/* 私の目標文言 */
.mygoal .mygoal_text {
	padding: 5vw 0 0;
	display: flex;
	align-items: flex-start;
}

.mygoal .mygoal_text img {
	display: inline-block;
	padding-right: 3vw;
	margin-top: -3vw;
	width: 18%;
}

.mygoal .mygoal_text strong {
	color: var(--sub-color2);
	font-size: 4.2vw;
}

.mygoal p span {
	color: var(--main-color);
}

/* 目標一覧 */
.mygoal ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}

.mygoal li {
	display: block;
	margin-bottom: 3vw;
	width: 48%;
}

.mygoal .label1,
.mygoal .label2,
.mygoal .label3,
.mygoal .label4,
.mygoal .label5,
.mygoal .label6 {
	/*float: left;*/
	box-sizing: border-box;
	width: 100%;
	padding: 20vw 0 3vw 0;
	border: 1px solid #dadada;
	border-radius: 1vw;
	display: block;
	text-align: center;
}

.mygoal .label1 {
	background: url(../img/mygoal/setting1.svg) no-repeat center top;
	background-size: 20vw auto;
}
.mygoal .label2 {
	background: url(../img/mygoal/setting2.svg) no-repeat center top;
	background-size: 20vw auto;
}
.mygoal .label3 {
	background: url(../img/mygoal/setting3.svg) no-repeat center top;
	background-size: 20vw auto;
}
.mygoal .label4 {
	background: url(../img/mygoal/setting4.svg) no-repeat center top;
	background-size: 20vw auto;
}
.mygoal .label5 {
	background: url(../img/mygoal/setting5.svg) no-repeat center top;
	background-size: 20vw auto;
}
.mygoal .label6 {
	background: url(../img/mygoal/setting6.svg) no-repeat center top;
	background-size: 20vw auto;
}

.mygoal .goal1,
.mygoal .goal2,
.mygoal .goal3,
.mygoal .goal4,
.mygoal .goal5,
.mygoal .goal6 {
	display: none;
}

.mygoal .check_box:checked + .label1,
.mygoal .check_box:checked + .label2,
.mygoal .check_box:checked + .label3,
.mygoal .check_box:checked + .label4,
.mygoal .check_box:checked + .label5,
.mygoal .check_box:checked + .label6 {
	background-color: var(--bg-color);
}



/*====================================================================
　グループ機能
====================================================================*/
/*-------------------- グループ未所属時・退会時画面 --------------------*/
.group_info p span {
	color: var(--sub-color2);
}

.group_info ul {
	font-weight: bold;
	list-style-type: none;
	margin: 8vw 0 0;
	padding: 0;
	text-align: center;
}

.group_info li:nth-of-type(1) {
	color: var(--main-color);
}

.group_info li:nth-of-type(2) {
	color: var(--sub-color1);
}

.group_info li + li {
	margin-top: 8vw;
}

.group_info li p {
	margin-bottom: 2vw;
}

.group_info li .button_l {
	margin-top: 0;
}

/*-------------------- 新規グループ作成・グループ参加画面 --------------------*/
.group_info_input {
	font-weight: bold;
	margin-top: 8vw;
	text-align: center;
}

.group_info_input input {
	font-size: 150%!important;
}

/*-------------------- グループ作成後・詳細画面 --------------------*/
/* 所属グループ */
.group_main .group_name dt {
	font-weight: bold;
}

.group_main .group_name dd {
	color: var(--main-color);
	font-weight: bold;
	font-size: 5vw;
	text-align: center;
	margin: 0;
	padding: 0;
}

.group_main .group_name dd span {
	color: #333;
	font-weight: normal;
	font-size: 3.8vw;
}

/* グループ合計ポイント */
.group_main .group_point {
	border-top: 1px solid var(--lightgray-color);
	border-bottom: 1px solid var(--lightgray-color);
	padding: 5vw 0;
}

.group_main .group_point dt {
	font-weight: bold;
}

.group_main .group_point dd {
	font-weight: bold;
	text-align: center;
	margin: 0;
	padding: 0;
}

.group_main .group_point dd strong {
	color: var(--main-color);
	font-size: 6vw;
}

/* メンバー */
.group_main .group_member p {
	font-weight: bold;
}

.group_main .group_member table {
	box-sizing: border-box;
	border-collapse: collapse;
	margin-bottom: 5vw;
	width: 100%;
}

.group_main .group_member tr {
	background: #f9f9f7;
	border-bottom: 1px solid var(--lightgray-color);
}

.group_main .group_member th,
.group_main .group_member td {
	padding: 2vw;
}

.group_main .group_member td {
	text-align: right;
}

.group_main .group_member td strong {
	color: var(--main-color);
	font-size: 6vw;
}

/* メンバー追加方法 */
.group_main .group_member_howto {
	padding: 5vw 0;
	text-align: right;
}

.group_main .group_member_howto a {
	color: var(--main-color);
	font-weight: bold;
}

/* 脱退ボタン */
.group_main .group_exit {
	text-align: right;
}



/*====================================================================
　ウォーキングコース
====================================================================*/
/*--------------------コース一覧--------------------*/
.walking img {
	display: block;
}

/* ウォーキングコースタイトル画像 */
.walking_course_title {
	position: relative;
}

.walking_course_title p {
	color: var(--main-color);
	font-weight: bold;
	margin: 0;
	text-shadow: 0 0 1vw #fff, 0 0 1vw #fff, 0 0 1vw #fff;
	position: absolute;
	top: 1vw;
	right: 3vw;
}

.walking_course_title p strong {
	font-size: 7vw;
}

/* ウォーキングコースリスト */
.walking_course_list {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

.walking_course_list li {
	margin: 1px 0;
}

.walking_course_list li a {
	display: block;
	position: relative;
}

.walking_course_list li a::after {
	font-family: 'Font Awesome 5 Free';
	content: "\f054";
	color: #fff;
	font-size: 7vw;
	font-weight: bold;
	text-shadow: 0 0 2px #000;
	position: absolute;
	top: 33%;
	right: 1vw;
}

.walking_course_list .walking_course_list_icon {
	width: 14vw;
	position: absolute;
	top: 0;
	left: 0;
}

/*--------------------コース詳細--------------------*/
.walking_detail {
	position: relative;
}

/* スタンプ枠 */
.walking_detail_img .stamp {
	display: block;
}

/* ステータス */
.walking_detail_status {
	border-bottom: 1px solid var(--main-color);
	display: flex;
	justify-content: space-between;
	padding: 3vw;
}

.walking_detail_status_meter {
	box-sizing: border-box;
	width: 62%;
}

.walking_detail_status_meter div {
	box-sizing: border-box;
	border: 2px solid var(--main-color);
	border-radius: 100vw;
	height: 10vw;
	overflow: hidden;
}

.walking_detail_status_meter div span {
	background: var(--main-color);
	display: block;
	height: 100%;
	position: relative;
}

.walking_detail_status_meter div img {
	height: 10vw;
	width: 10vw;
	position: absolute;
	top: 0;
	right: -5vw;
}

/* 0% */
.walking_detail_status_meter div span.meter_0 {
	width: 5%;
}
.walking_detail_status_meter div span.meter_0 img {
	right: -7vw;
}
/* 10% */
.walking_detail_status_meter div span.meter_10 {
	width: 10%;
}
.walking_detail_status_meter div span.meter_10 img {
	right: -6vw;
}
/* 20% */
.walking_detail_status_meter div span.meter_20 {
	width: 20%;
}
/* 30% */
.walking_detail_status_meter div span.meter_30 {
	width: 30%;
}
/* 40% */
.walking_detail_status_meter div span.meter_40 {
	width: 40%;
}
/* 50% */
.walking_detail_status_meter div span.meter_50 {
	width: 50%;
}
/* 60% */
.walking_detail_status_meter div span.meter_60 {
	width: 60%;
}
/* 70% */
.walking_detail_status_meter div span.meter_70 {
	width: 70%;
}
/* 80% */
.walking_detail_status_meter div span.meter_80 {
	width: 80%;
}
/* 90% */
.walking_detail_status_meter div span.meter_90 {
	width: 90%;
}
.walking_detail_status_meter div span.meter_90 img {
	right: -4vw;
}
/* 100% */
.walking_detail_status_meter div span.meter_100 {
	width: 100%;
}
.walking_detail_status_meter div span.meter_100 img {
	right: 0;
}

.walking_detail_status_meter p {
	color: var(--main-color);
	font-size: 3.2vw;
	display: flex;
	justify-content: space-between;
	margin: 1vw 0 0;
}

.walking_detail_status_not {
	box-sizing: border-box;
	width: 35%;
	background: var(--main-color);
	border-radius: 1vw;
	color: #000;
	font-weight: bold;
	font-size: 2.8vw;
	padding: 3vw 1.5vw 0;
	text-align: center;
}

.walking_detail_status_comp {
	box-sizing: border-box;
	width: 35%;
	background: var(--sub-color1);
	border-radius: 1vw;
	color: #000;
	font-weight: bold;
	font-size: 2.8vw;
	padding: 3vw 1.5vw 0;
	text-align: center;
}
 
.walking_detail_status_not span,
.walking_detail_status_comp span {
	color: #fff;
}

.walking_detail_status_not strong,
.walking_detail_status_comp strong {
	font-size: 4.6vw;
	display: inline-block;
	margin-right: 1vw;
}

/* 歩数・消費cal・総消費cal */
.walking_detail_count ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
	display: flex;
}

.walking_detail_count li {
	box-sizing: border-box;
	border-right: 1px solid #000;
	color: #000;
	font-weight: bold;
	padding: 1vw;
	margin: 1vw 0;
	text-align: center;
	width: calc(100%/3);
}

.walking_detail_count li:last-child {
	border: none;
}

.walking_detail_count li p {
	margin: 0;
}

.walking_detail_count li p span {
	font-size: 2.4vw;
}

.walking_detail_count li p:nth-of-type(1) {
	font-size: 2.6vw;
}

.walking_detail_count li p:nth-of-type(2) {
	color: var(--main-color);
	font-size: 4.5vw;
}

.walking_detail_count li p:nth-of-type(3) {
	font-size: 2.8vw;
	padding: 0 3vw;
	margin: -1.5vw 0 0;
	text-align: right;
}

/* 達成ポップアップ */
.walking_detail_popup {
	display: none;
	padding-top: 20px;
	padding-top: constant(safe-area-inset-top);
	padding-top: env(safe-area-inset-top);
	padding-bottom: constant(safe-area-inset-bottom);
	padding-bottom: env(safe-area-inset-bottom);
}

.walking_detail_background {
	position: fixed;
	background: rgba(0, 0, 0, 0.8);
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 99;
}

.walking_detail_popup_inner {
	margin-top: calc(env(safe-area-inset-top));
	box-sizing: border-box;
	background: #fff;
	border-radius: 1.5vw;
	text-align: center;
	overflow: hidden;
	position: fixed;
	width: 70%;
	top: 10vw;
	left: 15%;
	z-index: 100;
}

.walking_detail_popup_icon {
	background: url(../img/bg_popup_icon.svg) no-repeat top 40vw center / 100% auto;
	overflow: hidden;
	padding: 5vw 0;
	position: relative;
	z-index: 101;
}

.walking_detail_popup_icon img:nth-of-type(1) {
	opacity: 0.3;
	width: 200%;
	position: absolute;
	top: -20vw;
	left: -50%;
	z-index: 100;
	animation: rotate-anime 20s linear infinite;
}
@keyframes rotate-anime {
0%  {transform: rotate(0);}
100%  {transform: rotate(360deg);}
}

.walking_detail_popup_icon img:nth-of-type(2) {
	width: 60%;
	position: relative;
	z-index: 101;
	-webkit-animation: scale-up-center 0.6s 1s cubic-bezier(0.175, 0.885, 0.320, 1.275) both;
	        animation: scale-up-center 0.6s 1s cubic-bezier(0.175, 0.885, 0.320, 1.275) both;
}

@-webkit-keyframes scale-up-center {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
@keyframes scale-up-center {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}

.walking_detail_popup_message {
	background: var(--main-color);
	color: #fff;
	font-weight: bold;
	padding: 2vw 2vw 5vw;
}

.walking_detail_popup_message p {
	margin: 0;
}



/*====================================================================
　ポイントをためる
====================================================================*/
/*--------------------イベントリスト--------------------*/
.points_course_list {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

.points_course_list li {
	border-bottom: 1px solid var(--lightgray-color);
	padding: 4vw 2vw;
}

.points_course_list li:last-child {
	border: none;
}

.points_course_list li div {
	margin: 0.5vw 0;
}

.points_course_list li .title {
	font-weight: bold;
	font-size: 4.5vw;
}

.points_course_list li .pt::before {
	content: "";
	display: inline-block;
	margin: 0 0.5em -0.5vw 0;
	width: 5vw;
	height: 5vw;
	background: url(../img/icon_points.png) no-repeat center center / 100% auto;
}

.points_course_list li .pt span {
	font-weight: bold;
	font-size: 4.2vw;
}

.points_course_list li .place::before {
	content: "";
	display: inline-block;
	margin: 0 0.5em -0.5vw 0;
	width: 5vw;
	height: 5vw;
	background: url(../img/icon_place.png) no-repeat center center / 100% auto;
}

.points_course_list li .term {
	color: #666;
}

.points_course_list li .term::before {
	content: "";
	display: inline-block;
	margin: 0 0.5em -0.5vw 0;
	width: 5vw;
	height: 5vw;
	background: url(../img/icon_term.png) no-repeat center center / 100% auto;
}

.points_course_list li .bt_detailpoint {
	border: 2px solid var(--main-color);
	border-radius: 1.5vw;
	color: var(--main-color);
	display: inline-block;
	font-weight: bold;
	padding: 1.5vw 3vw;
	margin: 2vw 8vw 0 0;
	text-decoration: none;
}

.points_course_list li .bt_getpoint {
	border: 2px solid var(--sub-color1);
	border-radius: 1.5vw;
	color: var(--sub-color1);
	display: inline-block;
	font-weight: bold;
	padding: 1.5vw 3vw;
	margin: 2vw 0 0 0;
	text-decoration: none;
}

.points_course_list li .bt_detailpoint::after,
.points_course_list li .bt_getpoint::after {
	font-family: 'Font Awesome 5 Free';
	display: inline-block;
	margin-left: 0.5em;
	content: "\f105";
}

/*--------------------イベント詳細--------------------*/
/* イベント名 */
.points_detail h2 {
	font-size: 5.5vw;
	margin: 0;
}

/* 取得可能ポイント数 */
.points_detail .get_point {
	font-weight: bold;
	font-size: 4.5vw;
	padding: 2vw;
	margin: 3vw 0;
	text-align: center;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.points_detail .get_point p {
	margin: 0;
}

.points_detail .get_point span {
	font-size: 7vw;
}

/* QRコードリーダーボタン */
.bt_qr {
	background: #fff;
	border-radius: 1vw;
	display: block;
	padding: 2vw 1vw 0;
	width: 22%;
}

.bt_qr img {
	width: 100%;
}

/* イベント詳細 */
.points_detail_text {
	margin: 5vw 0;
}

.points_detail_text strong {
	color: var(--sub-color1);
}

/* マップ */
.map {
	margin: 5vw 0;
}

/*--------------------ポイント取得--------------------*/
.points_get_popup {
	padding-top: 20px;
	padding-top: constant(safe-area-inset-top);
	padding-top: env(safe-area-inset-top);
	padding-bottom: constant(safe-area-inset-bottom);
	padding-bottom: env(safe-area-inset-bottom);
	box-sizing: border-box;
	background: var(--main-color);
	text-align: center;
	overflow: hidden;
	width: 100%;
	height: 100%;
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 99;
}

.points_get_popup_icon {
	background: #fff url(../img/bg_popup_icon.svg) no-repeat top 50vw center / 100% auto;
	overflow: hidden;
	padding: 5vw 0;
	position: relative;
	z-index: 101;
}

/* コイン裏画像（回転） */
.points_get_popup_icon img:nth-of-type(1) {
	opacity: 0.3;
	width: 200%;
	position: absolute;
	top: -20vw;
	left: -50%;
	z-index: 100;
	animation: rotate-anime 20s linear infinite;
}
@keyframes rotate-anime {
0%  {transform: rotate(0);}
100%  {transform: rotate(360deg);}
}

/* ポイント画像 */
.points_get_popup_icon img:nth-of-type(2) {
	width: 48%;
	position: relative;
	z-index: 101;
	-webkit-animation: flip-in-ver-left 0.8s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	        animation: flip-in-ver-left 0.8s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

@-webkit-keyframes flip-in-ver-left {
  0% {
    -webkit-transform: rotateY(360deg);
            transform: rotateY(360deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateY(0);
            transform: rotateY(0);
    opacity: 1;
  }
}
@keyframes flip-in-ver-left {
  0% {
    -webkit-transform: rotateY(360deg);
            transform: rotateY(360deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateY(0);
            transform: rotateY(0);
    opacity: 1;
  }
}

.points_get_popup_icon p {
	color: var(--sub-color2);
	font-size: 7vw;
	font-weight: bold;
	width: 48%;
	position: absolute;
	top: 12vw;
	left: 26%;
	z-index: 101;
	-webkit-animation: fade-in 0.4s 0.8s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
	        animation: fade-in 0.4s 0.8s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
}

@-webkit-keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

.points_get_popup_icon p strong {
	font-size: 15vw;
}

.points_get_popup_message {
	color: #fff;
	font-weight: bold;
	padding: 2vw 2vw 5vw;
}

.points_get_popup_message p {
	font-size: 5vw;
}

.points_get_popup_message p strong {
	font-size: 8vw;
}



/*====================================================================
　健康手帳
====================================================================*/
/*--------------------各ページタイトル--------------------*/
.checkup-title {
	text-align: center;
}

/*--------------------特定健診受けてね--------------------*/
.checkup_attention {
	margin: 0;
	padding: 2vw;
	background: #fdf0f0;
	color: #e84057;
	text-align: center;
}

/*--------------------現在のポイント(他画面共通)--------------------*/
.now_point {
	margin: 5vw;
	background: #fff;
	font-weight: bold;
	text-align: center;
}

.now_point p {
	box-sizing: border-box;
	margin: 0;
	padding: 3vw 0 3vw 20%;
	background: url(../img/coin.png) no-repeat left center;
	background-size: auto 60%;
}

.now_point strong {
	color: #FF4500;
	font-size: 5.5vw;
}

.now_point strong span {
	font-size: 3.8vw;
}

/*--------------------各種ボタン--------------------*/
.note-bts-wrapper {
	padding: 0 1em 1em 1em;
	margin-bottom: 1em;
	box-shadow: 0 5px 5px -3px rgba(0,0,0,0.15);
}

.note-bts {
	margin: 0;
	padding: 0;
	list-style-type: none;
}

.note-bts li {
	float: left;
	width: 33.3%;
	text-align: center;
}

.note-bts li:first-child { text-align: left; }
.note-bts li:last-child { text-align: right; }

/*.bt-note {
	-webkit-appearance: none;
	display: block;
	width: 100%;
	height: 45px;
	line-height: 45px;
	margin-top: 1em;
	border-radius: 5px;
	background: #fff;
	font-size: 17px;
	font-weight: bold;
	text-align: center;
	text-decoration: none!important;
}*/

/*.bt-note2 {
	-webkit-appearance: none;
	box-sizing: border-box;
	width: 95%;
	height: 4em;
	padding: 0;
	margin: 0 auto;
	border-radius: 5px;
	background: #fff;
	font-size: 16px;
	font-weight: bold;
	text-align: center;
}

.note-bts li:nth-child(2) .bt-note2 { letter-spacing: -0.175em; }*/

/* ポイント取得履歴 */
.bt-history { border: 1px solid #67af31; color: #67af31; }

/* プロフィール設定 */
.bt-profile { border: 1px solid #0f8fb9; color: #0f8fb9; }

/*--------------------歩数履歴・ポイント取得履歴ボタン--------------------*/
.menu_history {
	list-style-type: none;
	margin: 0 3vw;
	padding: 0;
	display: flex;
}

.menu_history li {
	width: 46%;
	margin: 0 2%;
}

.menu_history li a {
	box-sizing: border-box;
	border-radius: 1vw;
	display: block;
	font-size: 4vw;
	font-weight: bold;
	padding: 0 2vw 15vw 2vw;
	line-height: 1.8;
	text-align: center;
	text-decoration: none;
}

.menu_history li:nth-child(1) a {
	background: url(../img/menu_note1.png) no-repeat center bottom;
	background-size: 75% auto;
	border: 1px solid #3aabd2;
	color: #3aabd2;
}

.menu_history li:nth-child(2) a {
	background: url(../img/menu_note2.png) no-repeat center bottom;
	background-size: 75% auto;
	border: 1px solid #67af31;
	color: #67af31;
}

/*--------------------受診情報・身体情報--------------------*/
.checkup_list {
	margin: 8vw 0 0;
}

/* 受診情報・身体情報 切替ボタン */
.menu_checkup {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

.menu_checkup li {
	box-sizing: border-box;
	background: #ccc;
	color: #fff;
	float: left;
	font-size: 4.5vw;
	font-weight: bold;
	text-align: center;
	padding: 3.5vw 0;
	margin: 0 0 -1px;
	width: 50%;
}

.menu_checkup li:nth-child(1).selected {
	background: var(--main-color);
	position: relative;
}

.menu_checkup li:nth-child(1).selected:before {
	position: absolute;
	bottom: -6.5vw;
	left: 43%;
	z-index: 50;
	content: " ";
	display: block;
	width: 0;
	height: 0;
	border: 3vw solid transparent;
	border-top: 3vw solid var(--main-color);
}

.menu_checkup li:nth-child(2).selected {
	background: #ffbf26;
	position: relative;
}

.menu_checkup li:nth-child(2).selected:before {
	position: absolute;
	bottom: -6.5vw;
	left: 43%;
	z-index: 50;
	content: " ";
	display: block;
	width: 0;
	height: 0;
	border: 3vw solid transparent;
	border-top: 3vw solid #ffbf26;
}

/*--------------------受診情報・身体情報枠--------------------*/
.checkup1 {
	border-top: 4px solid var(--main-color);
	position: relative;
	z-index: 50;
}

.checkup2 {
	border-top: 4px solid #ffbf26;
	position: relative;
	z-index: 50;
}

.checkup1 p,
.checkup2 p {
	padding: 0;
}

.checkup1 hr,
.checkup2 hr {
	margin: 5vw -3vw;
}

/*--------------------受診情報リスト--------------------*/
/* 健診名 */
.checkup_list h2::before {
	content: "●";
}

/* 取得可能ポイント数 */
.get_point {
	background: #f4f4f4;
	border-radius: 1vw;
	padding: 1vw;
	margin: 0 0.5em;
}

.get_point strong {
	color: #FF4500;
	display: inline-block;
	margin: 0 0.5em;
}

.get_point strong span {
	font-size: 5.5vw;
}

/* 受診情報 */
.checkup_list dl {
	margin: 0;
	padding: 0;
}

.checkup_list dt {
	margin: 0.5em 0 0;
	padding: 0.25em 0.5em;
	color: #6cb246;
	font-weight: bold;
}

.checkup_list dd {
	margin: 0 0 0.5em;
	padding: 0.25em 0.5em;
	border-bottom: 1px dashed #b8b8ba;
}

.checkup_list dl dd:last-child { border: none; }

.checkup_list dd table {
	box-sizing: border-box;
	border-collapse: collapse;
	width: 100%;
}

.checkup_list dd tr td {
	box-sizing: border-box;
	padding: 0;
	vertical-align: middle;
}

/*--------------------身体情報確認--------------------*/
/* 最新測定日 */
.checkup_latest {
	margin: 5vw 0;
	padding: 0.5em;
	border-bottom: 1px dashed #dadada;
}

.checkup_latest strong {
	color: var(--main-color);
}

.checkup_latest span {
	font-size: 4vw;
	float: right;
	margin-top: -0.1em;
	width: 10em;
}

/* 測定情報 */
.checkup_measure dt {
	margom: 0;
	padding: 0.25em 0;
	color: var(--sub-color1);
	font-weight: bold;
}

.checkup_measure dt a {
	color: var(--main-color);
	font-size: 7vw;
	float: right;
}

.checkup_measure dt span {
	color: #999;
	font-size: 3.2vw;
	float: right;
}

.checkup_measure dd {
	color: #333;
	font-family: Arial, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Verdana, sans-serif;
	font-size: 6vw;
	font-weight: normal;
	margin: 0;
	padding: 0.25em 0.5em;
	border-bottom: 1px dashed #b8b8ba;
}

.checkup_measure dd em {
	font-style: normal;
	font-size: 4vw;
}

.checkup_measure dd button {
	background: transparent;
	border: none;
	color: #333;
	font-family: Arial, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Verdana, sans-serif;
	font-size: 6vw;
	font-weight: normal;
	display: block;
	padding: 0;
	margin: 0;
	text-align: left;
	width: 100%;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	-webkit-box-shadow: none;
	box-shadow: none;
	outline: none;
	position: relative;
}

.checkup_measure dd button::after {
	content: "グラフで見る >";
	background: var(--main-color);
	color: #fff;
	font-size: 3.2vw;
	text-align: center;
	padding: 1vw 2vw;
	border-radius: 100vw;
	position: absolute;
	bottom: 0;
	right: 0;
}

.checkup_measure dd span {
	font-size: 4vw;
}

/*--------------------歩数履歴・体重・血圧グラフ表示画面--------------------*/
/* 週・月切替ボタン */
.checkup_term_select {
	list-style-type: none;
	margin: 5vw 0;
	padding: 0;
	display: flex;
}

.checkup_term_select li {
	width: 50%;
}

.checkup_term_select button {
	background: #fff;
	border: 1px solid var(--main-color);
	border-radius: 0;
	color: var(--main-color);
	display: block;
	font-size: 4vw;
	font-weight: normal;
	padding: 0.5em 0;
	line-height: 1;
	width: 100%;
}

.checkup_term_select li:nth-child(1) button {
	border-top-left-radius: 2vw;
	border-bottom-left-radius: 2vw;
}

.checkup_term_select li:nth-child(2) button {
	border-top-right-radius: 2vw;
	border-bottom-right-radius: 2vw;
}

.checkup_term_select li.select button {
	background: var(--main-color);
	border: 1px solid var(--main-color);
	color: #fff;
}

/* 表示期間 */
.checkup_term {
	color: #b8b8ba;
	font-size: 4.2vw;
	font-weight: bold;
	text-align: center;
	padding: 0;
	margin: 8vw 0 3vw;
}

/* 表示期間切替ボタン */
.checkup_term_move {
	list-style-type: none;
	margin: -10vw 0 0;
	padding: 0;
	display: flex;
	justify-content: space-between;
}

.checkup_term_move li {
	width: 10vw;
	text-align: center;
}

.checkup_term_move li:nth-child(1) {
	margin-left: -3vw;
}

.checkup_term_move li:nth-child(2) {
	margin-right: -3vw;
}

.checkup_term_move button {
	background: transparent;
	border: none;
}

.checkup_term_move i {
	color: #b8b8ba;
	font-size: 8vw;
	font-weight: bold;
}

/* チャート表示エリア */
#chart-area {
	margin: 5vw 0;
}

/*--------------------ポイント取得履歴--------------------*/
.history_points_list dt {
	background: #f5f5f5;
	color: var(--main-color);
	font-weight: bold;
	padding: 4vw 3vw;
	margin-top: 5vw;
	box-shadow: 0 5px 5px -3px rgba(0,0,0,0.15);
	position: relative;
}

.history_points_list dt::after {
	font-family: 'Font Awesome 5 Free';
	content: "\f077";
	color: var(--main-color);
	font-weight: bold;
	position: absolute;
	top: 28%;
	right: 3vw;
}

.history_points_list dt.active::after{
	-webkit-transform: rotate(180deg);
	transform: rotateZ(180deg);
}

.history_points_list dd {
	padding: 0;
	margin: 0;
}

.history_points_list dd p {
	font-size: 3.4vw;
	margin: 3vw;
}

.history_points_list dd table {
	box-sizing: border-box;
	border-collapse: collapse;
	width: 100%;
}

.history_points_list dd table tr {
	border-top: 1px solid #ccc;
}

.history_points_list dd table tr:first-child {
	border: none;
}

.history_points_list dd table tr:nth-child(odd) {
	background: #f1faea;
}

.history_points_list dd table td {
	box-sizing: border-box;
	padding: 3vw 2vw;
	text-align: left;
}

.history_points_list dd table td:nth-of-type(1) {
	width: 30%;
}

.history_points_list dd table td:nth-of-type(2) {
	color: var(--sub-color1);
	font-weight: bold;
	width: 12%;
}

.history_points_list dd table td:nth-of-type(2) span {
	font-size: 5.5vw;
}

/*--------------------受診情報登録--------------------*/
.checkup_reserve_list h2::before {
	content: "●";
}

.checkup_reserve_list h3 {
	margin: 0;
	padding: 0.5em 0 0;
	border-top: 1px dashed #b8b8ba;
}

.checkup_reserve_list dl {
	margin: 0;
	padding: 0;
}

.checkup_reserve_list dt {
	color: #49596b;
	font-weight: bold;
	margin: 0;
	padding: 0.25em 0;
}

.checkup_reserve_list dd {
	margin: 0;
	padding: 0.25em 0;
}


/*--------------------身体情報の登録--------------------*/
.checkup_form dl dt span {
	color: #999;
	font-size: 3vw;
	float: right;
	padding-top: 0.3em;
}

.checkup_form dl dd input {
	width: 30%;
}


/*--------------------ポイント取得ポップアップ--------------------*/
.checkup_popup {
	position: fixed;
	z-index: 99;
	display: none;
	padding-top: 20px;
	padding-top: constant(safe-area-inset-top);
	padding-top: env(safe-area-inset-top);
	padding-bottom: constant(safe-area-inset-bottom);
	padding-bottom: env(safe-area-inset-bottom);
}

.checkup_background {
	position: fixed;
	background: rgba(0, 0, 0, 0.8);
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 99;
}

.checkup_popup_inner {
	margin-top: calc(env(safe-area-inset-top));
	box-sizing: border-box;
	background: #fff;
	border-radius: 1.5vw;
	text-align: center;
	overflow: hidden;
	position: fixed;
	width: 70%;
	top: 10vw;
	left: 15%;
	z-index: 100;
}

.checkup_popup_icon {
	background: url(../img/bg_popup_icon.svg) no-repeat top 38vw center / 100% auto;
	overflow: hidden;
	padding: 5vw 0;
	position: relative;
	z-index: 101;
}

.checkup_popup_icon img:nth-of-type(1) {
	opacity: 0.3;
	width: 200%;
	position: absolute;
	top: -20vw;
	left: -50%;
	z-index: 100;
	animation: rotate-anime 20s linear infinite;
}
@keyframes rotate-anime {
0%  {transform: rotate(0);}
100%  {transform: rotate(360deg);}
}

.checkup_popup_icon img:nth-of-type(2) {
	width: 48%;
	position: relative;
	z-index: 101;
	-webkit-animation: flip-in-ver-left 0.8s 0.6s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	        animation: flip-in-ver-left 0.8s 0.6s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

@-webkit-keyframes flip-in-ver-left {
  0% {
    -webkit-transform: rotateY(360deg);
            transform: rotateY(360deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateY(0);
            transform: rotateY(0);
    opacity: 1;
  }
}
@keyframes flip-in-ver-left {
  0% {
    -webkit-transform: rotateY(360deg);
            transform: rotateY(360deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateY(0);
            transform: rotateY(0);
    opacity: 1;
  }
}

.checkup_popup_icon p {
	color: var(--sub-color2);
	font-size: 7vw;
	font-weight: bold;
	width: 48%;
	position: absolute;
	top: 8vw;
	left: 26%;
	z-index: 101;
	-webkit-animation: fade-in 0.4s 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
	        animation: fade-in 0.4s 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
}

@-webkit-keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

.checkup_popup_icon p strong {
	font-size: 10vw;
}

.checkup_popup_message {
	background: var(--main-color);
	color: #fff;
	font-weight: bold;
	padding: 2vw 2vw 5vw;
}

.checkup_popup_message p {
	margin: 0;
}



/*====================================================================
　抽選会に参加する・プレゼントを引換える
====================================================================*/
/*--------------------参加・引換え前画面--------------------*/
/* 参加・引換え画面文言 */
.prize_detail_text {
	font-weight: bold;
	padding: 0 5vw;
}

.prize_detail_text p {
	background: var(--main-color);
	border-radius: 100vw;
	color: #fff;
	padding: 2vw;
	text-align: center;
	position: relative;
}

.prize_detail_text p img {
	width: 15%;
	position: absolute;
	top: -4vw;
	left: 5%;
}

.prize_detail_text strong {
	color: var(--sub-color2);
}

/* プレゼント名・画像・詳細文 */
.prize_img {
	background: var(--bg-color);
	padding: 2vw;
	margin: 5vw 0;
	text-align: center;
	position: relative;
}

.prize_img .title {
	color: var(--main-color);
	font-weight: bold;
	font-size: 5vw;
	margin: 2vw 0;
}

.prize_img img {
	width: 80%;
}

/* 賞品・プレゼント画像 */
.prize_detail .pass_attention strong::before {
	font-family: 'Font Awesome 5 Free';
	content: "\f0da";
	display: inline-block;
	margin-right: 0.25em;
}

/* 完了ボタン */
.prize_btn {
	font-weight: bold;
	text-align: center;
}

.prize_btn ul {
	color: var(--sub-color2);
	font-size: 3.6vw;
	list-style-type: none;
	margin: 0;
	padding: 0;
	text-align: left;
}

.prize_btn li {
	margin-left: 1em;
}

.prize_btn li::before {
	content: "※";
	display: inline-block;
	margin-left: -1em;
}

/*--------------------参加・引換え前画面--------------------*/
/* 参加・引換え後画面文言 */
.prize_comp .prize_detail_text {
	padding: 5vw 0 0;
	display: flex;
	align-items: flex-start;
}

.prize_comp .prize_detail_text img {
	display: inline-block;
	padding-right: 3vw;
	margin-top: -3vw;
	width: 18%;
}

.prize_comp .prize_detail_text strong {
	color: var(--sub-color2);
	font-size: 4.2vw;
}

/* 参加・交換済み画像*/
.prize_img .sumi {
	width: 40%;
	position: absolute;
	bottom: 8vw;
	left: 30%;
	-webkit-animation: puff-in-center 0.5s cubic-bezier(0.470, 0.000, 0.745, 0.715) both;
	        animation: puff-in-center 0.5s cubic-bezier(0.470, 0.000, 0.745, 0.715) both;
}

@-webkit-keyframes puff-in-center {
  0% {
    -webkit-transform: scale(1.5) rotate(10deg);
            transform: scale(1.5) rotate(10deg);
    -webkit-filter: blur(4px);
            filter: blur(4px);
    opacity: 0;
  }
  100% {
    -webkit-transform: scale(1) rotate(10deg);
            transform: scale(1) rotate(10deg);
    -webkit-filter: blur(0px);
            filter: blur(0px);
    opacity: 1;
  }
}
@keyframes puff-in-center {
  0% {
    -webkit-transform: scale(1.5) rotate(10deg);
            transform: scale(1.5) rotate(10deg);
    -webkit-filter: blur(4px);
            filter: blur(4px);
    opacity: 0;
  }
  100% {
    -webkit-transform: scale(1) rotate(10deg);
            transform: scale(1) rotate(10deg);
    -webkit-filter: blur(0px);
            filter: blur(0px);
    opacity: 1;
  }
}

/* 参加日・引換え日・コード */
.prize_comp .pass_attention {
	text-align: center;
}

/*--------------------プレゼント申込画面--------------------*/
.apply-name {
	background: #dcecd0;
	color: var(--sub-color1);
	font-weight: bold;
	padding: 5vw;
	text-align: center;
}

.apply-name strong {
	color: var(--main-color);
	font-size: 6vw;
}



/*====================================================================
　フォーム設定
====================================================================*/
.form dt {
	margin: 0.75em 0 0;
	padding: 0.25em 0.5em;
	border-bottom: 1px dashed #dadada;
	color: #49596b;
	font-weight: bold;
}

.form dd {
	font-size: 4.5vw;
	margin: 0;
	padding: 0.25em 0.5em;
}

.form dd .error {
	margin: 0.25em 0;
}

.form dd .other {
	color: #777;
	display: block;
	margin-top: 0.5em;
}

.form ::placeholder {
	color: #d7dcde;
}

.required {
	color: #d52e5a;
}

input[type="radio"] {
    -webkit-appearance: none;
    position: relative;
    margin-right: 5px;
    border-radius: 18px;
    border: 5px solid #d7dcde;
    -webkit-box-sizing: border-box;
    width: 36px;
    height: 36px;
    /*background: -webkit-gradient(
        linear,
        left top,
        left bottom,
        from(#fdfdfd),
        to(#d1d1d1)
    );*/
	background: #fff;
    vertical-align: middle;
}
input[type="radio"]:checked {
    /*background: -webkit-gradient(
        linear,
        left top,
        left bottom,
        from(#353535),
        to(#8f8f8f)
    );*/
	border: 5px solid var(--main-color);
	background: #fff;
}
input[type="radio"]:checked:before {
    position: absolute;
    left: 12px;
    top: 12px;
    display: block;
    margin: -5px 0 0 -5px;
    /*-webkit-box-shadow: 0 2px 1px rgba(0, 0, 0, 1);*/
    content: "";
    border-radius: 6px;
    width: 12px;
    height: 12px;
    /*background: -webkit-gradient(
        linear,
        left top,
        left bottom,
        from(#fdfdfd),
        to(#d1d1d1)
    );*/
	background: var(--main-color);
}
input[type="checkbox"] {
	-webkit-appearance: none;
	position: relative;
	margin-right: 5px;
	border-radius: 8px;
	/*border: 5px solid #4c4c4c;*/
	border: none;
	-webkit-box-sizing: border-box;
	width: 28px;
	height: 28px;
	/*background: -webkit-gradient(
		linear,
		left top,
		left bottom,
		from(#fdfdfd),
		to(#d1d1d1)
	);*/
	background: #d7dcde;
	vertical-align: middle;
}

input[type="checkbox"]:checked {
    /*background: -webkit-gradient(
        linear,
        left top,
        left bottom,
        from(#353535),
        to(#8f8f8f)
    );*/
	background: var(--main-color);
}
input[type="checkbox"]:checked:before {
    position: absolute;
    left: 4px;
    top: 20px;
    display: block;
    /*-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 1);*/
    content: "";
    width: 10px;
    height: 4px;
    background: #fff;
    -webkit-transform: rotate(45deg);
    -webkit-transform-origin: right center;
}
input[type="checkbox"]:checked:after {
    display: block;
    position: absolute;
    left: 12px;
    top: 20px;
    content: "";
    /*-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 1);*/
    width: 19px;
    height: 4px;
    background: #fff;
    -webkit-transform: rotate(-53deg);
    -webkit-transform-origin: left center;
}
input[type="text"],
input[type="email"],
input[type="number"],
input[type="tel"],
input[type="password"],
select,
textarea {
	font-size: 130%;
	padding: 0.2em;
}

textarea {
	width: 96%;
	height: 3.5em;
}

input[type="text"],
input[type="email"],
input[type="number"],
input[type="tel"],
input[type="password"],
textarea {
	-webkit-appearance: none;
	border: 2px solid #d7dcde;
	border-radius: 5px;
	-moz-box-shadow: inset 1px 4px 9px -6px rgba(0,0,0,0);
	-webkit-box-shadow: inset 1px 4px 9px -6px rgba(0, 0, 0, 0);
	box-shadow: inset 1px 4px 9px -6px rgba(0,0,0,0);
}

button[disabled],
input[disabled] {
	opacity: 0.3;
}

select {
	-webkit-appearance: none;
	box-sizing: border-box;
	border: 2px solid #d7dcde;
	border-radius: 5px;
	font-size: 120%;
	padding: 1vw 25px 1vw 1vw;
	margin-bottom: 0.2em;
	background: url(../img/icon_select.png) no-repeat right center;
	background-size: 25px auto;
	max-width: 100%;
}

.submit {
	-webkit-appearance: none;
	width: 100%;
	padding: 3vw;
	margin-top: 1em;
	border-radius: 5px;
	border: 1px solid #e63600;
	background: #fff;
	color: #e63600;
	font-size: 5vw;
	font-weight: bold;
	text-align: center;
}

/*.pass {
	-webkit-appearance: none;
	width: 100%;
	height: 45px;
	line-height: 45px;
	margin-top: 1em;
	border-radius: 5px;
	border: 1px solid #63818f;
	background: #fff;
	color: #63818f;
	font-size: 18px;
	font-weight: bold;
	text-align: center;
}*/

.reset {
	-webkit-appearance: none;
	width: 100%;
	padding: 3vw;
	margin-top: 1em;
	border-radius: 5px;
	border: 1px solid #999;
	background: #fff;
	color: #999;
	font-size: 5vw;
	font-weight: bold;
	text-align: center;
}

/*.skip {
	display: block;
	width: 100%;
	height: 45px;
	line-height: 45px;
	margin-top: 1em;
	border-radius: 5px;
	border: 1px solid #008ccb;
	background: #fff;
	color: #008ccb;
	font-size: 18px;
	font-weight: bold;
	text-align: center;
	text-decoration: none;
}*/

::placeholder {
	color: #999;
	font-size: 3.4vw;
}



/*====================================================================
　アプリのバージョン情報画面設定
====================================================================*/
.version .block {
	font-size: 5vw;
	text-align: center;
}

.version_title {
	color: var(--main-color);
	font-weight: bold;
	margin: 10vw 0 3vw;
}



/*====================================================================
　データ引継ぎパスワード設定
====================================================================*/
.userpassword p span {
	color: var(--sub-color2);
}



/*====================================================================
　お問い合わせ画面設定
====================================================================*/
.contact .title {
	color: var(--main-color);
	font-weight: bold;
	font-size: 5vw;
	text-align: center;
}

/* お電話によるお問い合わせ */
.contact_tel {
	text-align: center;
}

.contact_tel a {
	font-weight: bold;
	font-size: 6vw;
}

.contact_tel p:nth-of-type(2) {
	font-weight: bold;
}

.contact_tel p:nth-of-type(3) {
	text-align: left;
}

.contact_tel p span {
	color: var(--sub-color2);
}

/* メールによるお問い合わせ */


/* 個人情報取り扱いへの同意 */
.contact_privacy .title {
	color: #333;
	font-size: 3.8vw;
}

.contact_privacy label {
	display: block;
	font-weight: bold;
	text-align: center;
}

.contact_privacy_text {
	border: 2px solid #ccc;
	border-radius: 1vw;
	padding: 2vw;
	height: 30vw;
	overflow: scroll;
}



/*====================================================================
　ヘルプ（使い方・利用方法）項目画面
====================================================================*/
.menu {
	background: #eee;
	min-height: 100vh;
}

.menu ul {
	font-weight: bold;
	list-style-type: none;
	padding: 0;
	margin: 5vw 0 0;
}

.menu li {
	background: #fff;
	border-bottom: 3px solid #eee;
	position: relative;
}

.menu li a {
	padding: 5vw 6vw 5vw 3vw;
	color: #333;
	font-size: 4.2vw;
	text-decoration: none;
	display: block;
}

.menu li a::after {
	font-family: 'Font Awesome 5 Free';
	content: "\f105";
	color: var(--main-color);
	font-weight: bold;
	position: absolute;
	right: 3vw;
	top: 30%;
}



/*====================================================================
　ヘルプ（使い方）利用方法
====================================================================*/
.howto_content h1 span {
	font-size: 3.2vw;
}

.howto_content h3 {
	font-size: 16px;
	background: #036eb8;
	color: #fff;
	padding: 0.5em;
}

.howto_content .box {
	background: #fff;
	padding: 10px;
}

.howto_content .swiper-container {
	font-weight: bold;
	margin: 5vw 0 0;
}

.howto_content .swiper-slide {
	width: 94%!important;
	margin: 0 3%;
}

.howto_content .swiper-slide a,
.howto_content .swiper-slide a:visited {
	color: var(--main-color);
}

.howto_content .swiper-slide span {
	font-weight: bold;
	color: #046eb8;
	font-size: 16px;
}

.howto_content .description {
	font-size: 20px;
	margin-top: 80px;
}

.howto_content .attention {
	padding: 0 5vw;
	font-size: 3.8vw;
	text-align: left;
}

.howto_content .attention strong {
	color: var(--sub-color1);
	font-weight: bold;
	font-size: 5vw;
	display: block;
	padding-bottom: 5vw;
}

.howto_content .attention strong i {
	font-size: 5vw;
}

.howto_content .attention p {
	margin: 0;
}

.howto_content .attention span {
	padding: 2vw 0;
	display: inline-block;
	color: var(--sub-color1);
}

.howto_content .attention a {
	margin: 2vw 0;
	display: inline-block;
}

.howto_content img {
	/* キャプチャが取れるまで非表示 */
	opacity: 0;
	/* キャプチャが取れるまで非表示 */
	margin: 5vw auto 0;
	width: 60%;
	display: block;
}



/*====================================================================
　ヘルプ（使い方）Q&A
====================================================================*/
.faq ul {
	padding: 0;
	margin: 0;
	list-style-type: none;
}

.faq li {
	margin: 0 3vw;
	padding: 3vw 0 1vw;
	background: #fff;
	border-bottom: 2px solid #eee;
}

.faq li p {
	padding-left: 10vw;
	margin: 0 0 2vw;
}

.faq .question {
	cursor: pointer;
}

.faq .question p {
	font-weight: bold;
	font-size: 3.8vw;
}

.faq .question:before {
	content: "Q";
	color: #fff;
	font-size: 4.5vw;
	font-weight: bold;
	background: var(--main-color);
	border-radius: 100vw;
	padding: 1vw 2.2vw;
	margin: -1vw 0 0 0;
	display: inline-block;
	float: left;
}

.faq .answer {
	display: none;
}

.faq .answer p {
	border-top: 2px dotted #eee;
	margin: 2vw;
	padding: 2vw 0 0;
}

.faq .answer p span {
	font-weight: bold;
}

.faq img {
	/* キャプチャが取れるまで非表示 */
	display: none;
	/* キャプチャが取れるまで非表示 */
	margin-bottom: 2vw;
}



/*====================================================================
　ヘルプ（使い方）利用規約
====================================================================*/
.term table {
	margin: 0;
	padding: 0;
	text-align: left;
}

.term th {
	padding: 20px 0 10px;
	border-bottom: 2px solid #eee;
}

.term td {
	padding: 10px 0;
}

.term ol,
.term ul {
	padding: 10px 0 0;
	margin: 0;
}

.term li {
	padding: 0 0 10px 0;
}

.term ol li {
	list-style: decimal;
	list-style-position: outside;
	margin: 0 0 0 25px;
}

.term ul li {
	list-style: none;
}

.term li ul li {
	margin: 0;
}

.term p {
	margin: 1em 0;
}



/*====================================================================
　ヘルプ（使い方）利用規約
====================================================================*/
.privacy table {
	margin: 0;
	padding: 0;
	text-align: left;
}

.privacy th {
	padding: 5vw 0 3vw;
	border-bottom: 2px solid #eee;
}

.privacy td {
	padding: 3vw 0;
}

.privacy ol,
.privacy ul {
	padding: 3vw 0 0;
	margin: 0;
}

.privacy li {
	padding: 0 0 3vw 0;
}

.privacy ol li {
	list-style: decimal;
	list-style-position: outside;
	margin: 0 0 0 1.5em;
}

.privacy ul li {
	list-style: disc;
	list-style-position: outside;
	margin: 0 0 0 1.5em;
}

.privacy li ul li {
	margin: 0;
}

.privacy p {
	margin: 1em 0;
}



/*====================================================================
　ヘルプ（使い方）BMI
====================================================================*/

.bmi_content div {
	padding: 5vw;
}

.bmi_content span {
	font-weight: bold;
	font-size: 4.2vw;
	display: block;
	line-height: 1.5;
	text-align: center;
	margin: 5vw 0;
}

.bmi_content table {
	border-collapse: collapse;
	font-weight: bold;
	width: 100%;
}

.bmi_content th {
	border: 1px solid #999;
	color: #fff;
	text-align: left;
	padding: 2vw;
}

.bmi_content tr:nth-child(1) th {
	background: #66a2d9;
}

.bmi_content tr:nth-child(2) th {
	background: #3f9c6f;
}

.bmi_content tr:nth-child(3) th {
	background: #9dc332;
}

.bmi_content tr:nth-child(4) th {
	background: #fcb804;
}

.bmi_content tr:nth-child(5) th {
	background: #f37e1f;
}

.bmi_content tr:nth-child(6) th {
	background: #f3571c;
}

.bmi_content td {
	border: 1px solid #999;
	text-align: left;
	padding: 2vw 3vw;
}