@CHARSET "utf-8";
/* すべて */
/* ADDRESSタグ */
address {
    font-style: normal;
}
address > span {
    padding: .5em;
}
/* BODYタグ */
body {
    color: #000;
    background: #ffe;
    margin: 0;
    -webkit-text-size-adjust: 100%;
}
/* DLタグ */
dl { margin: 0; }
dt {
    font-weight: bolder;
    float: left;
    clear: both;
}
.nest {
    font-weight: normal;
    float: none;
}
/* FOOTERタグ */
footer {
    color: #4d7f4d;
    font-size: small;
    text-align: center;
}
/* HRタグ */
hr {
    height: 1px;
    border: none;
    border-top: 1px #888 solid;
}
/* H1〜H6 */
h1, h2, h3, h4, h5, h6 {
    color: #4d7f4d;
    font-family: Helvetica,"游ゴシック","YuGothic","Hiragino Kaku Gothic ProN","Hiragino Kaku Gothic Pro","メイリオ","ＭＳ ゴシック",sans-serif;
    margin: 0;
}
h1 {
    font-size: 1.5em;
    line-height: 1.25em;
    padding: 0;
}
h2 {
    font-size: 1.25em;
    padding: 0;
}
h3 {
    margin-top: 1em;
    word-break: break-all;
    word-break: break-word;
}
/* 地図 */
#embed-map,
iframe {
    width: 300px;
    height: 300px;
    border: 0;
    margin: 0;
    overflow: hidden;
}
/* IMGタグ */
img {
    border-style: none;
    vertical-align: middle;
}
/* INPUTタグ */
.err { background-color: orange; }
/*==============================*/
/* その他:CLASS(ページに複数個) */
#imgM {
    width: 100px;
    height: 100px;
}
.logo {
    max-width: 100%;
    height: auto;
}
.icon {
    width: 16px;
    height: 16px;
    vertical-align: middle;
}
.title { width: 100%; }
.displayNone { display: none; }
.alignCenter { text-align: center; }
.alignRight { text-align: right; }
.nobr { white-space: nowrap; }
.tbl-center { margin: auto; }
.no-support {
    padding: .25em 1em;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
}
/* その他:CLASS(table関係) */
.title,
.header {
    white-space: nowrap;
}
.header {
    text-align: left;
    vertical-align: top;
    clear: both;
}
.body {
    text-align: left;
    vertical-align: top;
    word-wrap: break-word;
    word-break: break-all;
}
.required { float: right; }

/* 入力フォーム - テーブル */
.form-tbl th {
    position: relative;
    padding-right: 4em;
}
.form-tbl td dl,
.form-tbl td ul,
.form-tbl td p {
    margin-top: 0;
    margin-bottom: 0;
}
.form-tbl td ul {
    list-style: none;
    padding-left: 0;
}
.required {
    display: inline-block;
    font-weight: normal;
    position: absolute;
    right: 0;
}
.required:before {
    content: "（";
}
.required:after {
    content: "）";
}

/*==============================*/
/* ページヘッダー */
#page-header {
    display: table;
    width: 100%;
}
#page-header > div {
    display: table-cell;
    vertical-align: middle;
    padding: .25em .5em;
}
#page-header > div:first-child {
    text-align: left;
}
#page-header > div:last-child {
    text-align: right;
}
#page-header-link-city {
    color: #4d7f4d;
    font-size: large;
    text-decoration: none;
    white-space: nowrap;
}
#page-header-link-qrcode {
    color: #4d7f4d;
    display: inline-block;
    font-size: small;
    white-space: nowrap;
}
#page-header-link-qrcode:hover {
    color: #7f4d7f;
}
#google_translate_element {
    display: inline-block;
    margin-left: .5em;
}
/*==============================*/
/* ページロゴ */
#page-logo {
    margin: .75em;
}
#page-logo > div {
    display: inline-block;
    vertical-align: top;
}
#page-logo > div:last-child {
    padding-left: 1em;
}
@media screen and (max-width: 768px) {
    /* 表示領域が768px以下(スマホ)の場合に適用するスタイル */
    #page-logo > div:last-child {
        width: 100%;
    }
}
@media screen and (min-width: 769px) {
    /* 表示領域が769px以上(PC)の場合に適用するスタイル */
    #page-logo > div:last-child {
        width: calc(100% - 425px - 2em);
    }
}
/*==============================*/
/* ページコンテンツ */
#page-contents {
    margin: .75em;
}
#page-contents > div:first-child {
    width: 100%;
}
#main-contents {
    border-top: .25em solid #f9d998;
    border-bottom: .25em solid #f9d998;
    margin-top: .5em;
    padding: .25em;
}
.content {
    display: inline-block;
    vertical-align: top;
    width: 425px;
}
.content > ul {
    list-style-type: none;
    margin-top: 0;
    margin-bottom: 0;
    padding-left: 0;
    word-break: break-all;
    word-break: break-word;
}
h3 + ul {
    list-style-type: none;
}
pre {
    white-space: pre-wrap;
}
.horizontal-contents {
    margin-top: 1em;
    margin-bottom: 1em;
    max-height: 100%;
}
.horizontal-content {
    background: #fff;
    border: 1px solid #f9f998;
    border-radius: 8px;
    padding: 1em;
}
.horizontal-content * {
    max-height: 100%;
}

