/* common */
/* body.css */
html{
    background-color: #ffffff;
}
/* 全体のスタイル */
body {
    font-family: 'Arial', sans-serif;
    color: #333;
    margin:0;
    height: 100%;
	line-height: 1.5;
	-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
	padding:0;
	font-size: 15px;
    max-height: none;
}
.links{
		display:flex;
	justify-content:flex-end;
	align-items: center;	
}

a:visited{
    color: #333;
}
.logo img{
    width: auto;;
    height:50px;
}

#chk{
	display: none;
}
#humbt{
		display:inline-block;
    width:30px;
    height:30px;
    cursor: pointer;
	position:relative;
	margin-left: 1em;
}

#humbt span {
    display: block;
    position: absolute;
    height:4px;
    width: 100%;
    background:#999;
    left: 0;
    -webkit-transition: .35s ease-in-out;
    -moz-transition: .35s ease-in-out;
    transition: .35s ease-in-out;
}	
#humbt span:nth-child(2) {
    top:13px;
}
#humbt span:nth-child(3) {
    top:26px;
}	
#editor .ProseMirror,
#editor .ProseMirror.toastui-editor-contents{
    font-size: 15px;
    font-family: "Helvetica Neue",
    Arial,
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    Meiryo,
    sans-serif;
}

select.base{
padding: 0.5em;
margin:0 0 1em 2em;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    color: #000000;
    font-size: 15px;
}

.dashboard .middle .news ul li{
width: 100%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}

.title img{width:auto;
    max-width:380px;
    height: auto;}


/*-----------------------
 calendar
-------------------------*/
#calendar {
	display: flex;
  justify-content: center;
  align-items:stretch;

    flex-wrap: wrap;
    width: 100%;
}
.goal_notes h2.race_title{
    margin: 0;
}
.goal_notes h2.race_title a{
    font-size: 13px;
    font-weight: normal;
}
#calendar h3{margin-bottom: 0.5em;}
#calendar .month {
    border: 1px solid #ccc;
    margin: 5px;
    width: calc(30% - 10px);
    padding: 10px;
}
#calendar table {
    width: 100%;
    border-collapse: collapse;
}

#calendar th,#calendar td {
    width:14.28%; /* 7日分で均等に */
    height: 40px; /* 高さを設定 */
    text-align: center;
    border: 1px solid #ddd;
}
#calendar th{
height: 30px;
	background-color: #f2f2f2;
}
#calendar .holiday {
    background-color:#E8CB74; /* 休業日の色 */
}
#calendar .weekday {
    background-color:#ffffff; /* 通常日の色 */
}
#calendar-container p.txtC{
	font-size: 13px;
	display: flex;
  justify-content: center;
  align-items: center;
}
#calendar-container p.txtC span{
color: #E8CB74;
	font-size:20px;
}
#calendar-container p.txtC button{
	margin: 0 1em;
	cursor: pointer;
	border: 1px solid #ccc;
	background-color: #f2f2f2;
}

table.ta{
	border-collapse:collapse;
border-spacing:0;
empty-cells:show;
}
table.ta th{
background-color: #ddd;
	border: 1px solid #666;
	text-align: center;
}
table.ta td{
padding: 0.5em;
	border: 1px solid #666;
}


#chk:checked ~header #humbt span:nth-child(1) {
    top:13px;
    -webkit-transform: rotate(315deg);
    -moz-transform: rotate(315deg);
    transform: rotate(315deg);
}
#chk:checked ~header #humbt span:nth-child(2) {
    width: 0;
    left: 50%;
}
#chk:checked ~header #humbt span:nth-child(3) {
    top:13px;
    -webkit-transform: rotate(-315deg);
    -moz-transform: rotate(-315deg);
    transform: rotate(-315deg);
}

.logo{
	text-decoration: none;
	color: #999;
	font-weight: bold;
}
header .links a img{
	width:auto;
	height: 30px;
	margin-left: 1em;
}


/*　エディッタ　*/
#editor{
	font-size: 15px;
}

