﻿@charset "utf-8";

/* ------------------------------------------------------------------------- */
/* 全領域に関する設定(タグごと) -------------------------------------------- */
/* ------------------------------------------------------------------------- */

/* フォントの設定 */
body {
    font-family: Arial, Roboto, "Droid Sans", "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
    font-size: 120%;
}

/* 行間の設定 */
body {
    line-height: 1.5em;
}

/* 斜体の無効化 */
address,em {
    font-style: normal;
}

/* リストマーカの無効化 */
ul {
    list-style-type: none;
}

/* リンクの意匠 */
a:link,
a:visited {
    text-decoration: none;
}
a:hover,
a:active {
    text-decoration: underline;
}

/* 見出しの下側の余白の設定 */
h3 {
    font-size: 100%;
    margin-bottom: 0;
}

/* 入力項目説明の設定(入力欄の右または、下に表示される、入力条件または例。) */
small {
    font-size: 80%;
}

/* テーブルのセル間の隙間を無くす */
table {
    border-collapse: collapse;
}

/* テキストボックスの横寸法設定 */
input[type="text"],
input[type="password"] {
    width: 100em;
    max-width: 93%; /* Chromeで見ると右余白が大きいが、これ以上にするとiPhone5で右端が表示されないので、あきらめる */
}
input[name$="YearString"] {
    width: 4em;
}
input[name$="MonthString"] {
    width: 2em;
}
input[name$="DayString"] {
    width: 2em;
}
input[name="userName"] {
    width: 14em;
    max-width: 80%; /* 敬称の分だけ小さめにする */
}
input[name="userNameHurigana"] {
    width: 14em;
}
input[name="postCode"] {
    width: 8em;
}
input[name="address2"] {
    width: 14em;
}
input[name="tel"] {
    width: 13em;
}
input[name^="personName"] {
    width: 10em;
    max-width: 70%; /* 敬称と削除チェックボックスの分だけ小さめにする */
}
input[name="renrakuName"] {
    width: 14em;
    max-width: 80%; /* 敬称の分だけ小さめにする */
}
input[name="renrakuTel"] {
    width: 13em;
}

/* 複数行テキストボックスの横寸法設定 */
textarea {
    width: 100em;
    max-width: 98%;
}

/* ボタンの無効状態をわかりやすくする */
button:disabled {
    color: #999999;
}

/* 次へボタン(押したらページが遷移する、ヘッダ領域以外にあるボタン)の設定 */
button.nextButton {
    color: #663300;
    background-color: #ffee66;
    background-image: url(/golf_user/image/bg_button.png);
    background-repeat: repeat-x;
    background-position: left top;
    font-size: 120%;
    line-height: 1.5em;
    margin-top: 1em;
    margin-left: auto;
    margin-right: auto;
    border: solid 1px #eecc00;
    width: 16em;
    max-width: 80%;
    display: block;
}
button.nextButton:hover {
    border-color: #663300;
}
button.nextButton:disabled {
    color: #999999;
}

/* セレクトボックスの横寸法設定 */
select {
    max-width: 98%;
}

/* セレクトボックスの無効状態をわかりやすくする */
select:disabled {
    color: #999999;
}



/* micro clearfix */
/* 説明   :ある要素内で回り込みを完結させるためのもの。 */
/* 使い方 :完結させたい要素を"clearfix"クラスに指定する。 */
.clearfix:after {
    content: "";
    display: block;
    clear: both;
}
.clearfix:before {
    content: "";
    display: block;
    clear: both;
}
.clearfix {
    display: block;
}


/* ------------------------------------------------------------------------- */
/* 領域ごとの設定----------------------------------------------------------- */
/* ------------------------------------------------------------------------- */

