@charset "UTF-8";

/* ----- タブレット用の表示設定 -------------------------------- */
@media (max-width: 800px) {
    
    /* ----- 共通項目の設定内容（common.css）------------------------ */
     .container {
        padding: 0 15px;
    }
    /* ---------------------------------------------------------- */
    
    /* ----- ヘッダーの設定内容（common.css）------------------------ */
    .header-right a {
        font-size: 13px;
    }
    /* ---------------------------------------------------------- */
    
    /* ----- メインタイトルの背景画像設定内容（index.css）------------- */
    .top-visual {
        height: 380px;
        width: 720px;
        margin-left: auto;
        margin-right: auto;
    }
    
    .top-logo {
        height: 100px;          /* イメージの高さ指定 */
        margin-bottom: 70px;    /* 下側の余白 */
    }
    
    .top-subtitle {
        font-size: 22px;        /* 文字の大きさ */
        margin-bottom: 5px;     /* 下側の余白 */
    }

    .top-text {
        font-size: 15px;        /* 文字の大きさ */
    }
    /* ---------------------------------------------------------- */
    
    /* ----- フッターの設定内容 （common.css）----------------------- */
    footer {
        font-size: 15px;
    }
    /* ---------------------------------------------------------- */
}
/* ------------------------------- */

/* 「 スマートフォン用の表示設定 」 */
@media (max-width: 630px) {
    
    /* ----- 共通項目の設定内容（common.css）------------------------ */
    .container {
        /* max-width: 375px; */
        padding: 0 15px;
    }
    /* ---------------------------------------------------------- */
    
    /* ----- ヘッダーの設定内容（common.css）------------------------ */
    /*
    .header-left {
        display: none;
    }
    
    .header-right {
        float: none;
        text-align: center;
    }
    
    .header-right a {
        font-size: 13px;
    }
    */
    
    .symbol-mark {
        display: block;
    }
    
    .header-logo {
        display: none;
    }
    
    .header-icon {
        display: none;
    }
    /* ---------------------------------------------------------- */
    
    /* ----- パンくずリスト設定内容（common.css）-------------------- */
    .breadcrumb {
        font-size: 12px;
        margin: 0 0 20px;
    }
    
    .breadcrumb li::after {
        margin: 0 4px;
    }
    
    /* ---------------------------------------------------------- */
    
    /* ----- メインタイトルの背景画像設定内容（index.css）------------- */
    .top-visual {
        height: 240px;
        width: 100%;
        margin-bottom: 100px;
    }
    
    .top-logo {
        height: 100px;
        margin-top: 60px;
        margin-bottom: 80px;
    }
    
    .top-subtitle {
        font-size: 18px;
    }
    
    .top-text {
        font-size: 13px;
    }
    /* ------------------------------------------------------- */
    
    /* ---▽▽▽ （メインMAP）新着・更新情報表示の設定（index.css）▽▽▽--- */
    .new-information-title {
        width: 343px;
    }
    
    .new-information-title h3 {
        width: 140px;
        font-size: 16px;
        padding-top: 7px;
        background-size: cover;
    }
    
    .new-information-title img {
        width: 158px;
        margin-top: 2px;
    }
    
    .new-info-top {
        width: 343px;
        margin-bottom: 50px;
    }
    
    .new-information {
        width: 343px;
        font-size: 12px;
    }
    
    .new-information td {
        padding: 3px 4px;
    }
    /* ---△△△ （メインMAP）新着・更新情報表示の設定（index.css）△△△--- */
    
    /* ---▽▽▽ メインMAP表示の設定内容 （index.css）▽▽▽------------ */
    .top {
        margin-bottom: 50px;
    }
    
    .top h2 {
        font-size: 16px;
    }
    
    .top-map {
        height: 345px;
        width: 345px;
    }
    
    .top-map a {
        font-size: 14px;
    }
    
    .text-hokkaido {
        top: 10px;
        left: 10px;
    }

    .text-tohoku {
        top: 30px;
        left: 10px;
    }

    .text-kanto {
        top: 50px;
        left: 10px;
    }

    .text-chubu {
        top: 70px;
        left: 10px;
    }

    .text-kinki {
        top: 90px;
        left: 10px;
    }

    .text-chugoku {
        top: 70px;
        left: 260px;
    }

    .text-shikoku {
        top: 90px;
        left: 260px;
    }

    .text-kyushu {
        top: 110px;
        left: 260px;
    }
    
    .top-select-area {
        font-size: 14px;
    }
    /* ---△△△ メインMAP表示の設定内容 （index.css）△△△------------ */
    
    /* --▽▽▽ エリアリストと累計の表示設定 ▽▽▽-- */
    .area-map-list-top {
        width: 345px;
        flex-direction: column;
        margin: 0 auto 50px;
    }
    
    .area-map-list {
        margin: 0 auto 50px;
    }
    /* --△△△ エリアリストと累計の表示設定 △△△-- */
    
    /* --▽▽▽ 作者プロフィールの表示設定 ▽▽▽-- */
    .my-profile {
        width: 323px;
        font-size: 14px;
    }
    /* --△△△ 作者プロフィールの表示設定 △△△-- */
    
    /* ---▽▽▽ バナー広告の表示の設定内容 （common.css）▽▽▽--------- */
    .advt-space-type1 {
        width: 347px;
        margin: 0 auto 50px;
    }
    
    .advt-space-type2 {
        width: 345px;
        flex-direction: column;
        margin: 0 auto 20px;
    }
    
    .advt-space-type3 {
        width: 345px;
    }
    
    .Ads-space-type1 {
        width: 347px;
    }
    
    .Ads-space-type2 {
        width: 347px;
        flex-direction: column;
    }
    
    /* --- PC表示 --> スマホ消し --- */
    .advt-space-display {
        display: none;
    }
    
    /* --- PC消し --> スマホ表示 --- */
    .advt-space-none {
        display: block;
        width: 347px;
        margin: 0 auto 50px;
    }
    
    .advt-st-top {
        float: none;
    }
    
    /* --- バナー表示（200幅）--- */
    .advt-sp-s200x200 {
        margin: 0 auto;
    }
    
    /* --- PC表示 --> スマホ消し（200幅）--- */
    .advt-sp-s200x200-dn {
        display: none;
    }
    
    /* --- PC表示 --> スマホ消し（234幅）--- */
    .advt-sp-s234x60-dn {
        display: none;
    }
    
    /* --- バナー表示（260幅）--- */
    .advt-sp-s260w {
        margin: 0 auto;
    }
    
    /* --- PC消し --> スマホ表示（300幅） --- */
    .advt-sp-s300x50-nd {
        display: block;
        margin: 0 auto 30px;
    }

    /* --- PC消し --> スマホ表示（300幅） --- */
    .advt-sp-s300x160-nd {
        display: block;
        margin: 0 auto;
    }
    
    /* --- バナー表示（300幅）--- */
    .advt-sp-s300x250 {
        margin: 0 auto;
    }
    
    /* --- PC消し --> スマホ表示（300幅） --- */
    .advt-sp-s300x250-nd {
        display: block;
        margin: 0 auto;
    }
    
    /* --- PC消し --> スマホ表示（320幅） --- */
    .advt-sp-s320x50-nd {
        display: block;
        margin: 0 auto 30px;
    }
    
    /* --- PC消し --> スマホ表示（350幅）--- */
    .advt-sp-s350x80-nd {
        display: block;
        margin: 0 auto;
    }
    
    /* --- PC表示 --> スマホ消し（468幅）--- */
    .advt-sp-s468x60-dn {
        display: none;
    }
    
    /* --- PC表示 --> スマホ消し（660幅）--- */
    .advt-sp-s660x220-dn {
        display: none;
    }
    
    /* --- PC表示 --> スマホ消し（728幅）--- */
    .advt-sp-s728x90-dn {
        display: none;
    }
    
    /* --- PC表示 --> スマホ消し（728幅）--- */
    .advt-sp-s728x200-dn {
        display: none;
    }
    
    /* --- テキスト表示（468幅） --- */
    .advt-sp-t468w {
        width: 100%;
        font-size: 14px;
    }
    
    /* --- テキスト表示（660幅） --- */
    .advt-sp-t660w {
        width: 300px;
        font-size: 14px;
    }
        
    /* --- PC表示 --> スマホ消し --- */
    .Ads-display-no {
        display: none;
    }
    
    /* --- PC消し --> スマホ表示 --- */
    .Ads-none-dy {
        display: block;
        margin: 0 auto;
    }
    
    /* --- バナー表示（300x250）--- */
    .Ads-300x250 {
        margin: 0 auto;
    }
    
    /* --- バナー表示（320x100）--- */
    .Ads-320x100 {
        /*
        width: 320px;
        height: 100px;
        background-color: white;
        */
        display: block;
        margin: 0 auto;
    }
    
    /* --- バナー表示（横長レスポンシブ）--- */
    .Ads-res-wide {
        width: 345px;
    }
    
    /* ---△△△ バナー広告の表示の設定内容 （common.css）△△△--------- */
    
    /* ---▽▽▽ 複数ページの表示設定内容 （common.css）▽▽▽----------- */
    .subpage-no-list {
        width: 340px;
    }
    
    /* ---▽▽▽ ページトップ表示の設定内容 （common.css）▽▽▽--------- */
    .goto-top {
        font-size: 14px;
    }
    
    /* ---▽▽▽ フッターの設定内容 （common.css）▽▽▽--------------- */
    footer {
        padding-top: 10px;
        font-size: 13px;
    }
    
    .footer-right {
        padding-top: 20px;
    }
    /* -------------------------------------------------------- */

    /* ---▽▽▽ お問い合わせフォーム表示の設定内容（contact.css）▽▽▽--- */
    .contact-form {
        width: 345px;
        font-size: 13px;
    }
    
    .contact-form h2 {
        font-size: 22px;
        text-align: center;
    }
    
    .formTable th {
        width: 105px;
        padding: 0 0.5em;
    }
    
    .must {
        font-size: 11px;
    }
    
    .sub-name {
        font-size: 11px;
    }
    
    input[type="text"] {
        width: 15.4em;
    }
    
    textarea {
        width: 15em;
    }
    /* -------------------------------------------------------- */

    /* ---▽▽▽ お問い合わせフォーム表示の設定内容（form.css）▽▽▽------ */
    #wrapper {
        width: 355px;
    }
    
    #main {
        padding: 10px;
    }
    
    .section__body {
        padding: 0px;
    }
    
    .table th {
        padding: 10px 5px;
    }
    
    .table td {
        padding: 10px 5px;
    }
    
    input[type=text] {
        width : 200px ;
    }
    
    textarea {
        width : 200px ;
    }
}