.ql-toolbar.ql-snow .ql-hr::after {
  content: '―'; /* ← 見た目は水平線っぽい長めのダッシュ */
  font-size: 20px;
	color: #000;
  display: inline-block;
  transform: translateY(-2px); /* ちょっと上げてセンター合わせる */
}



.logo{
	font-size:20px;
	line-height: 1;
}
/* login */
.login{
	text-align: center;
	padding:20px 0;
}
h2.title{
	font-size: 24px;
	color:#999;
	font-weight: bold;
	margin:0;
}
.read{
	font-size: 14px;
	color:#999;
}


.login_box table{
	border-collapse:collapse;
border-spacing:0;
empty-cells:show;
	margin:20px 0;
}
.login_box table td{
	padding: 0.5em 0;

}
.login_box table td:nth-of-type(1){
	min-width:7em;
    font-size: 14px;
}
.login_box{
    width: 100%;
    min-width: 350px;
    max-width: 350px;
    margin:0 auto;
    padding:15px;
    border: 1px solid #ccc;
    border-radius:10px;
    background-color: #fff;
    box-shadow: 2px 2px 2px #999;
    -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}


/* goal_notes */
.goal_editor.no_main,
.goal_notes.no_main .inner{
    background-color: #f2f2f2;
}


.goal_notes .inner{
	line-height: 2;
	padding: 2em;
	-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.goal_notes .inner > p{
margin: 1em 0; 	
}
.goal_notes .inner #editor{
	min-height: 320px;
}
.goal_notes .inner h2 span{
margin-left: 1em;
font-size: 16px;
}
.goal_notes .inner h2 span a{
font-size: 16px;
margin:0 0.5em;
}
.goal_notes .inner p.fix{
   display: flex;
 justify-content: space-between;
  align-items: center;
  margin: 0;
}
.goal_notes .inner p.fix span{
color: #888;
}


/* メインコンテンツ */
main {
padding:40px 0;
}

.wrap {
background-color: #fff;
	width: 100%;	
	max-width:1000px;
	margin: 0 auto;
	padding:10px 0;
	-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}

header{
    position: fixed;
    width: 100%;
    top:0;
	background-color: #fff;
	z-index: 990;
}
header .wrap{
display: flex;
  justify-content:space-between;
  align-items: center;
	 box-shadow:none;
	border-radius:0;
	position: relative;
    padding:2px 0;
}
header .wrap a.logo{
	display:flex;
	justify-content:flex-start;
	align-items: center;
    font-size:32px;
    font-family: Arial, Helvetica, sans-serif;
}
header .wrap a.logo img{
margin-right: 5px;
}

header nav{
	position: absolute;
	right: 0;
	top:50px;
	display:none;
	background-color: #ddd;
	padding:1em;
	-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
#chk:checked ~header nav{
	display: block;
}

header nav a{
	width: 100%;
	-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
	color: #666;
	text-decoration: none;
}
header nav a:hover{
text-decoration: underline;	
}
header nav ul{
padding: 0;
	list-style: none;
}
header nav li{
	padding:0.5em 0;
}

/* login */
form {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

label {
    display: flex;
    flex-direction: column;
    font-weight: bold;
}

input {
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 5px;
    font-size: 16px;
    -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}

button {
    background-color: #0276FF;
    border: 1px solid #0276FF;
    color: white;
    border: none;
    padding:2px 10px;
    border-radius:10px;
    font-size: 16px;
    cursor: pointer;
    transition: 0.3s;
}
.login_box a{
text-decoration: none;
}

button:hover {
    background-color: #005ecb;
}
button#facebook_btn{
	font-weight: bold;
    display:flex;
	justify-content:flex-start;
	align-items: center;
    margin: auto;
}
button#facebook_btn img{
	margin-right:0.5em;
	width: 35px;
	height: 35px;
}


button#google_btn{
        background-color: #ffffff;
    border: 1px solid #0276FF;
    color: #0276FF;
	font-weight: bold;
    display:flex;
	justify-content:flex-start;
	align-items: center;
    margin: auto;
}
button#google_btn img{
	margin-right:0.5em;
	width: 35px;
	height: 35px;
}
button#google_btn:hover{
    background-color: #ededed;
}