/* ヘッダの設定 ------------------------------------- */
body>header>div {
    margin: 0 auto;
    min-width: 320px;
    max-width: 740px;
}
body>header>div>div.loginArea {
    font-size: 90%;
    text-align: right;
    width: 215px;
    float: right;
}
body>header>div>div.loginArea>span {
    background-image: url(/golf_user/image/bg_login.png);
    background-repeat: no-repeat;
    background-position: right bottom;
    padding-right: 10px;
    display: inline-block;
}
body>header>div>div.loginArea>span>a {
    color: #000000;
    padding-top: 0.2em;
    padding-left: 0.1em;
    padding-right: 0;
    height: 30px;
    display: inline-block;
}
body>header>div>div.loginArea>span>a:first-child {
    background-color: #ffffff; /* 下の背景を消すため */
    background-image: url(/golf_user/image/bg_login.png);
    background-repeat: no-repeat;
    background-position: left bottom;
    padding-left: 30px;
    padding-right: 0.4em;
}
body>header>div>div.logoutArea {
    font-size: 90%;
    text-align: right;
    padding-top: 0.2em;
    width: 150px;
    float: right;
}
body>header>div>div.logoutArea>a {
    color: #0000ff;
}
body>header>div>h1 {
    font-size: 90%;
    font-weight: normal;
    margin: 0;
    padding-top: 0.2em;
}
body>header>div>h1 img{
    vertical-align: top;
}
body>header>div>h1 a {
    color: #000000;
}
body>header>div>h1 a>span {
    white-space: nowrap;
}
body>header>nav {
    background-color: #000000;
    background-image: url(/golf_user/image/bg_nav.png);
    background-repeat: repeat-x;
    margin-top: 1em;
    clear: both;
}
body>header>nav>ul {
    margin: 0 auto;
    padding: 0;
    min-width: 320px;
    max-width: 740px;
}
body>header>nav>ul>li {
    border-right: solid 1px #ffffff;
    width: 32%;
    float: left;
}
body>header>nav>ul>li:first-child {
    margin-left: 1.5%;
    border-left: solid 1px #ffffff;
}
body>header>nav>ul>li>a {
    color: #ffffff;
    font-size: 85%;
    text-align: center;
    padding: 0.6em 0;
    border-top: solid 4px #ffffff;
    display: block;
}
body>header>nav>ul>li.on>a {
    color: #000000;
    background-color: #ffffff;
    border-top-color: #aaee00;
}
body>header>div>h2 {
    color: #000000;
    background-color: #aaee00;
    background-image: url(/golf_user/image/bg_midasi.png);
    background-repeat: repeat-x;
    font-size: 100%;
    margin-top: 0.5em;
    margin-bottom: 0em;
    padding: 0.2em;
    border: solid 1px #aaee00;
}
body.popUpWindowPage>header>div h2 {
    margin-top: 0em;
}
body.popUpWindowPage>header>div p.windowCloseButtonArea {
    text-align: right;
    margin-bottom: 0;
}


/* フッタの設定 ------------------------------------- */
body>footer {
    color: #eeeeee;
    background-color: #000000;
    background-image: url(/golf_user/image/bg_footer.png);
    background-repeat: repeat-x;
    margin-top: 3em;
    clear: both;
}
body>footer>address {
	margin: 0 auto;
    padding: 0.4em 0; /* 左右を0以外にすると何故かiPhone5で画面右端に余計な隙間ができる。 */
    min-width: 320px;
    max-width: 740px;
}
body>footer>address>span {
    white-space: nowrap;
}
body>footer>address>span.golfjyoNameArea {
    white-space: normal; /* 長いゴルフ場名対策 */
}
body>footer>address>span.golfjyoAddressArea {
    word-spacing: -0.2em;
	white-space: normal; /* 長い住所対策 */
}
body>footer>address>span a {
    color: #eeeeee;
}


/* メイン領域の設定 ------------------------------------- */
div.main>div {
    margin: 0 auto;
    min-width: 320px;
    max-width: 740px;
    clear: both;
}

/* パンくずリスト */
div.main>div p.pankuzuList {
    margin-top: 0px;
}

/* 入力値エラーメッセージ領域 */
div.main>div p.inputValueErrorMessageArea {
    color : #ff0000;
}

/* 編集項目 */
div.main>div dl.editItem {
    margin-top: 0px;
    margin-bottom: 0px;
    padding-top: 0.5em;
    padding-bottom: 0.5em;
    clear: left;
    overflow: hidden;
}
div.main>div dl.editItem>dt {
    width: 27%;
    float: left;
}
div.main>div dl.editItem>dd {
    margin-left: 30%;
}
@media (max-width: 479px) {
    div.main>div dl.editItem>dt {
        width: 99%;
        float: none;
    }
    div.main>div dl.editItem>dd {
        margin-left: 3%;
        width: 96%;
    }
}
div.main>div dl.editItem>dd p,
div.main>div dl.editItem>dd ul {
    margin: 0;
    padding: 0;
}
div.main>div dl.editItem>dd ul>li {
    white-space: nowrap;
    margin-right: 1em;
    display: inline;
}
div.main>div dl.editItem>dt small.nyuuryokuHissu {
    color: #ff0000;
    font-size: 65%;
}

