@charset "UTF-8";
@media screen and (max-width: 769px) {
  a.button {
    padding: 10px;
  }
  a.commonbutton {
    display: block;
    width: 100%;
    padding: 15px 0;
    text-align: center;
  }
  img.size100 {
    width: 100%;
  }
  br.nwl {
    display: block;
  }
  br.wl {
    display: none;
  }
  section.commonbg_left {
    background-repeat: repeat;
  }
  section.commonbg_right {
    background-repeat: repeat;
  }
  .guide_container .guide_outer {
    margin: 5px 20px 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .guide_container .guide_right {
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    width: 100%;
  }
  .guide_container .guide_assistarea {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
  }
  .guide_languagearea {
    white-space: nowrap;
  }
  .guide_languagearea .assist_language {
    text-align: left;
  }
  .assist_container .assist_outer {
    margin: 0 20px;
  }
  .assist_container .assist_inner {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .assist_container .assist_fontsize {
    margin: 15px 0;
  }
  header .headerinner {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  header h1 {
    margin: 0;
  }
  header h1 a {
    width: 100%;
    /* 表示画像の高さ ÷ 表示画像の幅 × 100 */
    height: 0;
    padding-top: 16.71%;
    background-image: url(../../img/header/logosp.png);
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
  }
  header nav {
    width: 100%;
    margin-top: 20px;
  }
  header ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: stretch;
        -ms-flex-align: stretch;
            align-items: stretch;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
  header ul li {
    width: calc(50% - 4px);
    min-height: 60px;
    margin: 2px;
  }
  header .whitecolor .gnav_item1 .selected, header .whitecolor .gnav_item2 .selected,
  header .whitecolor .gnav_item3 .selected, header .whitecolor .gnav_item4 .selected,
  header .blackcolor .gnav_item1 .selected, header .blackcolor .gnav_item2 .selected,
  header .blackcolor .gnav_item3 .selected, header .blackcolor .gnav_item4 .selected {
    position: relative;
    background: none;
  }
  header .whitecolor .gnav_item1 .notselected, header .whitecolor .gnav_item2 .notselected,
  header .whitecolor .gnav_item3 .notselected, header .whitecolor .gnav_item4 .notselected,
  header .blackcolor .gnav_item1 .notselected, header .blackcolor .gnav_item2 .notselected,
  header .blackcolor .gnav_item3 .notselected, header .blackcolor .gnav_item4 .notselected {
    background-image: none;
  }
  header .whitecolor .gnav_item1 .notselected:hover, header .whitecolor .gnav_item2 .notselected:hover,
  header .whitecolor .gnav_item3 .notselected:hover, header .whitecolor .gnav_item4 .notselected:hover,
  header .blackcolor .gnav_item1 .notselected:hover, header .blackcolor .gnav_item2 .notselected:hover,
  header .blackcolor .gnav_item3 .notselected:hover, header .blackcolor .gnav_item4 .notselected:hover {
    background-image: none;
  }
  header .whitecolor .gnav_item1 .notselected:after, header .whitecolor .gnav_item2 .notselected:after,
  header .whitecolor .gnav_item3 .notselected:after, header .whitecolor .gnav_item4 .notselected:after,
  header .blackcolor .gnav_item1 .notselected:after, header .blackcolor .gnav_item2 .notselected:after,
  header .blackcolor .gnav_item3 .notselected:after, header .blackcolor .gnav_item4 .notselected:after {
    top: 50%;
    right: 10px;
    left: auto;
    margin-top: -14px;
  }
  header .whitecolor .gnav_item1 span, header .whitecolor .gnav_item2 span,
  header .whitecolor .gnav_item3 span, header .whitecolor .gnav_item4 span,
  header .blackcolor .gnav_item1 span, header .blackcolor .gnav_item2 span,
  header .blackcolor .gnav_item3 span, header .blackcolor .gnav_item4 span {
    position: absolute;
    display: inline-block;
    top: 50%;
    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%);
    padding-left: 10px;
  }
  .index_messageinner {
    margin: 0 20px;
  }
  .index_messageinner h2 {
    margin-bottom: 25px;
  }
  .index_messageinner p {
    margin-bottom: 15px;
  }
  .index_messageinner h3 {
    margin: 15px 0;
  }
  .index_messageinner h3 > img {
    display: none;
  }
  .index_messageinner h3 > span {
    display: block;
    font-size: 130%;
    font-weight: bold;
  }
  .index_messageinner h4 {
    margin: 15px 0;
    text-align: right;
  }
  .index_overviewinner .cityblock1 .leftcard, .index_overviewinner .cityblock1 .rightcard, .index_overviewinner .cityblock1 .uniformitycard,
  .index_overviewinner .cityblock2 .leftcard,
  .index_overviewinner .cityblock2 .rightcard,
  .index_overviewinner .cityblock2 .uniformitycard,
  .index_overviewinner .cityblock3 .leftcard,
  .index_overviewinner .cityblock3 .rightcard,
  .index_overviewinner .cityblock3 .uniformitycard {
    width: 100%;
  }
  .index_videoarea {
    padding: 10px;
  }
  .index_videoinner {
    padding: 10px;
  }
  .index_videoinner .leftcard {
    width: 100%;
  }
  .index_videoinner dd {
    margin: 0;
  }
  .pride_peaceinner .leftcard, .pride_peaceinner .rightcard {
    width: 100%;
  }
  .pride_regioninner .uniformitycard {
    width: 100%;
  }
  .pride_foodinner .leftcard {
    width: 100%;
  }
  .pride_foodinner .centercard {
    width: calc(50% - 5px);
    margin: 0 auto;
  }
  .pride_foodinner .rightcard {
    width: 100%;
  }
  .pride_foodinner .uniformitycard {
    width: 100%;
  }
  .pride_foodinner dl {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    margin: 20px 0;
  }
  .pride_foodinner dl dt {
    width: 100%;
    margin: 0;
  }
  .pride_foodinner dl dd {
    width: 100%;
    margin: 0;
  }
  .pride_sakeinner .leftcard, .pride_sakeinner .rightcard, .pride_sakeinner .leftcard2, .pride_sakeinner .rightcard2 {
    width: 100%;
  }
  .pride_sakeinner .sakeblock > div {
    width: 100%;
  }
  .pride_pioneerinner .flexboxblock {
    margin-bottom: 0;
  }
  .pride_pioneerinner .uniformitycard, .pride_pioneerinner .leftcard, .pride_pioneerinner .rightcard {
    width: 100%;
  }
  .pride_pioneerinner .rightcard > strong {
    margin-top: 20px;
  }
  .living_parentinginner .leftcard, .living_parentinginner .rightcard,
  .living_educationinner .leftcard,
  .living_educationinner .rightcard,
  .living_ao-reinner .leftcard,
  .living_ao-reinner .rightcard,
  .living_revivalinner .leftcard,
  .living_revivalinner .rightcard,
  .living_medicalinner .leftcard,
  .living_medicalinner .rightcard,
  .living_immigrationinner .leftcard,
  .living_immigrationinner .rightcard {
    width: 100%;
  }
  .future_innovationinner .leftcard1, .future_innovationinner .rightcard1, .future_innovationinner .leftcard2, .future_innovationinner .rightcard2, .future_innovationinner .leftcard3, .future_innovationinner .rightcard3 {
    width: 100%;
  }
  .future_ruralinner .leftcard, .future_ruralinner .rightcard,
  .future_resourceinner .leftcard,
  .future_resourceinner .rightcard {
    width: 100%;
  }
  .pickup_listinner ul li {
    width: 100%;
    margin: 0 0 25px;
  }
  .pickup_listinner ul:after {
    display: none;
  }
}