.login_box #login_form button{
	background-color: #999;
	border-radius: 0.25em;
		padding: 0 2em;
}
.login_box #login_form button:hover {
background-color: #777;
}
.login_box #login_form a{
	color:  #999;
}

/* ページトップボタン */
#page-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    cursor: pointer;
	z-index: 99;
}
#page-top img{
width: 30px;
height: 30px;
}

/* フッター */
footer {
    text-align: center;
    background: #FFF;
    color:#666;
    position:relative;
    width: 100%;
	z-index: 0;
    display: block;
}
footer nav{
display: flex;
  justify-content: center;
  align-items: center;
}
footer nav a{
    font-size: 12px;
    margin: 0 3px;
}

.privacy h1.title{
    font-size: 18px;
    background-color: #f2f2f2;
    padding: 2px 5px;
}
.privacy h2{
    font-size: 16px;
    padding: 2px 0;
    border-bottom: 2px solid #ddd;
}

.copy {
    margin-top: 0.5em;
    font-size: 14px;
}
/* 投稿一覧ページ */
.post-list {
    display: flex;
    flex-direction: column;
    gap: 15px;
    margin-top: 20px;
}

/* 投稿カード */
.post-card {
    transition: 0.3s;
	padding:10px;
	margin-bottom: 10px;
	border-radius: 10px;
box-shadow:2px 3px 6px  rgba(0, 0, 0, 0.15);
}
.post-card.posted{
	background-color:#f2f2f2;
	color: #999;
}


/* 投稿タイトル */
.post-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}



.post-title:hover {
    text-decoration: underline;
}

/* 投稿日 */
.post-date {
    font-size: 12px;
    color: #777;
}

/* 投稿本文（抜粋） */
.post-excerpt {
    font-size: 16px;
    color: #555;
}

.post-card.posted .post-excerpt{
	color: #666;
}
.post-excerpt.memo{
	margin: 0.5em 0;
	font-size: 14px;
	color: #888;
}


/* ボタンエリア */
.post-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}

/* ボタンスタイル */
.btn {
    display: inline-block;
    padding:0px 10px;
    border-radius: 5px;
    text-decoration: none;
    font-size: 14px;
    transition: 0.3s;
}

.btn-create {
    background-color: #0276FF;
    color: white;
}



.btn-create:hover {
    background-color: #005ecb;
}

.btn-edit {
    background-color: #ff9800;
    color: white;
}

.btn-edit:hover {
    background-color: #e68900;
}

.btn-delete {
    background-color: #e74c3c;
    color: white;
}

.btn-delete:hover {
    background-color: #c0392b;
}


/* 並び順ボタン */
.sort-buttons {
    display: flex;
    gap: 10px;
    margin-bottom: 15px;
}

.sort-buttons .btn {
    padding:0px 10px;
    border-radius: 5px;
    text-decoration: none;
    font-size: 13px;
    background-color: #ccc;
    color: #333;
    transition: 0.3s;
}

.sort-buttons .btn:hover {
    background-color: #bbb;
}

.sort-buttons .btn-active {
    background-color: #0276FF;
    color: white;
}




/* 投稿詳細ページ */
.post-detail {
    max-width:100%;
}

.post-title {
    font-size: 16px;
    font-weight: bold;
    color: #0276FF;
    text-decoration: none;
}

.post-content {
    font-size:14px;
    line-height: 1.8;
    color: #555;
    text-align: left;
    margin-bottom:20px;
}

.post-meta {
    font-size: 13px;
    color: #777;
    text-align: right;
    margin-bottom:5px;
}

.post-actions {
    display: flex;
    justify-content: space-between;
}
.post-actions a{
	color: #fff;
	text-decoration: none;
}

.btn {
    display: inline-block;
    padding:0px 10px;
    background-color: #0276FF;
    color: white;
    border-radius: 5px;
    text-decoration: none;
    transition: 0.3s;
}