/* メンテナンス予告メッセージ領域 */
div.main>div p.maintenanceYokokuMessage {
    color: #ff0000;
}

/* メッセージ1領域(確認画面などで、コンテンツを挟み込むように配置されるメッセージの領域。) */
div.main>div p.message1Area {
    color: #000000;
    background-color: #ffffdd;
    text-align: center;
    border: solid 1px #999999;
}

/* ログインID・パスワードを忘れた場合領域 */
div.main>div p.wasuretabaaiArea {
    text-align: right;
    font-size: 80%;
    margin-top: 2em;
}

/* 仮登録のメールが届かない場合領域 */
div.main>div p.todokanaibaaiArea {
    text-align: right;
    font-size: 80%;
    margin-top: 1em;
}

/* ユーザ登録勧誘領域 */
div.main>div div.userAddKanyuuArea {
    background-color: #f7ffe7;
    margin-top: 3em;
    padding: 0.2em;
    border: solid 1px #aaee00;
}
div.main>div div.userAddKanyuuArea h3 {
    color: #000000;
    background-color: #aaee00;
    margin-top: 0;
    padding: 0.2em;
    border: solid 1px #aaee00;
}
div.main>div div.userAddKanyuuArea p.todokanaibaaiArea {
    margin-top: 2em;
}


/* 一つの予約組領域(予約照会画面に表示される、予約組の一つ分) */
div.main>div div.onePartyArea {
    background-color: #f7ffe7;
    background-image: url(/golf_user/image/bg_party.png);
    background-repeat: repeat-y;
    background-position: 450px 0px;
    padding: 0.2em;

    padding-bottom: 0.5em;
    border: solid 1px #aaee00;
}
div.main>div div.onePartyArea a {
    text-decoration: underline;
}
div.main>div div.onePartyArea h4 {
    margin-top: 1em;
    margin-bottom: 0;
}
div.main>div div.onePartyArea div.onePairArea {
    background-color: #ddffdd;
    background-image: url(/golf_user/image/bg_party.png);
    background-repeat: repeat-y;
    background-position: 450px 0px;
    margin-bottom: 0.5em;
    border: solid 1px #ffffff;
}
div.main>div div.onePartyArea div.onePairArea div.kinkyuuRenrakusakiConfirmArea {
    border-width: 0;
}
div.main>div div.onePartyArea div.partyButtonArea {
    margin-left: auto;
    margin-right: auto;
    width: 98%;
    max-width: 30em;
}
div.main>div div.onePartyArea div.partyButtonArea form {
    margin-left: 51%;
    width: 48%;
}
div.main>div div.onePartyArea div.partyButtonArea form:first-child {
    margin-left: 1%;
    float: left;
}
div.main>div div.onePartyArea div.partyButtonArea form button.nextButton {
    font-size: 100%;
    padding: 0.2em 0;
    width: 99%;
    max-width: none;
    display: inline-block;
}
div.main>div div.onePartyArea div.partyButtonArea form button.nextButton:disabled {
    background-color: #eeeeee;
    background-image: none;
    border-color: #999999;
}
div.main>div div.onePartyArea div.partyButtonArea p {
    font-size: 90%;
    margin: 0;
}

/* 人数選択領域(予約登録画面にある領域) */
div.personCountSelectArea {
    display: flex; /* labelタグ間に半角空白が入らないようフレックスボックスを使う */
    justify-content: center;
}
div.personCountSelectArea input {
    display: none; /* 紐づくlabelをボタンにするので、標準のラジオボタンは非表示にする */
}
div.personCountSelectArea label {
    text-align: center;
    border: 1px solid #000000;
    width: 1.6em;
    height: 1.5em;
    user-select: none; /* 文字選択になってしまうことを防ぐ */
}
div.personCountSelectArea label.personCountClearButton {
    width: 1.2em;
}
div.personCountSelectArea input:disabled + label {
    color: #cccccc;
	border: 1px solid #cccccc;
}
div.personCountSelectArea input:checked + label:not(.personCountClearButton) {
    /* 選ばれている状態のプレーヤ人数ボタン。目立たせる。 */
	color: #ffffff;
	background-color: #0000ff;
}
div.personCountSelectArea input:checked + label.personCountClearButton {
    /* プレーヤ人数が選ばれていない状態の解除ボタン。目立たせない。 */
    color: #cccccc;
	border: 1px solid #cccccc;
}
div.personCountSelectArea label span {
    font-size: 70%; /* 単位「人」を小さく表示するための設定 */
}
div.personCountSelectArea label img {
    vertical-align: middle;
    width: 15px;
    height: 21px;
}

