/*
*/
html {
-ms-touch-action: manipulation;
touch-action: manipulation;
}
/* 画面全体 */
body {
/* font-family: arial;*/
font-size: 14px;
word-break:break-all;
/* width: 770px;*/
margin: auto;
line-height: 18px;
background-image: url("./img/back1.jpg"); /* 背景画像 */
background-size: cover;/*画面いっぱいに表示*/
background-attachment: fixed;/*スクロールしても固定*/
background-repeat: no-repeat;/*画像を繰り返さない*/
background-position: 50% 50%; /* 画像中央を起点に表示 */
/* background-color: #000000; /* 背景色 */
}
nav{
width:100%;
}
.small{
font-size: 0.8em;
}
@media (min-width: 770px) {/* 770px以上*/
body{
width: 770px;
/* background-image: url("./img/back1.jpg"); 背景画像 */
}
#header{
width: 770px;
}
#welcomeMessage{
width: 500px;
}
.menu li {
width:calc(90% / 6);/* 15%; /* グローバルナビ6つの場合 */
position: relative;
float: left;
margin:0 1px;
}
.menu li:hover > ul {
display: block;
}
#month-menu li{
float: left;
}
#courseResultsTable{/*コース別成績テーブル*/
width: 50%;
}
}
@media (max-width: 769px) {/* 769px以下*/
body{
width: 100%;
font-size: 90%;
/* background-image: url("./img/back_tate1.png"); 背景画像 */
}
#header{
width: 100%;
}
#modal-content,#modal-content2{
box-sizing: content-box;
width: 95%;
}
#schedule{
width:95%;
}
#welcomeMessage{
width: 90%;
}
.menu{
padding-left:0;
}
.menu li{
width: 100%;/*これがないと横並びになる*/
}
.menu > li {
/* font-size: 80%;*/
height: 40px !important;;
line-height:40px !important;
}
.menu > li a {
font-size: 1.1em;
width: 110px;/*100px;*/
z-index: 2;
}
.menu li a {
display: block;
padding: 0px;
}
.menu li:hover > ul {
display: block;
padding-left:0;
}
.menu ul {
/* display: none;*/
position: absolute;
top: 0;
left: 125px;/*90px;*/
width: 100%;
}
ul.ddmenu li {
/* width: 100%; /* メニュー項目の横幅(125px) */
font-size: 90%;
}
#month-menu{
padding-left:0;
}
#month-menu li{
width: 100%;/*これがないと横並びになる*/
}
#month-menu > li {
/* font-size: 80%;*/
height: 40px !important;;
line-height:40px !important;
width: 100px !important;
}
#month-menu > li a {
width: 100px;
z-index: 2;
}
#month-menu li a {
display: block;
padding: 0px;
}
#month-menu li:hover > ul {
display: block;
padding-left:0;
}
#month-menu ul {
/* display: none;*/
position: absolute;
top: 0;
left: 165px;
width: 100%;
}
#year-menu{
position: absolute;
top: 50px;
right: 3px;
}
/* .myButton{
z-index:110;
}*/
.bbsTable,.photoGalleryTable{
line-height:1.3em;
}
.bbsHeader,.photoGalleryHeader{
width: 100%;
}
.bbsHeader td,.photoGalleryHeade div{
display: block;
border-bottom: none;
}
.bbsWriting,.photoGalleryWriting,#applyMembership{
width: 100%;
}
.bbsWriting td,.photoGalleryWriting td{
display: block;
/*width: 100%;*/
border-bottom: none;
}
.bbsWritingMessage,.pgWritingMessage{
padding: 0 10px;
}
.bbsWriter,.pgWriter{/*投稿者の文字を目立つように*/
color: #0000ff;
font-size: 1.1em;
font-weight: 900;
}
.officerBbsTable{
line-height:1.3em;
}
.officerBbsHeader{
width: 100%;
}
.officerBbsHeader td{
display: block;
border-bottom: none;
}
.massageList{
width: 100%;
}
.messageList td{
display: block;
/* width: 100%;*/
border-bottom: none;
}
#messageTable .messageBody{
padding: 0 10px;
}
#messageTable .memberHN{
color: blue;
font-weight:900;
}
#roundDetailTable #registDate,#roundDetailTable #updateDate{
word-break:keep-all;
}
.photoGalleryHeader td{
display: block;
border-bottom: none;
}
#applyMembershipTable th,#applyMembershipTable td{
display: block;
text-align: left;
}
#roundListTable>tbody{
display: block;
height: 520px;
overflow-y: scroll;
}
#courseResultsTable{/*コース別成績テーブル*/
width: 100%;
}
}
#header{
padding-top: 10px;
/* width: 770px;*/
/* line-height: 30px;*/
position: fixed;
/* text-align:center;*/
/* background-image: url("./img/back1.jpg"); /* 背景画像 */
/* background-size: cover;/*画面いっぱいに表示*/
/* background-attachment: fixed;/*スクロールしても固定*/
background: rgba(255,255,255,0.0);/*背景を透過させる*/
z-index:9;/*手前に表示させる*/
}
#logo{
font-size: 20px;
text-align:left;
/* width:50%;*/
font-family:serif;
font-weight: bold;
/* font-size:300%;*/
color:rgba(255,255,255,0.7);
text-align:center;
/* padding: 40px 0;*/
-webkit-text-stroke: 1px #FFF;
cursor: pointer;
}
#user{
margin-bottom:10px;
}
#name{
text-shadow: 1px 1px 0 rgba(0,0,0,.2);
float:right;
color:Blue;
font-size:80%;
}
#logout{
float:right;
font-size:80%;
}
#main-content{
width:100%;
padding-top: 110px;
}
caption{
font-size:120%;
font-weight:900;
}
h2{
margin:0 auto;
width:200px;
text-align:center;
background: linear-gradient(transparent 60%, #FAE438 60%);
}
#tax{
color: #ffffff;/*文字色*/
/* border: solid 3px #0000c4;/*線色*/
border-radius: 0.5em;/*角丸*/
background: #0000c4;
font-weight:bold;
margin: 0 5px; /* ラベル外側の余白を指定する */
padding: 0 5px; /* ラベル内側の余白を指定する 左右5px*/
word-break: keep-all;
}
#lunch{
color: #ffffff;/*文字色*/
/* border: solid 3px #c40000;/*線色*/
border-radius: 0.5em;/*角丸*/
background: #c40000;
font-weight:bold;
word-break: keep-all;
padding: 0 5px; /* ラベル内側の余白を指定する 左右5px*/
}
#price,#time{/*蛍光マーカー*/
background: linear-gradient(transparent 70%, #ffff66 70%);
}
/* モーダル画面 */
#modal-content,#modal-content2{
box-sizing: border-box;
display:none;
width: 770px;
/* z-index:2;/*手前に表示させる*/
/* position:fixed;/*ページをスクロールしても、ずっと画面上のその位置に止まり続ける*/
padding:5px;
}
#applyMembership{
width: 100%;
}
#topic{/*トピック*/
width: 90%;
margin:auto;
border-collapse: separate;
border-spacing: 0;
text-align:center;
}
#topicHeader{/*トピックヘッダ*/
display:inline-box;
margin:auto;
width: 100%;
}
#topicText{/*トピック記事*/
width: 100%;
margin:20px auto;
border: 4px white solid;
border-radius: 6px;
background: rgba(255,255,255,0.9);/*背景を透過させる*/
}
#topicTitle{/*トピックタイトル*/
margin:20px auto;
font-size: 120%;
color:blue;
}
#topicMessage{/*トピック内容*/
margin:20px auto;
}
#topicMessage p{/*トピック内容の強調*/
font-weight:900;
font-size:2em;
color:white;
background-color: red;
line-height:2em;
margin:0;
}
.previewTopicPhoto {/*トピック写真プレビュー*/
/* margin: 10px;*/
display: inline-block;
width:100px;
}
#movieTitle{/*動画タイトル*/
margin:20px auto;
font-size: 120%;
color:blue;
}
#topicMovie{/*トピック動画*/
margin:20px auto;
width: 100%;
}
#regulations button{/**/
margin-top:10px;
width: 50%;
}
iframe{
width: 100%;
border: 4px white solid;
border-radius: 6px;
}
#schedule{
margin:30px auto;
width:100%;
text-align: center;
}
#scheduleImg{
width:90%;
}
/****************************************/
/*BBS画面
/****************************************/
#bbsRegistTable{
width: 100%;
}
#bbsRegistTable #bbsMessage{
width: 100%;
}
.bbsTable{/*BBSテーブル*/
margin:20px auto;
width: 100%;
/* table-layout: fixed;*/
background: rgba(255,255,255,0.9);/*背景を透過させる*/
border: 4px #0000FF solid;
border-collapse: separate;
border-spacing: 0;
border-radius: 6px;
}
.bbsHeader td{/*BBSヘッダ*/
padding:5px;
/* border-bottom: 2px #0000FF solid;*/
/* background: rgba(200,200,255,0.9);/*背景色を変える*/
background: rgba(30,144,255,0.9);/*背景を透過させる*/
color:white;
cursor: pointer;
}
.bbsBody td{/*BBS記事*/
padding:10px;
}
.bbsPhoto td{/*BBS写真*/
padding:10px;
border-top: 2px #0000FF solid;
}
.bbsPhotoFile {/*BBS写真*/
position: relative;/*相対配置 下記absoluteとセット*/
margin: 10px;
display: inline-block;
width:200px;
}
.bbsPhotoFile p{/*投稿者HNを写真左下に重ねて表示*/
position: absolute;/*絶対配置*/
right: 0;
margin:0;
}
.bbsWriting td{/*BBS書き込み*/
vertical-align: top;
}
.bbsWriting:nth-child(even){/*BBS書き込み色分け*/
/* background: #EEEEEE;*/
background: ivory;
}
.bbsWriting:nth-child(odd){/*BBS書き込み色分け*/
/* background: #FFEEFF;*/
background: lightcyan;
}
.bbsWriting:nth-last-child(1){/*BBS書き込み色分け*/
background: white;
}
/****************************************/
/*役員会議室画面
/****************************************/
.officer{
color:red;
}
.officerBbsTable{/*役員BBSテーブル*/
margin:20px auto;
width: 100%;
background: rgba(255,255,255,0.9);/*背景を透過させる*/
border: 4px #ff8080 solid;
border-collapse: separate;
border-spacing: 0;
border-radius: 6px;
}
.officerBbsHeader td{/*役員BBSヘッダ*/
padding:5px;
background: rgba(255,200,200,0.9);/*背景色を変える*/
cursor: pointer;
}
.officerBbsTable .bbsPhoto td{/*BBS写真*/
border-top: 2px #FF8080 solid;
}
/****************************************/
/*カレンダー画面
/****************************************/
#calendar,#roundCalendar {/*カレンダー*/
/* width: 100%;*/
background-color: white;
margin: auto;
padding:20px;
border-radius: 6px;
}
.fc-sun { color: red; } /* 日曜日 */
.fc-sat { color: blue; } /* 土曜日 */
.fc-today { background: gold!important; } /* 今日 */
.fc-past { background: whitesmoke!important; } /* 過日 */
.fc-content{ text-align: center;}
.fc-event{cursor: pointer;}
.event_holiday{cursor: unset !important;}
.entry{
animation:rotate 2.0s ease-in-out infinite alternate;
}
.update{
animation:blink 0.6s ease-in-out infinite alternate;
}
@keyframes blink{
0% {opacity:0.1;}
100% {opacity:1;transform: scale(1.5, 1.5);}
}
@keyframes rotate {
0% { transform: rotateY(0deg); }
100% { transform: rotateY(360deg); }
}
/****************************************/
/*ラウンドリストテーブル
/****************************************/
#roundListTable{
width: 100%;
background: rgba(255,255,255,0.9);/*背景を透過させる*/
border-collapse: separate;
border-spacing: 0;
border-radius: 6px;
border: 4px #0000FF solid;
}
.master:hover,.privateStatsYear:hover{/*hover*/
background: rgba(200,200,255,0.8)!important;/*背景色を変える*/
}
.master{
cursor: pointer;
background-color:white;
}
#roundListHeader{/*ラウンドリストヘッダー*/
/* background: rgba(200,255,200,0.9);/*背景を透過させる*/
background: rgba(30,144,255,0.9);/*背景を透過させる*/
color:white;
border: 2px #0000FF solid;
}
#privateRoundListHeader,#courseResultsHeader{/*個人ラウンドリストヘッダー*/
/* background: rgba(200,255,200,0.9);/*背景を透過させる*/
background: rgba(30,144,255,0.9);/*背景を透過させる*/
color:white;
border: 2px #0000FF solid;}
#memberListHeader{/*会員リストヘッダー*/
/* background: rgba(200,255,200,0.9);/*背景を透過させる*/
background: rgba(30,144,255,0.9);/*背景を透過させる*/
color:white;
border: 2px #0000FF solid;
}
#roundListTable th,#roundListTable td{/*ラウンドリストテーブル*/
border-collapse: collapse;
border: 1px #0000FF solid;
word-break: break-all;
}
#roundDetailTable{/*ラウンド詳細テーブル*/
width: 100%;
border-collapse: collapse;
background-color: #FFFFFF; /* 背景色 */
border: 5px #0000FF solid;
}
#roundDetail th,#roundDetail td{/*ラウンド詳細テーブル*//*カレンダー表示形式で追加*/
border-collapse: collapse;
border: 1px #0000FF solid;
// word-break: break-all;
}
#roundDetailHeader td{/*ラウンド詳細テーブル*//*カレンダー表示形式で追加*/
font-weight: bold;
border: 0px none;
background-color: azure; /* 背景色 */
}
#roundDetailTable #announce{/*ラウンド詳細テーブルの案内文*/
padding:8px;
}
#resultTable{/*ラウンド結果テーブル*/
width: 100%;
border-collapse: collapse;
background-color: #d8eef4;
}
#combiTable{/*組合せテーブル*/
width: 100%;
border-collapse: collapse;
background-color: #d4f2e8;
}
.kumi{/*組合せの組名をセンタリングするため*/
display: inline-flex;
}
#entryTable{/*エントリーテーブル*/
width: 100%;
border-collapse: collapse;
}
#entryTable .waiting{
background-color: lightyellow; /* 背景色 */
}
#inviteEntryTable{/*代理エントリーテーブル*/
width: 100%;
border-collapse: collapse;
}
#messageTable{/*メッセージテーブル*/
width: 100%;
line-height: 14px;
border-collapse: collapse;
}
#messageTable td{/*メッセージテーブルのtd要素*/
border-style:none;
vertical-align:top;
}
#roundRegistTable{/*企画登録テーブル*/
width: 100%;
}
#roundRegistTable td{/*企画登録テーブルのtd要素*/
border-style:none;
}
#roundRegistTable input{/*企画登録テーブルのinput要素*/
text-align: center;
}
#scoreTable {/*スコア登録テーブル*/
width: 100%;
border-collapse: collapse;
}
#scoreTable input{/*スコア登録テーブルのinput要素*/
border-style:none;
}
#groupTable th,#groupTable td{/*組合せ作成テーブル*/
border-collapse: collapse;
border: 1px #0000FF solid;
}
#privateRoundTable{/*個人ラウンドリストテーブル*/
width: 100%;
background: rgba(255,255,255,0.9);/*背景を透過させる*/
border-collapse: separate;
border-spacing: 0;
border-radius: 6px;
border: 4px #0000FF solid;
}
#privateRoundTable th,#privateRoundTable td{/*個人ラウンドリストテーブル*/
border-collapse: collapse;
border: 1px #0000FF solid;
}
#privateEntryTable {/*個人ラウンド参加登録テーブル*/
border-collapse: collapse;
}
.privateEntryHeader{/*個人ラウンド参加登録テーブル*/
}
#privateEntryTable input{/*個人ラウンド参加登録テーブルのinput要素*/
/* border-style:none;*/
text-align: center;
/* height:22px;*/
}
#courseResultsTable{/*コース別成績テーブル*/
/*width: 50%;*/
background: rgba(255,255,255,0.9);/*背景を透過させる*/
border-collapse: separate;
border-spacing: 0;
border-radius: 6px;
border: 4px #0000FF solid;
margin:auto;
margin-top: 10px;
}
.courseResultsList{
cursor: pointer;
}
.courseResultsDetail{
background-color:aliceblue;
}
#privateStatsMainTable{/*個人記録テーブル*/
width: 100%;
background: rgba(255,255,255,0.9);/*背景を透過させる*/
border-collapse: separate;
border-spacing: 0;
border-radius: 6px;
border: 4px #0000FF solid;
}
th#privateStatsTable:not(.privateStatsMonthTable) ,#privateStatsTable td{/*個人ラウンドリストテーブル*/
border-collapse: collapse;
border: 1px #0000FF solid;
}
.privateStatsYear{/*個人記録テーブルの年度*/
/* background: rgba(200,255,200,0.9);/*背景を透過させる*/
background: rgba(30,144,255,0.9);/*背景を透過させる*/
color:white;
line-height: 22px;
cursor: pointer;
}
#privateStatsListHeader{
background: rgb(255,255,255);/*背景を白*/
}
#privateStatsListHeader th{
border: 1px #0000FF solid;
}
#privateStatsTable{/*個人記録年度詳細テーブル*/
width: 100%;
border-collapse: collapse;
}
.privateStatsMonthTable{/*個人記録月次集計行*/
width: 100%;
background: rgb(255,255,255);/*背景を白*/
border-collapse: collapse;
}
th.privateStatsMonthTable{/*個人記録月次集計行*/
border-style:none;
}
#memberListTable{/*会員リストテーブル*/
width: 100%;
background: rgba(255,255,255,0.9);/*背景を透過させる*/
border-collapse: separate;
border-spacing: 0;
border-radius: 6px;
border: 4px #0000FF solid;
}
#memberListTable th,#memberListTable td{/*会員リストテーブル*/
border-collapse: collapse;
border: 1px #0000FF solid;
padding:0px 5px;
}
.areaList{
/* background: rgba(200,255,200,0.9);/*背景を透過させる*/
background: rgba(30,144,255,0.9);/*背景を透過させる*/
color:white;
cursor: pointer;
}
#rankingTable{/*ランキングテーブル*/
margin: 0 auto;
width: 100%;
background: rgba(255,255,255,0.9);/*背景を透過させる*/
border-collapse: separate;
border-spacing: 0;
border-radius: 6px;
border: 4px #0000FF solid;
}
/*#rankingTable th,#rankingTable td{/*ランキングテーブル*/
.rankingList td,.rankingList td{
border-collapse: collapse;
border: 1px #0000FF solid;
padding:0px 5px;
}
.rankingHeader th,.rankingHeader2 th{
/* background: rgba(200,255,200,0.9);/*背景を透過させる*/
background: rgba(30,144,255,0.9);/*背景を透過させる*/
color:white;
border: 1px #0000FF solid;
}
.rankingHeader2 th,th.border2{/*本体との境界の線を少し太く*/
border-bottom: 2px #0000FF solid;
}
.ui-widget {
font-size: 1em;
}
.ui-dialog .ui-dialog-buttonpane {
padding: 0px;
margin-top: 0em;
}
.ui-dialog .ui-dialog-buttonpane button {
margin: 0em;
}
.ui-dialog .ui-dialog-title{
text-align:center;
}
/* 入力補完リストの背景色 */
.ui-autocomplete {
background: silver!important;
}
/* 入力補完リスト hover 時の色 */
.ui-state-active {
background: lightblue!important;
}
.rDate,.rOwner,.rNum,.rStatus,.rUpdate{/*ラウンドリストテーブル*/
text-align:center;
}
.rank,.fscore,.bscore,.hdcp,.gross,.net{/*ラウンド結果テーブル*/
text-align:center;
width: 60px;
}
#ranking{/*スコア順位並べ替え*/
cursor: pointer;
}
/* ---------------------*/
/* ▼ラウンドメニューバーの装飾 */ /*https://allabout.co.jp/gm/gc/23911*/
/* ---------------------*/
td ul{
margin: 0; /* メニューバー外側の余白(ゼロ) */
padding: 0px; /* メニューバー内側の余白(左に15px) */
}
ul.ddmenu {
margin: 0; /* メニューバー外側の余白(ゼロ) */
padding: 0px; /* メニューバー内側の余白(左に15px) */
background-color: #cccc00; /* バーの背景色(金色) */
}
/* ▼ラウンド詳細内メニューの装飾 */
ul.ddmenu li {
width: 100%; /* メニュー項目の横幅(125px) */
display: inline-block; /* ★横並びに配置する */
list-style-type: none; /* ★リストの先頭記号を消す */
position: relative; /* ★サブメニュー表示の基準位置にする */
cursor: pointer;
}
ul.ddmenu a {
background-color: #cc0000; /* メニュー項目の背景色(濃い赤色) */
color: white; /* メニュー項目の文字色(白色) */
line-height: 23px; /* メニュー項目のリンクの高さ(40px) */
text-align: center; /* メインメニューの文字列の配置(中央寄せ) */
text-decoration: none; /* メニュー項目の装飾(下線を消す) */
font-weight: bold; /* 太字にする */
display: block; /* ★項目内全域をリンク可能にする */
}
ul.ddmenu a:hover {
background-color: #ffdddd; /* メニュー項目にマウスが載ったときの背景色(淡いピンク) */
color: #dd0000; /* メニュー項目にマウスが載ったときの文字色(濃い赤色) */
}
/* ▼サブメニューの装飾 */
ul.ddmenu ul {
margin: 0px; /* ★サブメニュー外側の余白(ゼロ) */
padding: 0px; /* ★サブメニュー内側の余白(ゼロ) */
display: none; /* ★標準では非表示にする */
position: absolute; /* ★絶対配置にする */
}
/* ▼サブメニューがある場合に開く処理 */ /* ※サブメニューが2階層以上ある場合の記述 */
ul.ddmenu li:hover > ul {
display: block; /* ★マウスポインタが載っている項目の内部にあるリストを表示する */
}
/* ▼サブメニュー(以降の)項目の装飾 */
ul.ddmenu ul li {
width: 100%; /* サブメニュー1項目の横幅(135px) */
border-top: 1px solid pink; /* 項目上側の枠線(ピンク色で1pxの実線) */
z-index:10;
}
ul.ddmenu ul li a {
line-height: 23px; /* サブメニュー1項目の高さ(35px) */
text-align: left; /* 文字列の配置(左寄せ) */
padding-left: 5px; /* 文字列前方の余白(5px) */
font-weight: normal; /* 太字にはしない */
}
ul.ddmenu ul li a:hover {
background-color: #ffff80; /* サブメニュー項目にマウスが載ったときの背景色(淡い黄色) */
color: #005500; /* サブメニュー項目にマウスが載ったときの文字色(濃い緑色) */
}
/* ▼3階層目以降(孫メニュー以降)の装飾 */ /* ※下ではなく横(右)に表示します。 */
ul.ddmenu ul ul {
margin: 0px; /* ★サブメニュー外側の余白(ゼロ) */
padding: 0px; /* ★サブメニュー内側の余白(ゼロ) */
display: none; /* ★標準では非表示にする */
position: absolute; /* ★絶対配置にする */
top: -1px; /* 1pxだけ上方向にずらす(※上に1pxの枠線を引いている場合) */
left: -100%; /* ★基準位置からの距離を親ボックスの幅100％にする */
width:100%; /*親要素と同じ幅*/
border-left: 1px solid pink; /* 左側に引く枠線(ピンク色で1pxの実線) */
}
/*組合せ作成ソータブルテーブル*/
#groupTable {
border-collapse: collapse;
cursor: ns-resize;
width: 100%
}
.sortable {
border: 1px solid #eee;
min-height: 20px;
list-style-type: none;
margin: 0;
padding: 5px 0 0 0;
margin-right: 10px;
}
.sortable td {
cursor: move;
}
/*日本語入力制御*/
.imeOn{
ime-mode: active;
}
.imeOff{
ime-mode: inactive;
}
.imeDisabled{
ime-mode: disabled;
}
textarea{
ime-mode: active;
}
.delMessageBtn,.delBbsMessageBtn{
padding:5;
/* border: 0px;*/
cursor: pointer;
border-radius: 0.5em;
}
.writingBtn{
padding:5;
border: 1px;
color: #f00;
cursor: pointer;
}
.menu {
position: relative;
width: 100%;
padding:0 auto;
margin: 0 auto;
z-index:10;/*手前に表示させる*/
}
.menu > li {
list-style-type: none; /* ★リストの先頭記号を消す */
float: left;
height: 27px;
line-height:20px;
text-align: center;
cursor: pointer;
margin:0 1px;
}
.menu > li a {
/*ボタンの見栄えに https://saruwakakun.com/html-css/reference/buttons*/
position: relative;
display: block;/*inline-block;*/
padding: 0.25em 0.5em;
text-decoration: none;/* メニュー項目の装飾(下線を消す) */
color: #FFF;
background: #fd9535;/*背景色*/
border-bottom: solid 2px #d27d00;/*少し濃い目の色に*/
border-radius: 4px;/*角の丸み*/
box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), 0 2px 2px rgba(0, 0, 0, 0.19);
font-weight: bold;
}
.menu > li a:hover {
color: red;
font-size: 110%;
}
ul.menu__second-level {
visibility: hidden;
opacity: 0;
}
ul.menu__third-level {
visibility: hidden;
opacity: 0;
}
.menu > li:hover {
/* -webkit-transition: all .5s;
transition: all .5s;*/
}
.menu__second-level li {
width: 100%;
list-style-type: none; /* ★リストの先頭記号を消す */
z-index:10;/*手前に表示させる*/
}
.menu__third-level li {
border-top: 1px solid #111;
}
.menu__second-level > li a:hover {
/* text-decoration: none;*/
}
.menu__third-level li a:hover {
/* background: #2a1f1f;*/
}
/* 下矢印 */
.init-bottom:after {
content: '';
display: inline-block;
width: 6px;
height: 6px;
margin: 0 0 0 15px;
border-right: 1px solid #fff;
border-bottom: 1px solid #fff;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}
/* floatクリア */
.menu:before,
.menu:after {
content: " ";
display: table;
}
.menu:after {
clear: both;
}
.menu > li.menu__single {
position: relative;
}
li.menu__single ul.menu__second-level {
width: 100%;
/* background: #072A24;*/
-webkit-transition: all .2s ease;
transition: all .2s ease;
}
li.menu__single:hover ul.menu__second-level {
top: 10px;
visibility: visible;
opacity: 1;
}
/*ハンバーガーメニュー関連*/
#toggle,#toggle2{
display: none;
z-index:15;/*手前に表示させる*/
}
@media only screen and (max-width: 769px) {
/*メニュー表示切替*/
#toggle,#toggle2{
display: inline-block;
position: relative;
width: 40px;
height:30px;
background: darkorange;
}
#toggle a,#toggle2 a{
display: block;
/* position: relative;*/
/* padding: 1px 0 5px;*/
color: #fff;
text-align: center;
text-decoration: none;
padding-left:20px;
}
/*ハンバーガーメニューアイコン*/
#toggle:before,#toggle2:before{
display: block;
content: "";
position: absolute;
top: 50%;
left: 10px;
width: 20px;
height: 20px;
margin-top: -10px;
background: white;
}
#toggle a:before, #toggle a:after,#toggle2 a:before, #toggle2 a:after{
display: block;
content: "";
position: absolute;
top: 50%;
left: 10px;
width: 20px;
height: 4px;
background: darkorange;
}
#toggle a:before,#toggle2 a:before{
margin-top: -6px;
}
#toggle a:after,#toggle2 a:after{
margin-top: 2px;
}
#toggle2,#toggle2 a:before, #toggle2 a:after{
background: black;
}
}
/*会員情報登録内ボタン*/
#registMenu ul{
margin: 0.25em 0em;
}
#registMenu ul li {
list-style-type: none; /* ★リストの先頭記号を消す */
text-decoration: none; /* メニュー項目の装飾(下線を消す) */
display: inline-block;
float: left;
width: 90px;
text-align: center;
cursor: pointer;
}
#registMenu ul li a{
padding: 0.25em 0.3em;
background: #fd9535;/*背景色*/
border-radius:6px;
}
/************************/
/*募集ラウンドの年月選択メニュー*/
/************************/
#month-menu {
position: relative;
width: 80%;
/* height: 18px;*/
line-height: 20px;
margin: 10 auto;
}
#month-menu > li{
list-style-type: none; /* ★リストの先頭記号を消す */
text-decoration: none; /* メニュー項目の装飾(下線を消す) */
text-align: center;
/* float: left;*/
width: 75px;
padding: 3px;
background-color: #000000; /* 背景色(黒色) */
color: #FFFFFF;/* 文字色(白色) */
border-radius: 4px;/*角の丸み*/
margin: 1px;
cursor: pointer;
}
#month-menu > li a{
}
#month-menu > li:hover {
color: #FF0000;
font-size: 120%;
}
.swiper-container {
width: 100%;
padding: 0 0 5vh;
}
.swiper-slide img {
width: 100%;
}
#topicPhoto{
border: 4px white solid;
border-radius: 6px;
background-color: white;
}
#lineLogo,#regulations button{
cursor: pointer;
}
/************************/
/*ボタン */
/************************/
/*https://kyoheiomi.com/design/css_button_design*/
.myButton {
// display: block;
position: relative;
// width: 100px;
// padding: 0.8em;
margin-right:2px;
text-align: center;
text-decoration: none;
color: #1B1B1B;
background: whitesmoke/*#fff*/;
border-radius: 8px;
border:1px solid #1B1B1B;
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
backface-visibility: hidden;
word-break: keep-all;
}
.myButton:hover {
cursor: pointer;
text-decoration: none;
-webkit-animation: myButton 0.5s both;
-moz-animation: myButton 0.5s both;
animation: myButton 0.5s both;
}
@-webkit-keyframes myButton {
0% {
-webkit-transform: scale(1);
transform: scale(1);
}
100% {
-webkit-transform: scale(1.1);
transform: scale(1.1);
}
}
@-moz-keyframes myButton {
0% {
-webkit-transform: scale(1);
transform: scale(1);
}
100% {
-webkit-transform: scale(1.1);
transform: scale(1.1);
}
}
@keyframes myButton {
0% {
-webkit-transform: scale(1);
transform: scale(1);
}
100% {
-webkit-transform: scale(1.1);
transform: scale(1.1);
}
}
/************************/
/*プルダウンメニュー */
/***********************/
select::-ms-expand {
display: none;
}
select {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
/* margin-bottom: 20px;*/
padding: 4px 30px 4px 10px;
font-size: 100%;
line-height: 0.9em;
border-radius: 5px; border: none;
background-image: url(./img/icon_arrow.png);
background-repeat: no-repeat;
background-size: 12px 10px;
background-position: right 10px center;
background-color: #bddfff;
}
/***********************/
/*背景ビデオ */
/***********************/
#bg-video{
position: fixed;
right: 0;
bottom: 0;
min-width: 100%;
min-height: 100%;
width: auto;
height: auto;
z-index: -100;
background: url('./img/back1.jpg') no-repeat;
background-size: cover;
}
#messageTable .memberHN{
width:80px;
word-break:keep-all;
}
/***********************/
/*ローディング */
/***********************/
.loader{
left: 50%;
position: absolute;
top: 50%;
}
.circle {
font-size: 25px;
width: 1em;
height: 1em;
border-radius: 50%;
position: relative;
text-indent: -9999em;
-webkit-animation: load5 1.1s infinite ease;
animation: load5 1.1s infinite ease;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
}
@-webkit-keyframes load5 {
0%,
100% {
box-shadow: 0em -2.6em 0em 0em #c0c0c0, 1.8em -1.8em 0 0em rgba(192,192,192, 0.2), 2.5em 0em 0 0em rgba(192,192,192, 0.2), 1.75em 1.75em 0 0em rgba(192,192,192, 0.2), 0em 2.5em 0 0em rgba(192,192,192, 0.2), -1.8em 1.8em 0 0em rgba(192,192,192, 0.2), -2.6em 0em 0 0em rgba(192,192,192, 0.5), -1.8em -1.8em 0 0em rgba(192,192,192, 0.7);
}
12.5% {
box-shadow: 0em -2.6em 0em 0em rgba(192,192,192, 0.7), 1.8em -1.8em 0 0em #c0c0c0, 2.5em 0em 0 0em rgba(192,192,192, 0.2), 1.75em 1.75em 0 0em rgba(192,192,192, 0.2), 0em 2.5em 0 0em rgba(192,192,192, 0.2), -1.8em 1.8em 0 0em rgba(192,192,192, 0.2), -2.6em 0em 0 0em rgba(192,192,192, 0.2), -1.8em -1.8em 0 0em rgba(192,192,192, 0.5);
}
25% {
box-shadow: 0em -2.6em 0em 0em rgba(192,192,192, 0.5), 1.8em -1.8em 0 0em rgba(192,192,192, 0.7), 2.5em 0em 0 0em #c0c0c0, 1.75em 1.75em 0 0em rgba(192,192,192, 0.2), 0em 2.5em 0 0em rgba(192,192,192, 0.2), -1.8em 1.8em 0 0em rgba(192,192,192, 0.2), -2.6em 0em 0 0em rgba(192,192,192, 0.2), -1.8em -1.8em 0 0em rgba(192,192,192, 0.2);
}
37.5% {
box-shadow: 0em -2.6em 0em 0em rgba(192,192,192, 0.2), 1.8em -1.8em 0 0em rgba(192,192,192, 0.5), 2.5em 0em 0 0em rgba(192,192,192, 0.7), 1.75em 1.75em 0 0em #c0c0c0, 0em 2.5em 0 0em rgba(192,192,192, 0.2), -1.8em 1.8em 0 0em rgba(192,192,192, 0.2), -2.6em 0em 0 0em rgba(192,192,192, 0.2), -1.8em -1.8em 0 0em rgba(192,192,192, 0.2);
}
50% {
box-shadow: 0em -2.6em 0em 0em rgba(192,192,192, 0.2), 1.8em -1.8em 0 0em rgba(192,192,192, 0.2), 2.5em 0em 0 0em rgba(192,192,192, 0.5), 1.75em 1.75em 0 0em rgba(192,192,192, 0.7), 0em 2.5em 0 0em #c0c0c0, -1.8em 1.8em 0 0em rgba(192,192,192, 0.2), -2.6em 0em 0 0em rgba(192,192,192, 0.2), -1.8em -1.8em 0 0em rgba(192,192,192, 0.2);
}
62.5% {
box-shadow: 0em -2.6em 0em 0em rgba(192,192,192, 0.2), 1.8em -1.8em 0 0em rgba(192,192,192, 0.2), 2.5em 0em 0 0em rgba(192,192,192, 0.2), 1.75em 1.75em 0 0em rgba(192,192,192, 0.5), 0em 2.5em 0 0em rgba(192,192,192, 0.7), -1.8em 1.8em 0 0em #c0c0c0, -2.6em 0em 0 0em rgba(192,192,192, 0.2), -1.8em -1.8em 0 0em rgba(192,192,192, 0.2);
}
75% {
box-shadow: 0em -2.6em 0em 0em rgba(192,192,192, 0.2), 1.8em -1.8em 0 0em rgba(192,192,192, 0.2), 2.5em 0em 0 0em rgba(192,192,192, 0.2), 1.75em 1.75em 0 0em rgba(192,192,192, 0.2), 0em 2.5em 0 0em rgba(192,192,192, 0.5), -1.8em 1.8em 0 0em rgba(192,192,192, 0.7), -2.6em 0em 0 0em #c0c0c0, -1.8em -1.8em 0 0em rgba(192,192,192, 0.2);
}
87.5% {
box-shadow: 0em -2.6em 0em 0em rgba(192,192,192, 0.2), 1.8em -1.8em 0 0em rgba(192,192,192, 0.2), 2.5em 0em 0 0em rgba(192,192,192, 0.2), 1.75em 1.75em 0 0em rgba(192,192,192, 0.2), 0em 2.5em 0 0em rgba(192,192,192, 0.2), -1.8em 1.8em 0 0em rgba(192,192,192, 0.5), -2.6em 0em 0 0em rgba(192,192,192, 0.7), -1.8em -1.8em 0 0em #c0c0c0;
}
}
@keyframes load5 {
0%,
100% {
box-shadow: 0em -2.6em 0em 0em #c0c0c0, 1.8em -1.8em 0 0em rgba(192,192,192, 0.2), 2.5em 0em 0 0em rgba(192,192,192, 0.2), 1.75em 1.75em 0 0em rgba(192,192,192, 0.2), 0em 2.5em 0 0em rgba(192,192,192, 0.2), -1.8em 1.8em 0 0em rgba(192,192,192, 0.2), -2.6em 0em 0 0em rgba(192,192,192, 0.5), -1.8em -1.8em 0 0em rgba(192,192,192, 0.7);
}
12.5% {
box-shadow: 0em -2.6em 0em 0em rgba(192,192,192, 0.7), 1.8em -1.8em 0 0em #c0c0c0, 2.5em 0em 0 0em rgba(192,192,192, 0.2), 1.75em 1.75em 0 0em rgba(192,192,192, 0.2), 0em 2.5em 0 0em rgba(192,192,192, 0.2), -1.8em 1.8em 0 0em rgba(192,192,192, 0.2), -2.6em 0em 0 0em rgba(192,192,192, 0.2), -1.8em -1.8em 0 0em rgba(192,192,192, 0.5);
}
25% {
box-shadow: 0em -2.6em 0em 0em rgba(192,192,192, 0.5), 1.8em -1.8em 0 0em rgba(192,192,192, 0.7), 2.5em 0em 0 0em #c0c0c0, 1.75em 1.75em 0 0em rgba(192,192,192, 0.2), 0em 2.5em 0 0em rgba(192,192,192, 0.2), -1.8em 1.8em 0 0em rgba(192,192,192, 0.2), -2.6em 0em 0 0em rgba(192,192,192, 0.2), -1.8em -1.8em 0 0em rgba(192,192,192, 0.2);
}
37.5% {
box-shadow: 0em -2.6em 0em 0em rgba(192,192,192, 0.2), 1.8em -1.8em 0 0em rgba(192,192,192, 0.5), 2.5em 0em 0 0em rgba(192,192,192, 0.7), 1.75em 1.75em 0 0em #c0c0c0, 0em 2.5em 0 0em rgba(192,192,192, 0.2), -1.8em 1.8em 0 0em rgba(192,192,192, 0.2), -2.6em 0em 0 0em rgba(192,192,192, 0.2), -1.8em -1.8em 0 0em rgba(192,192,192, 0.2);
}
50% {
box-shadow: 0em -2.6em 0em 0em rgba(192,192,192, 0.2), 1.8em -1.8em 0 0em rgba(192,192,192, 0.2), 2.5em 0em 0 0em rgba(192,192,192, 0.5), 1.75em 1.75em 0 0em rgba(192,192,192, 0.7), 0em 2.5em 0 0em #c0c0c0, -1.8em 1.8em 0 0em rgba(192,192,192, 0.2), -2.6em 0em 0 0em rgba(192,192,192, 0.2), -1.8em -1.8em 0 0em rgba(192,192,192, 0.2);
}
62.5% {
box-shadow: 0em -2.6em 0em 0em rgba(192,192,192, 0.2), 1.8em -1.8em 0 0em rgba(192,192,192, 0.2), 2.5em 0em 0 0em rgba(192,192,192, 0.2), 1.75em 1.75em 0 0em rgba(192,192,192, 0.5), 0em 2.5em 0 0em rgba(192,192,192, 0.7), -1.8em 1.8em 0 0em #c0c0c0, -2.6em 0em 0 0em rgba(192,192,192, 0.2), -1.8em -1.8em 0 0em rgba(192,192,192, 0.2);
}
75% {
box-shadow: 0em -2.6em 0em 0em rgba(192,192,192, 0.2), 1.8em -1.8em 0 0em rgba(192,192,192, 0.2), 2.5em 0em 0 0em rgba(192,192,192, 0.2), 1.75em 1.75em 0 0em rgba(192,192,192, 0.2), 0em 2.5em 0 0em rgba(192,192,192, 0.5), -1.8em 1.8em 0 0em rgba(192,192,192, 0.7), -2.6em 0em 0 0em #c0c0c0, -1.8em -1.8em 0 0em rgba(192,192,192, 0.2);
}
87.5% {
box-shadow: 0em -2.6em 0em 0em rgba(192,192,192, 0.2), 1.8em -1.8em 0 0em rgba(192,192,192, 0.2), 2.5em 0em 0 0em rgba(192,192,192, 0.2), 1.75em 1.75em 0 0em rgba(192,192,192, 0.2), 0em 2.5em 0 0em rgba(192,192,192, 0.2), -1.8em 1.8em 0 0em rgba(192,192,192, 0.5), -2.6em 0em 0 0em rgba(192,192,192, 0.7), -1.8em -1.8em 0 0em #c0c0c0;
}
}
会員登録情報内
#playType{/*プレータイプ*/
display:flex; /*flex*/
align-items:center; /*縦位置の指定*/
}
#playRangeText{/*レンジテキスト*/
margin-left: 15px;
color:blue;
}
#playRange{/*レンジ*/
width: 100px;
}
#playRange {
-webkit-appearance: none;
appearance: none;
outline: none; /* outline: none を指定 */
cursor: pointer;
// width: 100%;
background: #efafda;
height: 8px;
border-radius: 8px;
}
#playRange::-webkit-slider-thumb {
-webkit-appearance: none;
appearance: none;
height: 20px;
width: 20px;
background-color: blue;//#4cabe2;
border-radius: 50%;
}
#playRange::-moz-range-thumb {
border: none;
height: 20px;
width: 20px;
background-color: blue;//#4cabe2;
border-radius: 50%;
}
#playRange::-webkit-slider-thumb:hover {
box-shadow: 0 0 0 7px rgba(0, 30, 255, 0.1)
}
#playRange:active::-webkit-slider-thumb {
box-shadow: 0 0 0 10px rgba(0, 30, 255, .2)
}
#playRange:focus::-webkit-slider-thumb {
box-shadow: 0 0 0 10px rgba(0, 30, 255, .2)
}
#playRange::-moz-range-thumb:hover {
box-shadow: 0 0 0 7px rgba(0, 30, 255, .1)
}
#playRange:active::-moz-range-thumb {
box-shadow: 0 0 0 10px rgba(0, 30, 255, .2)
}
#playRange:focus::-moz-range-thumb {
box-shadow: 0 0 0 10px rgba(0, 30, 255, .2)
}
/*パスワード表示切り替え用 2024.02*/
.password-wrapper {
width: 240px;
display: flex;
/*max-width: 500px;*/
border: 1px solid #958e8e;
}
#password1,#password2 {
flex: 1;
outline: none;
border: none;
}
.password_view_off {
width: 40px;
border: none;
background: url("./img/visibility_off.png") no-repeat center center;
/* background-size: 50% auto;*/
cursor: pointer;
opacity:0.3;
}
.password_view_on {
width: 40px;
border: none;
background: url("./img/visibility_on.png") no-repeat center center;
cursor: pointer;
opacity:0.3;
}