@charset "utf-8";
/* ------------------------------------------------------------------------ */
/* 2016年 Myカレンダー機能追加に伴うスマホサイトリニューアル
/*
/* お知らせ関連ページのスタイルシート
/* ▼ 該当ページ（該当ページの<body>に「.info」を設定）
/* (1)お知らせTOP ⇒ .infoTop
/* (2)各ゴルフ場毎のお知らせ一覧 ⇒ .infoList
/* (3)お知らせ詳細 ⇒ .infoDetail
/* (4)競技会結果一覧のスタイル ⇒ .compeResult
/* ------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------ */
/* お知らせ関連ページの共通スタイル
/* unique_id:.info
/* ------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------ */
/* (1)お知らせTOPのスタイル
/* unique_id:.infoTop
/* ------------------------------------------------------------------------ */
/* タイトル表示エリアのスタイル（独自スタイル）----------------------------------- */
.infoTop h2.title{
padding:20px 0;
}
/* ▼ アコーディオンメニューの基本スタイル ▼ ------------------------------------- */
.infoTop dl a{
text-decoration:none;
}
.infoTop dt{
position:relative;
margin-bottom:1px;
padding:15px 10px 15px 2px;
text-align:left;
background-color:#5CB8E6;
color:#FFFFFF;
font-size:116%;
font-weight:bold;
}
.infoTop dt:after{
position:absolute;
right:5px;
top:50%;
margin-top:-9px;
content:";";
font-family:"WebSymbolsgfeditRegular";
}
.infoTop dt.open:after{
content:":";
}
.infoTop dt.friend:after,
.infoTop dt.secret:after,
.infoTop dt.private:after{
content:")";
}
/* ▼ メンバーゴルフ場からのお知らせ ▼ ------------------------------------------ */
.infoTop dt.member{
position:relative;
margin-bottom:1px;
background:url(../../../images/mypage/bg_courseName_member.png);
border-bottom:2px solid #442800;
}
.infoTop dt.member span{
position: relative;
top:-1px;
margin-right:5px;
padding:1px 2px;
background: #FFFFFF;
border: 2px solid #dd0000;
border-radius:3px;
color:#DD0000;
font-size:71%;
font-weight:bold;
}
.infoTop dt.member span:after,
.infoTop dt.member span:before {
left: 100%;
top: 50%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
}
.infoTop dt.member span:after{
border-color: rgba(255, 255, 255, 0);
border-left-color: #FFFFFF;
border-width: 2px;
margin-top: -2px;
}
.infoTop dt.member span:before{
border-color: rgba(221, 0, 0, 0);
border-left-color: #dd0000;
border-width: 5px;
margin-top: -5px;
}
/* 各お知らせ毎のNEWマーク(赤●) */
.infoTop dd.member li{
position:relative;
padding:15px 30px 15px 10px;
border-bottom:1px solid #CCCCCC;
vertical-align:middle;
font-size:114%;
font-weight:bold;
line-height:1.0;
}
.infoTop dd.member li:after{
position:absolute;
right:5px;
top:50%;
margin-top:-9px;
content:")";
font-family:"WebSymbolsgfeditRegular";
color:#0085CD;
}
.infoTop dd.member li.new{
padding-left:0;
}
.infoTop dd.member li.new a{
position:relative;
display:block;
padding-left:16px;
}
.infoTop dd.member li.new a:before{
position:absolute;
left:2px;
top:50%;
margin-top:-10px;
content:"●";
color:#DD0000;
font-size:129%;
}
/* ▼ ゴルフ場からのメッセージ ▼ ----------------------------------------------- */
.infoTop dt.message{
margin-bottom:1px;
background-color:#0085CD;
border-bottom:2px solid #004970;
}
.infoTop dt.message span{
position: relative;
top:-1px;
margin-right:5px;
padding:1px 2px;
background: #FFFFFF;
border: 2px solid #dd0000;
border-radius:3px;
color:#DD0000;
font-size:71%;
font-weight:bold;
}
.infoTop dt.message span:after,
.infoTop dt.message span:before {
left: 100%;
top: 50%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
}
.infoTop dt.message span:after{
border-color: rgba(255, 255, 255, 0);
border-left-color: #FFFFFF;
border-width: 2px;
margin-top: -2px;
}
.infoTop dt.message span:before{
border-color: rgba(221, 0, 0, 0);
border-left-color: #dd0000;
border-width: 5px;
margin-top: -5px;
}
.infoTop dd.message li{
position:relative;
padding:0 30px 10px 0;
border-bottom:1px solid #CCCCCC;
vertical-align:middle;
font-size:114%;
font-weight:bold;
line-height:1.3;
}
.infoTop dd.message li:after{
position:absolute;
right:5px;
top:50%;
margin-top:-9px;
content:")";
font-family:"WebSymbolsgfeditRegular";
color:#0085CD;
}
.infoTop dd.message p.gcName span:after{
position:relative;
top:-1px;
content:attr(data-pref);
margin:0 3px;
padding:2px 3px;
background-color:#0086CD;
-webkit-border-radius:5px;
border-radius:5px;
color:#FFFFFF;
font-size:77%;
white-space:nowrap;
}
.infoTop dd.message li p.date{
position:relative;
width:230px;
height:25px;
padding:5px 20px 0 5px;
background-color:#4CA9DC;
text-align:left;
color:#FFFFFF;
font-size:93%;
font-weight:bold;
}
.infoTop dd.message li p.date:before{
display:inline-block;
margin-right:3px;
padding:0 3px;
background-color:#FFFFFF;
border-radius:3px;
content:"プレー日";
color:#4CA9DC;
font-size:86%;
font-weight:bold;
}
.infoTop dd.message li p.date:after{
display:block;
position:absolute;
left:235px;
top:0;
z-index:100;
content:" ";
border-bottom:30px solid #FFFFFF;
border-left:10px solid transparent;
height: 0;
}
.infoTop dd.message li p.gcName{
padding:5px 0 0 10px;
}
/* 各メッセージ毎の未読マーク（赤●） */
.infoTop dd.message li.unread p.gcName{
position:relative;
padding-left:16px;
}
.infoTop dd.message li.unread p.gcName:before{
position:absolute;
left:2px;
top:50%;
margin-top:-10px;
content:"●";
color:#DD0000;
font-size:129%;
}
/* ▼ ゴルフ場からのメッセージ ▼ ----------------------------------------------- */
.infoTop dt.friend{
margin-bottom:1px;
background-color:#638C0B;
border-bottom:2px solid #2E4400;
padding-left:2px;
}
/* 未返答マークのスタイル ----------------------------------------------------- */
.infoTop dt.friend span{
position: relative;
top:-1px;
margin-right:5px;
padding:1px 2px;
background: #FFFFFF;
border: 2px solid #dd0000;
border-radius:3px;
color:#DD0000;
font-size:71%;
font-weight:bold;
}
.infoTop dt.friend span:after,
.infoTop dt.friend span:before {
left: 100%;
top: 50%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
}
.infoTop dt.friend span:after{
border-color: rgba(255, 255, 255, 0);
border-left-color: #FFFFFF;
border-width: 2px;
margin-top: -2px;
}
.infoTop dt.friend span:before{
border-color: rgba(221, 0, 0, 0);
border-left-color: #dd0000;
border-width: 5px;
margin-top: -5px;
}
/* ▼ シークレットプラン ▼ ---------------------------------------------------- */
.infoTop dt.secret{
margin-bottom:1px;
background-color:#224A6F;
border-bottom:2px solid #002242;
}
/* 新着マークのスタイル ----------------------------------------------------- */
.infoTop dt.secret span{
position: relative;
top:-1px;
margin-right:5px;
padding:1px 2px;
background: #FFFFFF;
border: 2px solid #dd0000;
border-radius:3px;
color:#DD0000;
font-size:71%;
font-weight:bold;
}
.infoTop dt.secret span:after,
.infoTop dt.secret span:before {
left: 100%;
top: 50%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
}
.infoTop dt.secret span:after{
border-color: rgba(255, 255, 255, 0);
border-left-color: #FFFFFF;
border-width: 2px;
margin-top: -2px;
}
.infoTop dt.secret span:before{
border-color: rgba(221, 0, 0, 0);
border-left-color: #dd0000;
border-width: 5px;
margin-top: -5px;
}
.infoTop dt.private {
margin-bottom: 1px;
background-color: #7d0000;
border-bottom: 2px solid #330000;
}
.infoTop dt.private span {
position: relative;
top: -1px;
margin-right: 5px;
padding: 1px 2px;
background: #FFFFFF;
border: 2px solid #dd0000;
border-radius: 3px;
color: #DD0000;
font-size: 71%;
font-weight: bold;
}
/* ------------------------------------------------------------------------ */
/* (2)各ゴルフ場毎のお知らせ一覧ページのスタイル
/* unique_id:.infoList
/* ------------------------------------------------------------------------ */
/* タイトル表示エリアのスタイル（独自スタイル）----------------------------------- */
.infoList h2.title{
padding-left:80px;
padding-right:60px;
}
.infoList h2.title span{
font-size:86%;
font-weight:normal;
}
/* ▼ ローカルナビエリアのスタイル(nav) ▼ --------------------------------- */
.infoList #container nav{
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-justify-content:space-between; /* Safari */
justify-content:space-between;
}
.infoList #container nav a{
position:relative;
display:inline-block;
width:50%;
padding:15px 5px 15px 15px;
text-align:left;
background-color:#006297;
border-bottom:2px solid #002141;
color:#FFFFFF;
font-size:114% !important;
font-weight:bold;
text-decoration:none;
}
.infoList #container nav a.schedule{
margin-right:1px;
background-color:#006297;
border-bottom:2px solid #002141;
}
.infoList #container nav a.result{
background-color:#7bb439;
border-bottom:2px solid #154100;
}
.infoList #container nav a.schedule:after,
.infoList #container nav a.result:after{
position:absolute;
right:5px;
top:50%;
margin-top:-9px;
content:")";
font-family:WebSymbolsgfeditRegular;
font-size:93%;
}
/* ▼ お知らせリスト表示エリアのスタイル（ul）▼ ------------------------------- */
.infoList ul.index a{
position:relative;
display:block;
padding:20px 20px 20px 100px;
border-bottom:1px solid #CCCCCC;
}
.infoList ul.index a:after{
position:absolute;
right:5px;
top:50%;
margin-top:-9px;
content:")";
font-family:"WebSymbolsgfeditRegular";
color:#0085CD;
}
.infoList ul.index li{
width:100%;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}
.infoList ul.index li:before{
position:absolute;
left:3px;
top:50%;
margin-top:-18px;
padding:2px;
content:"すべてのお客様へ";
background-color:#DD0000;
border-radius:3px;
color:#FFFFFF;
font-size:79%;
}
.infoList ul.index li.member:before{
position:absolute;
left:3px;
top:50%;
margin-top:-18px;
padding:2px;
content:"メンバーの皆様へ";
background-color:#7bb439;
border-radius:3px;
color:#FFFFFF;
font-size:79%;
}
.infoList ul.index li:after{
position:absolute;
left:3px;
top:50%;
content:attr(data-date);
}
/* ---------------------------------------------------------------- */
/* (3)お知らせ詳細ページのスタイル
/* unique_id:.infoDetail
/* ---------------------------------------------------------------- */
.infoDetail h2:before{
display:block;
width:35%;
margin:0 auto 2px;
padding:2px;
content:"すべてのお客様へ";
background-color:#DD0000;
border-radius:3px;
color:#FFFFFF;
font-size:79%;
}
.infoDetail h2.member:before{
content:"メンバーの皆様へ";
background-color:#7bb439;
}
/* ▼ タイトル表示エリア（h3）のスタイル ▼ ------------------------------ */
.infoDetail h3{
padding:10px;
background-color:#5CB8E5;
color:#FFFFFF;
font-size:107%;
font-weight:bold;
}
/* ▼ 本文表示エリア（article）のスタイル ▼ ----------------------------- */
.infoDetail article{
padding:10px;
}
/* ▼ 一覧ページに戻るボタン（p.back）のスタイル ▼ ----------------------- */
.infoDetail p.back a{
position:relative;
display:block;
width:40%;
border:1px solid #CCCCCC;
border-radius: 3px;
background-image: -moz-linear-gradient( 90deg, rgb(215,215,215) 0%, rgb(255,255,255) 100%);
background-image: -webkit-linear-gradient( 90deg, rgb(215,215,215) 0%, rgb(255,255,255) 100%);
background-image: -ms-linear-gradient( 90deg, rgb(215,215,215) 0%, rgb(255,255,255) 100%);
box-shadow: 0px 2px 0px 0px rgba(0, 0, 0, 0.6);
margin:0 auto 20px;
padding:10px 10px 10px 10px;
text-align:center;
text-decoration:none;
font-size:114%;
font-weight:bold;
}
.infoDetail p.back a:before{
position:absolute;
left:8px;
top:50%;
margin-top:-9px;
content:"(";
font-family:"WebSymbolsgfeditRegular";
}
/* ------------------------------------------------------------------------ */
/* (4)競技会結果一覧のスタイル
/* unique_id:.compeResult
/* ------------------------------------------------------------------------ */
/* タイトル表示エリアのスタイル（独自スタイル）----------------------------------- */
.compeResult h2.title{
padding-left:80px;
padding-right:60px;
border-bottom:none;
}
.compeResult h2.title span{
font-size:86%;
font-weight:normal;
}
/* 年選択UIのスタイル（ul.selectYear）---------------------------------------- */
.compeResult .yearSelect select{
display:block;
width:100%;
-webkit-appearance:button;
-moz-appearance:button;
appearance:button;
text-indent:40%;
height:40px;
line-height:40px;
color:#FFFFFF;
font-size:121%;
font-weight:bold;
vertical-align:middle;
background-color:#004D76;
border:none;
border-radius:0;
box-shadow: 0px 2px 0px 0px rgba(0, 0, 0, 0.4);
}
.compeResult .yearSelect{
position:relative;
}
.compeResult .yearSelect:after{
position:absolute;
right:5px;
top:50%;
margin-top:-10px;
content:";";
font-family:"WebSymbolsgfeditRegular";
font-size:121%;
color:#FFFFFF;
}
/* 説明エリアのスタイル（p.note） --------------------------------------------- */
.compeResult p.note{
padding:10px 5px;
color:#DD0000;
}
.compeResult p.note:before{
position:relative;
top:-1px;
content:"x";
font-family:"WebSymbolsgfeditRegular";
margin-right:2px;
padding:2px 4px;
background-color:#DD0000;
border-radius:3px;
font-size:86%;
color:#FFFFFF;
}
.compeResult p.note a{
display:inline-block;
margin-top:5px;
font-size:107%;
color:#0085CD;
text-decoration:none;
}
.compeResult p.note a:after{
content:")";
font-family:"WebSymbolsgfeditRegular";
margin-left:2px;
}
/* Myカレンダー以外のゴルフ場の予約検索への導線のスタイル（#otherCourse） ---------- */
.compeResult table{
width:100%;
border:none;
border-collapse:collapse;
}
.compeResult th{
padding:5px;
background-color:#F0F0F0;
border-top:1px solid #CCCCCC;
border-bottom:1px solid #CCCCCC;
text-align:left;
font-weight:bold;
}
.compeResult td{
padding:0 5px;
vertical-align:middle;
border-bottom:1px solid #CCCCCC;
line-height:1.0em;
}
.compeResult td a{
position:relative;
display:block;
padding:10px 20px 10px 5px;
text-decoration:none;
}
.compeResult td a:before{
position:relative;
top:-1px;
content:"x";
font-family:"WebSymbolsgfeditRegular";
padding:2px 4px;
background-color:#DD0000;
border-radius:3px;
font-size:86%;
color:#FFFFFF;
}
.compeResult td a:after{
position:absolute;
right:5px;
top:50%;
margin-top:-8px;
content:")";
font-family:"WebSymbolsgfeditRegular";
font-size:107%;
color:#0085CD;
}
.compeResult td.unlock a:before{
display:none;
}
/* ---------------------------------------------------------------- */
/* Myカレンダーにプランを表示するゴルフ場を選択するページのスタイル
/* id:.myCalSelect
/* ---------------------------------------------------------------- */
/* ---------------------------------------------------------------- */
/* Myカレンダーにプランを表示しているゴルフ場の優先順位を変更するページのスタイル
/* id:.myCalReplace
/* ---------------------------------------------------------------- */