/* 1ページもしくはごく一部のページにしか影響を及ぼさない設定 ------------------------------------ */

/* プラン・プレー日型予約カレンダへの切り替え */
/* 備考 : プラン・プレー日型予約カレンダ併用でない場合、wideAreaクラスは存在しない。 */
@media (min-width: 1200px) {
    div.main>div.wideArea {
        width: 1190;
        max-width: 1190px;
    }
	div.main>div.wideArea table.calendarTable {
        display: none;
    }
    div.main>div.wideArea table.planPlayDayTable {
        display: block; /* 通常のテーブルとして表示する */
    }
    div.main>div.wideArea div.reservationCalendarPlanIconSetumei {
        display: block; /* 通常のdivとして表示する */
    }
}

/* 埋め込み */
div.main>div.umekomi ul.monthTabArea {
	margin: 0; /* 月タブの上の余白は埋め込んだ時に邪魔になるだろうから取り除いておく */
}

/* 月タブ領域 */
div.main>div ul.monthTabArea {
    background-image: url(/golf_user/image/bg_month_tab_area.png);
    background-repeat: repeat-x;
    background-position: bottom ;
    margin-bottom: 0;
    padding: 0 5px;
}
div.main>div ul.monthTabArea>li {
    text-align: center;
    margin-right: 3px;
    width: 24%;
    max-width: 6em;
    float: left;
}
div.main>div ul.monthTabArea>li a {
    color: #333333;
    background-color: #eeeeee;
    background-image: url(/golf_user/image/bg_month_tab.png);
    background-repeat: repeat-x;
    background-position: bottom;
    font-size: 150%;
    vertical-align: bottom;
    padding-top: 0.3em;
    padding-bottom: 0.1em;
    border-top: solid 4px #ffffff;
    border-bottom: solid 1px #aaee00;
    border-left: solid 1px #ffffff;
    border-right: solid 1px #ffffff;
    display: block;
}
div.main>div ul.monthTabArea>li.on a {
    color: #000000;
    background-color: #f7ffe7;
    background-image: none;
    border-top-color: #aaee00;
    border-bottom-color: #f7ffe7;
    border-right-color: #aaee00;
    border-left-color: #aaee00;
}
div.main>div ul.monthTabArea>li a span {
    font-size: 50%;
    vertical-align: bottom;
}

/* 予約カレンダ(外枠。タブは含まない) */
div.main>div div.reservationCalendar {
    background-color: #f7ffe7;
    background-image: url(/golf_user/image/bg_reservation_calendar4.jpg);
    background-repeat: repeat;
    background-position: left top;
    margin-top: 0;
    padding: 0.5em 3px;
    border: solid 1px #aaee00;
    border-top-width: 0;
}

/* カレンダテーブル */
div.main>div table.calendarTable {
    margin: 0 auto;
    width: 100%;
    max-width: 600px;
}
div.main>div table.calendarTable th {
    color: #000000;
    font-size: 120%;
    font-weight: normal;
    width: 13%;
}
div.main>div table.calendarTable th.sundayCol {
    color: #ff0000;
}
div.main>div table.calendarTable th.saturdayCol {
    color: #0000ff;
}
div.main>div table.calendarTable td {
    background-color: #ffffff;
    line-height: 1em;
    vertical-align: top;
    padding-top: 0.2em;
    padding-bottom: 0.8em;
    border: solid 1px #669900;
}
div.main>div table.calendarTable td div {
    font-size: 120%;
    text-align: center;
}
div.main>div table.calendarTable td div.akiHyouziArea {
    margin-top: 0.2em;
}
div.main>div table.calendarTable td div.akiHyouziArea img {
    width: 1em;
    height: 1em;
}
div.main>div table.calendarTable td.outCol {
    background-color: #f7ffe7;
}
div.main>div table.calendarTable td.holidayCol {
    background-color: #ffddff;
}
div.main>div table.calendarTable td.sundayCol {
    background-color: #ffddff;
}
div.main>div table.calendarTable td.saturdayCol {
    background-color: #ddffff;
}