.btn:hover {
    background-color: #005ecb;
}

.btn-edit {
    background-color: #ff9800;
}

.btn-edit:hover {
    background-color: #e68900;
}


/* フォーム全体のコンテナ */
.form-container {
    background: #fff;
    padding:0 10px 10px 10px;
    max-width: 600px;
    margin: 20px auto;
}

/* フォーム内の各ラベル */
.form-container label {
    display: flex;
    flex-direction: column;
    font-weight: bold;
    margin-bottom: 10px;
}

/* 入力欄 */
.form-container input, .form-container textarea {
    width: 100%;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 5px;
    font-size: 16px;
}

/* textarea の調整 */
.form-container textarea {
    height: 150px;
    resize: vertical; /* ユーザーが縦にサイズ変更できる */
}

/* ボタンエリア */
.form-actions {
    display: flex;
    justify-content: space-between;
    margin-top: 15px;
}

/* ボタン */
.btn {
    display: inline-block;
    padding:2px 15px;
    border-radius: 5px;
    text-decoration: none;
    font-size: 13px;
    transition: 0.3s;
    text-align: center;
}

/* 投稿ボタン */
.btn-create {
    background-color: #0276FF;
    color: white;
}

.btn-create:hover {
    background-color: #005ecb;
}

/* 更新ボタン */
.btn-edit {
    background-color: #ff9800;
    color: white;
}

.btn-edit:hover {
    background-color: #e68900;
}

/* 戻るボタン */
.btn-back {
    background-color: #ccc;
    color: #333;
}

.btn-back:hover {
    background-color: #bbb;
}

/* エラーメッセージ */
.error-msg {
    color: red;
    font-weight: bold;
    margin-bottom: 10px;
}

.post-visibility {
    font-size: 14px;
    margin-left: 10px;
    color: #777;
}


.dashboard .upper{
	padding:1em 2em 0 2em;
    background-color: #f2f2f2;
}
.dashboard .upper.main_user{
background-color:#ffffff;
}

.dashboard table.weekly{
	border-collapse:collapse;
border-spacing:0;
empty-cells:show;
margin:0 auto 1em auto;
background-color: #fff;
}
.dashboard table.weekly th,
.dashboard table.weekly td{
padding:2px 0.5em;
	border:1px solid #999;
	text-align: right;
	line-height: 1;
    min-width:4em;
}
.dashboard table.weekly th a{
    text-decoration:underline;
    font-weight: bold;
    color: #333;
}
.dashboard table.weekly th a:hover{
text-decoration: underline;
}

.dashboard table.weekly td.today{
background-color:#fcfcc7;
}
.dashboard table.weekly tr th:nth-of-type(1),
.dashboard table.weekly tr td:nth-of-type(1){
    min-width:inherit;
}
.dashboard table.weekly tr:nth-last-of-type(1) th{
    text-align: right;
}
.dashboard table.weekly td.holiday{
    background-color:#fddcf979;
}
.dashboard table.weekly td.sat{
    background-color:#c6d5ff79;
}