/*==============================*/
/* メニューアイコン */
#menu-tab {
    display: inline-block;
}
.menu-tab {
    display: inline-block;
    margin-right: .5em;
    padding: 0;
    height: 64px;
    width: 64px;
    position: relative;
}
.menu-tab:hover {
    opacity: .75;
}
.menu-tab.menu-tab-newdata:after {
    content: "新着";
    color: #fff;
    display: block;
    font-size: small;
    position: absolute;
    top: -10%;
    right: -16%;
    padding: 0 .5em;
    border-radius: .5em;
    background-color: #f00;
}
/*==============================*/
/* スマートフォン用画面で見るボタン */
#sp-induction {
    float: right;
}
#sp-induction-form {
    margin-right: .5em;
}
#sp-induction-form .ui-button-text {
    padding: 0.1em 0.5em;
}

/*==============================*/
/* SNSボタン */
#share-sns {
    float:right;
}
.share-sns {
    text-decoration: none;
}

/*==============================*/
/* お出かけスケジュール、友活・恋活・婚活 */
#form-menu {
    display: table;
    width: 100%;
}
#form-menu > div {
    display: table-cell;
    vertical-align: bottom;
}
#form-menu > div:last-child {
    text-align: right;
}

/*==============================*/
/* お父さん出番ですよ、いい場所みーつけた、子育て支援情報 */
.new-data:after {
    color: #fff;
    content: "新着";
    background-color: #f00;
    border-radius: 0.5em;
    display: inline-block;
    font-size: small;
    padding: 0px 0.5em;
}

/*==============================*/
/*入力フォーム*/
body,
input[type=text],
input[type=password],
input[type=url],
select,
datalist,
textarea,
pre {
    font-family: Helvetica,"游ゴシック","YuGothic","Hiragino Kaku Gothic ProN","Hiragino Kaku Gothic Pro","Meiryo UI","MS Pゴシック",sans-serif;
    font-size: 1em;
}
input[type=submit],
input[type=button],
button {
    font-family: Helvetica,"游ゴシック","YuGothic","Hiragino Kaku Gothic ProN","Hiragino Kaku Gothic Pro","Meiryo UI","MS Pゴシック",sans-serif;
}
datalist label {
    background: #98fb98;
    border: 1px solid #4d7f4d;
    color: #4d7f4d;
    cursor: pointer;
    padding: 1px;
}
label { text-align: left; }
.caution { font-size: .95em; }
textarea {
    ime-mode: active;
    width: 98%;
    height: 5em;
    padding: 0;
}
.txt, .domain { min-width: 565px; }
.date, .time { width: 100px; }
.login { width: 150px; }
.num { width: 60px; }
.txt { ime-mode: active; }
.domain, .login { ime-mode: inactive; }
.date, .time, .num { ime-mode: disabled; }
.edit-form input[type=text],
.edit-form input[type=url],
.edit-form textarea {
    width: 24em;
}
table p {
    margin: 0;
}
#detail-explanation {
    min-width: 425px;
    max-height: 100%;
    word-wrap: break-word;
}
.ie-datalist-option {
    /* datalist非対応IE用スタイル */
    display: none;
}
.indent {
    padding-left: 4em;
    text-indent: -4em;
}
.overflow {
    height: 25em;
    overflow: scroll;
    padding: .5em;
}
.overflow h3,
.overflow h4 {
    font-weight: normal;
    margin: 0;
}
.overflow dt {
    font-weight: normal;
}
.overflow p {
    margin: 0;
}
.overflow table + p {
    margin-top: 1em;
}
.overflow th {
    font-weight: normal;
    text-align: right;
    vertical-align: top;
    width: 3em;
}

/*==============================*/
/* 一覧での変更ボタン表示切り替え */
#list-edit-form {
    display: table;
    width: 100%;
}
#list-edit-form > form {
    display: table-cell;
    text-align: left;
}
#list-edit-form > div {
    display: table-cell;
    text-align: right;
}

/*==============================*/
/* jQuery UI */
.ui-widget-overlay { position: fixed; }
.ui-button { padding: 0 .5em; }
.ui-icon { display: inline-block; }