/* プラン・プレー日テーブル */
div.main>div table.planPlayDayTable {
    margin: 0 auto;
    width: 100%;
    display: none; /* 通常は非表示 */
}
div.main>div table.planPlayDayTable .iconCol {
    width: 120px;
}
div.main>div table.planPlayDayTable .priceCol {
    width: 80px;
}
div.main>div table.planPlayDayTable .holidayCol,
div.main>div table.planPlayDayTable .sundayCol {
	background-color: #ffddff;
}
div.main>div table.planPlayDayTable .saturdayCol {
    background-color: #ddffff;
}
div.main>div table.planPlayDayTable th,
div.main>div table.planPlayDayTable td {
    background-color: #ffffff;
    font-size: 85%;
	border: solid 1px #669900;
    padding: 2px 2px;
}
div.main>div table.planPlayDayTable th {
    font-weight: normal;
}
div.main>div table.planPlayDayTable td {
    text-align: center;
}
div.main>div table.planPlayDayTable thead th {
    background-color: #f7ffe7;
}
div.main>div table.planPlayDayTable thead td.holidayCol,
div.main>div table.planPlayDayTable thead td.sundayCol {
    color: #ff0000;
}
div.main>div table.planPlayDayTable thead td.saturdayCol {
	color: #0000ff;
}
div.main>div table.planPlayDayTable tbody .planNameCol {
    text-decoration: underline;
	text-align: left;
}
div.main>div table.planPlayDayTable tbody .iconCol {
    text-align: left;
}
div.main>div table.planPlayDayTable tbody .priceCol {
    color: #ff0000;
    font-size: 80%;
    text-align: right;
}
div.main>div table.planPlayDayTable tbody .priceCol span {
    font-size: 120%;
    font-weight: bold;
}
div.main>div table.planPlayDayTable tbody td img {
    width: 1em;
    height: 1em;
}

/* 空き表示説明 */
div.main>div p.akiHyouziSetumei {
    margin-top: 0.5em;
}
div.main>div p.akiHyouziSetumei img {
    vertical-align: middle;
    width: 1em;
    height: 1em;
}

/* 予約カレンダプランアイコン説明 */
div.main>div div.reservationCalendarPlanIconSetumei {
    display: none; /* 通常は非表示 */
}

/* プラン一覧 */
div.main>div div.onePlanArea {
    background-color: #f7ffe7;
    margin-top: 1em;
    padding: 0.2em;
    padding-bottom: 0.5em;
    border: solid 1px #aaee00;
}
div.main>div div.onePlanArea h3 {
    margin: 0;
}
div.main>div div.onePlanArea p {
    margin: 0;
}
div.main>div div.onePlanArea>div {
    width: 45%;
    float: left;
}
div.main>div div.onePlanArea>div dl.akiPairCountArea {
    margin: 0;
}
div.main>div div.onePlanArea>div dl.akiPairCountArea dt,
div.main>div div.onePlanArea>div dl.akiPairCountArea dd {
    color: #ff0000;
    display: inline-block;
}
div.main>div div.onePlanArea>div dl.akiPairCountArea dd {
    margin-left: 0.5em;
}
div.main>div div.onePlanArea p.priceArea {
    color: #ff0000;
    text-align: right;
}
div.main>div div.onePlanArea p.planSelectButtonArea {
    text-align: right;
}
div.main>div div.onePlanArea p.planSelectButtonArea button.nextButton {
    margin-right: 0;
    width: 50%;
}

/* プランアイコン説明領域 */
div.main>div ul.planIconSetumeiArea {
    margin-top: 0;
    padding: 0;
}
div.main>div ul.planIconSetumeiArea>li>span {
    white-space: nowrap;
    margin-left: 0.2em;
}
div.main>div ul.planIconSetumeiArea>li>span>img {
    vertical-align: middle;
    margin-right: 0.1em;
}

/* コース・スタート時間一覧表(これは空き枠確認ページにある) */
div.main>div table.courseStartTimeListTable {
    width: 100%;
}
div.main>div table.courseStartTimeListTable .courseNameCol {
    width: auto;
}
div.main>div table.courseStartTimeListTable .startTimeCol {
    width: 25%;
}
div.main>div table.courseStartTimeListTable .personCountCol {
	width: 25%; /* 人数の範囲表示が2行にならないよう大きめにする */
}
div.main>div table.courseStartTimeListTable tr.hirenzokuWaku {
    background-color: #eeeeee;
}
div.main>div table.courseStartTimeListTable tr th {
    color: #000000;
    background-color: #ddee00;
    border: solid 1px #999999;
}
div.main>div table.courseStartTimeListTable tr td {
    text-align: center;
    padding: 0.5em 0.2em;
    border: solid 1px #999999;
}