.dashboard table.weekly th{
	padding:0.25em 0.5em;
	background-color: #ddd;
	text-align: center;
    font-weight: normal;
}
.dashboard .upper.middle{
display: flex;
  justify-content: center;
  align-items:flex-start;
    -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.dashboard .upper.main_user .upper.middle{
background-color:#ffffff;
}
.dashboard .upper.middle .halfbox{
margin:0 0.5em;
}
.dashboard .middle{
    padding: 1em 0;
}
.dashboard .middle ul{
		display:flex;
	justify-content:flex-start;
	align-items:stretch;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;	
}
.dashboard table.weekly img{
    width: 36px;
    height: 36px;
}
.dashboard table.weekly.monthly td,
.dashboard table.weekly.monthly th{
padding: 2px 0.5em;
font-size: 11px;
}
.dashboard table.weekly.monthly td{
    font-size: 14px;
}
.dashboard table.weekly.monthly img{
width: 20px;
height: 20px;
}

.dashboard h2.title{
    font-size: 16px;
    margin: 0;
}
.dashboard h2.title img{
width:70px;
height:70px;
margin-right: 0.5em;
}

.dashboard h2.title.main_user{
color: #333;
}

.dashboard p.wchk{
    margin: 0;
    display: flex;
  justify-content: center;
  align-items: center;

}
.dashboard .wchk a{
    font-weight: bold;
    text-decoration: none;
    font-size:15px;
    color:#333;
    display: flex;
  justify-content: center;
  align-items: center;
  width:auto;
height: 15px;
margin: 0 2px;
}
.dashboard .wchk a:hover{
color: #999;
}


/* ページネーション */
.pagination {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 20px;
}

.pagination .btn-page {
    padding:2px 5px;
    border-radius: 5px;
    text-decoration: none;
    font-size: 13px;
    background-color: #ccc;
    color: #333;
    transition: 0.3s;
}

.pagination .btn-page:hover {
    background-color: #bbb;
}

.pagination .btn-active {
    background-color:#5BA6FF;
    color: white;
}


.goal_editor_modal{
    display:none;
    position: fixed;
    z-index: 999;
    left: 0; top: 0;
    width: 100%; height: 100%;
    background-color: rgba(0,0,0,0.6);
  }
.goal_editor_modal-content {
    background-color: #fff;
    margin:10% auto;
    padding:0.5em 1.5em 0 1.5em;
    line-height: 1;
    border-radius: 12px;
    width: 90%;
    max-width:460px;
    position: relative;
}
.goal_editor_modal-content h3{
margin:0.5em 0 0 0;
}
.goal_editor_modal-content ul{  
    -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 0;
}
.goal_editor_modal-content ul li{  
display: flex;
width: 100%;
  justify-content:flex-start;
  align-items:center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      list-style: none;
      line-height: 1.5;
      padding: 0 0 0.5em 0;
  }
  .goal_editor_modal-content ul li select,
  .goal_editor_modal-content ul li input[type="text"],
  .goal_editor_modal-content ul li textarea{
    width: 100%;
    -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 0.5em;
  }
  .goal_editor_modal-content ul li label{
    width: 100%;
  }   
  .goal_editor_modal-content ul li >div{
padding-right: 1em;
  }
  .goal_editor_modal-content ul li >div.btns{
padding:1em 0 0 3em;
  }

.goal_editor_modal .close {
    color: #aaa;
    font-size:20px;
    font-weight: bold;
    cursor: pointer;
    position: absolute;
    top:0.5em;
    right:1em;
}
  .goal_editor_modal .close:hover {
    color: #000;
  }
 .raceList_box{
    padding: 0 1em 1em 1em;
 } 

 .raceList_box h3{
color: #999;
margin: 0;
padding:0 0.5em;
font-size: 15px;
width: 100%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
 }
 .raceList_box #raceList{
	display:flex;
	justify-content:flex-start;
	align-items:stretch;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
 }
 .raceList_box #raceList .entry{
margin: 0.5em;
padding:1em 1% 0.5em 1%;
border: 1px solid #ccc;
line-height: 1.5;
position: relative;
max-width:31%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
background-color: #fff;
box-shadow: 1px 1px 1px #999;
 }
 .raceList_box #raceList .entry p{
font-size: 12px;
margin: 0;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
 }
 .raceList_box #raceList .entry strong{
font-size: 15px;
 }
 .raceList_box #raceList .entry label{
position: absolute;
top: 0;
right: 0.5em;
cursor:pointer;
 }
 .raceList_box p{
    margin: 0;
 }
 .raceList_box button{
    background-color: transparent;
    color:#fff;
    background-color: #005ecb;
    font-size: 12px;
 }

 ul.member_log_list{
    display:flex;
	justify-content:flex-start;
	align-items:stretch;
    -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
list-style: none;
padding: 0 0 0 1%;
margin: 0;
 }
ul.member_log_list li{
    min-width:13%;
    max-width:13%;
    -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
margin:0 1% 1% 0;
padding:2px 5px;
border: 1px solid #ccc;
box-shadow: 1px 1px 0 #999;
 }
 ul.member_log_list li.today{
background-color:#FCFCC7;
 }

 ul.member_log_list li a{
    display: flex;
    justify-content:space-between;
    text-decoration: none;
    color: #333;
    font-size: 13px;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
 }
 .member_log h3{
    color: #999;
    margin: 0;
    padding:0 0.5em;
    font-size: 15px;
    width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
     }
     .member_log .txtR{
        padding-right: 1em;
        margin: 0;
     }
     .member_log .txtR a{
font-size: 13px;
     }

     .goal_notes .inner .review{
        line-height:1.5;
        padding:1em 2em;
        margin: 1em 0;
        background-color: #fff;
        border: 1px solid #ccc;
     }
     .goal_notes .inner .review p{
        margin: 0;
     }

.member_log ul.member_log_list li img{
    width: 24px;
    height: 24px;
}
.member_log ul.member_log_list li p:nth-of-type(1){
    text-align: left;
}

.member_log ul.member_log_list li p{
    width: 100%;
    margin: 0;
    text-align: right;
}
.member_recoad ul.member_log_list li{
    min-width: 19%;
    max-width: 19%;
}

.member_recoad ul.member_log_list li span{
    display: inline-block;
    text-align: right;
    padding-left:3px;
    -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.member_recoad ul.member_log_list li a{
    display:block;
    min-height:6.5em;
    text-decoration: none;
    color: #333;
    font-size: 13px;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
 }


 table.weekly.yote {
    border-collapse:collapse;
  }
.dashboard table.weekly.yote tr td {height:30px;padding: 0;}
.dashboard table.weekly.yote tr:nth-last-of-type(1) th{
text-align: center;
}
.cell {
  padding: 0;
  margin: 0;
  height: 30px;
  vertical-align: top;
}

.cell .dot {
  display: block;
  height:7px;
  width: 100%;
  background: transparent;
  -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
position: relative;
}
table#dashboard-grid th,
table#dashboard-grid td{
min-width:36px;
font-size: 12px;
padding: 0;
}


/* 親要素の position を相対指定しておくと、ツールチップの配置がラク */
#dashboard-grid { position: relative; }


/* ホバー時に data-title の中身を吹き出しとして表示 */
.dot::after {
  content: attr(data-title);
  position: absolute;
  bottom: 100%;      /* dot の上に */
  left: 50%;
  transform: translateX(-50%) translateY(-4px);
  padding: 4px 8px;
  background: rgba(0, 0, 0, 0.75);
  color: #fff;
  font-size: 12px;
  white-space: nowrap;
  border-radius: 4px;
  pointer-events: none;
  display: none;
  z-index: 10;
}
.dot.active::after {
  display: block;
}
/* PCやマウス操作ができるデバイスだけ hover を有効にする */
@media (hover: hover) and (pointer: fine) {
  .dot:hover::after {
    display: block;
  }
}


a.calendar-link {
  display: inline-block;
  padding:0 5px;
  background: #666;
  color: #fff;
  font-weight: normal;
  text-decoration: none;
  border-radius: 4px;
  font-size: 12px;
  transition: background 0.2s;
}

.calendar-link:hover {
  background: #333;
}


.privacy .inner{
    padding: 2em;
    -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}

.signup{
    text-align: center;
}
.signup ol{
width:400px;
text-align: left;
margin:2em auto;
}
.signup ol em{
font-size: 12px;
display: inline-block;
}
.signup .g-btn a,
.signup .f-btn a{
text-decoration: none;
}