/* コース、スタート時間、予約個人表(これは予約登録編集ページと予約内容変更編集ページにある) */
div.main>div table.courseStartTimePersonTable {
    width: 100%;
}
div.main>div table.courseStartTimePersonTable .courseNameCol {
    width: auto;
}
div.main>div table.courseStartTimePersonTable .startTimeCol {
    width: 20%;
}
div.main>div table.courseStartTimePersonTable .pairCancelCol {
    width: 10%;
}
div.main>div table.courseStartTimePersonTable tr {
    border: solid 1px #999999;
}
div.main>div table.courseStartTimePersonTable tr th {
    color: #000000;
    background-color: #ddee00;
    font-size: 1em;
    font-weight: normal;
}
div.main>div table.courseStartTimePersonTable tr.pairRow td {
    text-align: center;
    padding: 0.5em 0.2em;
}
div.main>div table.courseStartTimePersonTable tr.pairRow td.wantsCancel {
    background-color: #eeeeee;
}
div.main>div table.courseStartTimePersonTable tr.hirenzokuWaku  {
    background-color: #eeeeee;
}
div.main>div table.courseStartTimePersonTable tr.personRow {
    background-image: url(/golf_user/image/bg_person_area.png);
    background-repeat: no-repeat;
    background-position: 10px 100%;
    border-left-width: 0;
    border-bottom-width: 0;
}
div.main>div table.courseStartTimePersonTable tr.personRow td h5 {
    font-size: 1em;
    font-weight: normal;
    text-align: right;
    margin: 0px;
    padding-right: 8em;
}
div.main>div table.courseStartTimePersonTable tr.personRow td p {
    line-height: 2.5em;
    text-align: right;
    margin: 0px;
    padding-bottom: 1.5em;
    padding-right: 3%;
}
div.main>div table.courseStartTimePersonTable tr.personRow td p input.wantsCancel {
    background-color: #eeeeee;
    border: solid 2px #eeeeee;
}
div.main>div table.courseStartTimePersonTable tr.wantsCancel {
    background-image: url(/golf_user/image/bg_person_area_wants_cancel.png);
}

/* コース、スタート時間、予約個人表説明 */
p.courseStartTimePersonTableSetumei {
	margin-top: 0;
}
p.courseStartTimePersonTableSetumei img {
    vertical-align: middle;
    width: 15px;
    height: 21px;
}

/* 緊急連絡先編集領域 */
div.main>div div.kinkyuuRenrakusakiEditArea {
    margin-top: 2em;
    padding: 0.2em;
}

/* 組追加領域 */
div.main>div div.pairAddArea {
    background-color: #f7ffe7;
    margin: 2em 0;
    padding: 0.2em;
    border: solid 1px #aaee00;
}
div.main>div div.pairAddArea h3 {
    margin: 0;
}
div.main>div div.pairAddArea p {
    text-align: right;
}
div.main>div div.pairAddArea p select,
div.main>div div.pairAddArea p button {
    margin-bottom: 1em;
}

/* ユーザ情報領域 */
div.main>div div.userInfoArea>div {
    background-color: #f7ffe7;
    background-image: url(/golf_user/image/bg_party.png);
    background-repeat: repeat-y;
    background-position: 500px 0px;
    padding: 0.2em;
    padding-bottom: 0.5em;
    border: solid 1px #aaee00;
}
div.main>div div.userInfoArea p {
    margin: 0;
}
div.main>div div.userInfoArea p.qrCodeArea {
    background-color: #ffffff;
	text-align: center;
}
div.main>div div.userInfoArea p.qrCodeArea img {
	width: 290px;
    max-width: 100vmin; /* スマートフォンを横にしても画面に収まるようにするため */
}
div.main>div div.userInfoArea p.pointArea span {
    font-size:120%
}

/* 規約 */
p.kiyaku {
    padding-left: 0.2em;
}

/* プラン詳細ページ */
body.planDetailPage dt {
    background-color: #ffffdd;
}

/* ウィンドウを閉じるボタン領域(ただし、ヘッダにあるウィンドウを閉じるボタン領域は除く) */
body.popUpWindowPage>div.main>div p.windowCloseButtonArea {
    text-align: center;
    margin-top: 1em;
    margin-bottom: 2em; /* タスクバーでこのボタンが隠れるのを防ぐため。 */
    clear: both;
}