.signup table.sign-t{
width:550px;
text-align: left;
margin: auto;
list-style: none;
}
.signup table.sign-t td{
padding:0 0 1em 0;
}
.signup table.sign-t p{
margin: 0;
padding: 0;
}
.signup table.sign-t input[type=url],
.signup table.sign-t input[type=email],
.signup table.sign-t input[type=password],
.signup table.sign-t input[type=text],
.signup table.sign-t select{
    padding: 0.5em;
    width: 100%;
    -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.signup textarea{
    width: 100%;
    -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
line-height: 1.5;
}
.signup table.sign-t select,.signup table.sign-t option{
    color: #000;
    background-color: #f2f2f2;
    border: 1px solid #333;
        -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
	font-size:16px;
    width: 100%;
    -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
	}


.signup table.sign-t label{
    	display:inline-block;
	justify-content:flex-start;
	align-items: center;	
flex-direction: initial;
}
em{
    font-size: 12px;
}
#imgpreview,
#previewCanvas {
    border-radius:50%;
    width:180px;
    height:180px;
    object-fit:cover;
object-position: 100% 100%;
    border: 1px solid #ccc;
}
p.short{
    font-size: 13px;
}

/* 小さいアイコン */
.profile-thumb {
  width: 40px;
  height: 40px;
  object-fit: cover;
  border-radius: 50%;
  cursor: pointer;
}

/* モーダルのベース */
#imgModal {
  display: none;
  position: fixed;
  z-index: 9999;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0,0,0,0.75);
  justify-content: center;
  align-items: center;
}

#imgModal img {
  max-width:550px;
  max-height:550px;
  border-radius: 10px;
  box-shadow: 0 0 10px #000;
  background: #fff;
}

.forgot_password .inner{
    max-width: 550px;
    margin: 0 auto;
    line-height: 2;
    padding: 2em;
    -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}


#profileModal{
    display:none;
    position:fixed;
    top:20%;
    left:50%;
    transform:translateX(-50%);
background:#fff;
padding:10px;
border:1px solid #ccc;
border-radius:8px;
z-index:1000;
width:300px;
}
#profileModal p{
margin: 0;
}
#profileModal p.txtR a{
font-size: 12px;
}

.dashboard ul.goal_navi{
display: flex;
  justify-content: center;
  align-items: center;
    -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      list-style: none;
      padding: 0;
}
.dashboard ul.goal_navi li{
padding:2px;
}
.top.title{
    display: flex;
  justify-content: center;
  align-items: center;
    -ms-flex-wrap: wrap;
      flex-wrap: wrap;
padding:0;
}
.top.title span{
padding:0.25em;
}

.dashboard .member_log{
    width: 100%;
    -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
max-height:9em;
overflow-y: auto;
}
.race_all_box{
    padding: 1em;
}
.race_all{
    	display:flex;
	justify-content:flex-start;
	align-items:stretch;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.race_all .entry{
padding: 1em;
display: inline-block;
border: 1px solid #666;
box-shadow: 1px 1px 1px #999;
margin: 0.5em;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.race_all .entry h3,
.race_all .entry p{
    font-size: 16px;
margin: 0;
padding: 0;
}
.race_all .entry .small{
    font-size: 13px;
}

.inner.api{
    text-align: center;
    padding: 2em;
    -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
max-width:770px;
margin: 0 auto;
}
.inner.api ol{
max-width: 70%;
text-align: left;
margin: 1em auto;
}
.inner.api h2{
    background-color: #FF4900;
    color: #fff;
}
.inner.api h3{
color: #FF4900;
padding: 0.25em 0;
border-bottom: 1px solid #FF4900;
}
.inner.api .small{
    font-size: 12px;
    font-weight: bold;
    color: #FF4900;
}
.inner.api .btn {
  display: inline-block;
  background-color:#FF4900;
  color: white;
  padding: 10px 20px;
  border-radius: 5px;
  text-decoration: none;
  font-weight: bold;
}
.inner.api.garmin h2{
background-color: #007CC2;
}
.inner.api.garmin h3{
color: #007CC2;
border-bottom: 1px solid #007CC2;
}
.inner.api.garmin .small{
    color:#007CC2;
}
.inner.api.garmin .btn {
background-color: #007CC2;
  color: white;
}


.dashboard h3{
padding-left: 1em;
}
.dashboard ul p{
    margin: 0;
}
.dashboard ul time{
    font-size: 12px;
    color: #999;
    margin-right: 1em;
    display: inline-block;
}

/*---------------------------------------------*
* width 1000px
*----------------------------------------------*/
@media screen and (max-width:1000px) {
    .wrap{
        max-width:98%;
        width: 98%;
    padding:5px 0;
    }
}
/* width 1000px end --------------------------------------------*/

/*---------------------------------------------*
* width 768px
*----------------------------------------------*/
@media screen and (max-width:768px) {

.dashboard .upper{
    padding:10px 0;
    background-color: #f2f2f2;
}

    .dashboard table.weekly th,
        .dashboard table.weekly td{
    padding:1px 2px;
}
.sc{
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    padding: 1em 0;
    -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
position: relative;
}



.member_recoad ul.member_log_list li {
    min-width:32%;
    max-width:32%;
}

}
/* width 768px end --------------------------------------------*/

/*---------------------------------------------*
* width 640px
*----------------------------------------------*/
@media screen and (max-width:640px) {
    .sc.alert:before{
        content: "スクロール＞＞";
        font-weight: bold;
        font-size: 10px;
        color: #888;
        position: absolute;
        top:0;
        right: 1em;
        animation-name:alert;
    animation-duration:1.25s;
    animation-fill-mode:forwards;
    animation-timing-function:ease-out;
    animation-iteration-count:infinite;
    }
.dashboard table.weekly th, .dashboard table.weekly td
 {
    min-width:3em;
}
.dashboard ul.goal_navi li a,
.dashboard ul.goal_navi li{
font-size: 13px;
}
ul.member_log_list li{
    min-width:32%;
    max-width:32%;
}

.dashboard .upper.middle .halfbox {
    margin: 0;
    width: 100%;
    -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}

.goal_notes .inner {
    line-height: 2;
    padding:0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.goal_notes input{
    padding:3px;
    border: 1px solid #ccc;
    border-radius:3px;
    font-size: 16px;
}
#editor .ProseMirror, #editor .ProseMirror.toastui-editor-contents{
    padding:10px;
    line-height: 2;
}
.goal_notes .inner > p a{
display: inline-block;
}
.goal_notes .inner .toastui-editor-contents h2 {
    font-size:18px;
    line-height:1.5;
}
.goal_notes h2.race_title a {
display: inline-block;
}
.goal_editor_modal-content {
    padding: 0.5em 0.5em 0 0.5em;
    -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;

}
.signup table.sign-t,
.signup table.sign-t tbody{
    display: block;
    width:320px;
    max-width:320px;
    padding: 0;
    margin: 0 auto;
    -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.signup table.sign-t tr,
.signup table.sign-t td {
width:100%;
display:block;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.signup table.sign-t td:nth-of-type(1) {
padding:0;
}
.signup table.sign-t td select,
.signup table.sign-t td input{
    max-width:100%;
}

.login_box table td {
width: 100%;
display: block;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}

.login_box table td input{
width: 100%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.signup ol {
    width:100%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.signup ol em{
display: inline-block;
}

.member_recoad ul.member_log_list li {
    min-width:48%;
    max-width:48%;
}

#imgModal img {
    max-width:90%;
    max-height:90%;
    border-radius: 10px;
    box-shadow: 0 0 10px #000;
    background: #fff;
}

 .raceList_box #raceList .entry{
max-width:45%;
 }
 .race_all .entry{
width: 100%;
 }

.login_box{
    min-width: 320px;
    padding:10px;
}

}
/* width 640px end --------------------------------------------*/



@keyframes alert{
0% {
opacity: 1;
}
 50% {
opacity: 0;
}
75% {
opacity: 0.5;
}
100% {
opacity:1;
}
}


/*---------------------------------------------*
* width 480px
*----------------------------------------------*/
@media screen and (max-width:480px) {
}
/* width 480px end --------------------------------------------*/

/*---------------------------------------------*
* width 375px
*----------------------------------------------*/
@media screen and (max-width:375px) {
}