@charset "UTF-8";
/* =====================
  Main Visual
==================== */

.mv {
    overflow: hidden;
}

/* Slide */

.mv-slide {
    position: relative;
    z-index: 1;
}

.mv-slide .img01::after {
    content: "";
    -webkit-background-size: contain;
    -o-background-size: contain;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url("../img/top/mv/text@2x.png");
    max-width: 291px;
    max-height: 116px;
    width: 38.8vw;
    height: 15.47vw;
    display: block;
    position: absolute;
    top: 50%;
    left: 3.87vw;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: 16;
    display: none;
}

.mv .swiper-slide {
    width: 100vw;
    height: 41.6vw;
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-position: center;
}

.mv .img01 {
    background-image: url("../img/top/mv/01@2x.png");
}

.mv .img02 {
    background-image: url("../img/top/mv/02@2x.png");
}

.mv .img03 {
    background-image: url("../img/top/mv/03@2x.png");
}

.mv .img03-2 {
    background-image: url("../img/top/mv/03-2@2x.png");
}

.mv .img04 {
    background-image: url("../img/top/mv/04@2x.png");
}

.mv .img04-2 {
    background-image: url("../img/top/mv/04-2@2x.png");
}

.mv .img05 {
    background-image: url("../img/top/mv/05@2x.png");
}

.mv .img06 {
    background-image: url("../img/top/mv/06@2x.png");
}

.mv .img07 {
    background-image: url("../img/top/mv/07@2x.jpg");
}

.mv .img08 {
    background-image: url("../img/top/mv/08@2x.png");
}

.mv .img09 {
    background-image: url("../img/top/mv/09@2x.png");
}

.mv .img10 {
    background-image: url("../img/top/mv/10@2x.png");
}

.mv .img11 {
    background-image: url("../img/top/mv/11@2x.png");
}

.mv .img12 {
    background-image: url("../img/top/mv/12@2x.png");
}

.mv .img13 {
    background-image: url("../img/top/mv/13@2x.png");
}

.mv .img14 {
    background-image: url("../img/top/mv/14@2x.png");
    background-size: contain;
}

.mv .img14-2 {
    background-image: url("../img/top/mv/14@2x.png");
}

.mv .img15 {
    background-image: url("../img/top/mv/15@2x.png");
}

.mv .img200 {
    background-image: url("../img/top/mv/200@2x.png");
}

.mv .img201 {
    background-image: url("../img/top/mv/201@2x.png");
}

.mv .img202 {
    background-image: url("../img/top/mv/202@2x.png");
}

.mv .img203 {
    background-image: url("../img/top/mv/203@2x.png");
}

.mv .img204 {
    background-image: url("../img/top/mv/204@2x.jpg");
}

.mv .img205 {
    background-image: url("../img/top/mv/205@2x.jpg");
}

.mv .img14-2 span {
    display: none;
}

.mv .img203 span {
    display: none;
}

.mv .swiper-slide a {
    display: block;
    width: 100%;
    height: 100%;
}

/* text */

.mv .text {
    padding-top: 4.4vw;
    padding-bottom: 4.4vw;
    color: #4d4e4e;
    z-index: 2;
    font-size: 3.33vw;
    pointer-events: auto;
    line-height: 1.5;
    text-align: center;
}

/* swiper-controller */

.mv .swiper-controller {
    display: none;
}

/* swiper-pages */

.mv-wrap .swiper-pages {
    text-align: center;
    z-index: 4;
    position: absolute;
    left: 50%;
    top: calc(41.6vw - 3.6vw - 3vw);
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 100%;
}

.mv-wrap .swiper-pagination-bullet {
    cursor: pointer;
    opacity: 1;
    cursor: pointer;
    pointer-events: auto;
    width: 3.6vw;
    height: 3.6vw;
    background: #c1c1c1;
    margin: 0 calc( 3.87vw / 2);
}

.mv-wrap .swiper-pagination-bullet.swiper-pagination-bullet-active {
    pointer-events: none;
    background: #686664;
}

/* =====================
  unit01
==================== */

.unit01 .unit {
    padding-top: 6.13vw;
    padding-bottom: 4.93vw;
    padding-left: 4vw;
    padding-right: 4vw;
    background: #485266;
}

.unit01 .unit.map {
    background: #fff;
    padding-left: 2vw;
    padding-right: 2vw;
}

.unit01 .unit .headstyle {
    text-align: center;
    font-size: 7.72vw;
    line-height: 1;
    font-weight: bold;
    color: rgba(255, 255, 255, 0.639);
    text-align: center;
}

/* item01 */

.unit01 .item01 {
    padding-top: 6.13vw;
}

.unit01 .item01 .head {
    border-top: 2px solid #fff;
    border-bottom: 2px solid #fff;
    color: #fff;
    font-weight: bold;
    font-size: 3.75vw;
    text-align: center;
    padding: 1.4vw 0;
}

.unit01 .item01 .head::before {
    vertical-align: -4px;
    margin-right: 0.5em;
}

.unit01 .item01 .body {
    /* padding-top: 5.07vw; */
}

.unit01 .item02 {
    display: none;
}

/* =====================
  Map UI
==================== */

/*
  Pref list button
--------------------- */

.pref-unit.df {
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    display: none;
}

.pref-unit .list-item {
    width: calc(50% - 1.07vw);
}

.pref-unit .list-item > button.checked {
    opacity: 0.7;
}

.pref-unit .list-item > button {
    background: #fff;
    color: #545a5f;
    padding: 1.4vw 0;
    font-size: 3.75vw;
    width: 100%;
    font-weight: bold;
}

/*
  Area Check
--------------------- */

.area-check {
    margin-top: 5.6vw;
}

.area-check button[data-count="0"] {
    pointer-events: none;
    opacity: 0.7 !important;
}

.area-check.hide {
    display: none;
}

.area-check--unit + .area-check--unit {
    margin-top: 3.73vw;
}

/* color */

.area-check--unit .area-check--unit-pref button {
    color: #545a5f;
}

.area-check--unit[data-id="pref_1"] .area-check--unit-pref {
    background: #c1eacc;
}

.area-check--unit[data-id="pref_1"] .area-check--unit-area button {
    color: #4a8168;
}

.area-check--unit[data-id="pref_2"] .area-check--unit-pref {
    background: #dbe7f2;
}

.area-check--unit[data-id="pref_2"] .area-check--unit-area button {
    color: #0d69aa;
}

/* item */

.area-check--unit button {
    width: 100%;
    display: block;
    padding: 1.5vw 0;
}

.area-check--unit button.psuedo span::before {
    content: "";
    width: 3.73vw;
    height: 3.73vw;
    -webkit-background-size: contain;
    -o-background-size: contain;
    background-size: contain;
    display: inline-block;
    margin-right: 0.5em;
    vertical-align: -1.9px;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAcCAYAAAByDd+UAAAAQklEQVRIie3WsQ0AIRADweVFy3dFXNMQUQIgXuvI2ciZW0QMDuY7iQH0VapqK5SZwIWFgoKCgoKCgoKCL4Dt9897ApbsB/WBBUGzAAAAAElFTkSuQmCC");
}

.area-check--unit button.psuedo.checked span::before {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAcCAYAAAByDd+UAAABuElEQVRIie3WTasxcRjH8e9weCFKSspGkcVQRIlkwcZDU14DL8JrmKQkbJSy4x2QUrJRkmRn7WGMuRd3c+o0xo3uc+6HzrWa/v/59en6X82DUKlUNL6wLF+JAbzpF7Va7VOharUK/IEOv8G/F7xer3S7XSaTyd373u7uPoG1221msxnT6RRVVfH7/Z8DqqpKq9ViPp8DoGkavV4PVVUJBoO/F1RVlWazyWKx+LCuaRr7/f5m5u4Md7sd4/H45p6iKDQaDQMGEAqFSKVSN3OmHW63W2RZ5nA4oCjKh+PRseVyachFIhHi8bhpEzfBzWaDLMscj0cA+v0+l8sFURQ5n8/U63VWq5UhF4vFiEajppgpOBqN3jH4OZPBYMDpdGK5XLJerw2ZRCJBOBy+i4HJDAuFAg6Hw7A+HA4NmCAIJJPJhzBT0G63Uy6XcTqdd8OCIJBOpxFF8SHMFASw2WxIkoTL5TLFMpnMzWftJVBHS6WSAbVYLGSzWQKBwFPYL0EdlSQJt9v9juVyOXw+39MYPPimsVqtFItFOp0OHo8Hr9f7EvYwqKP5fP5lSK9/93v4Deol/Pd/3j8Agbegh3Z+hVMAAAAASUVORK5CYII=");
}

.area-check--unit-area > button {
    width: 50%;
    background: #fff;
    font-size: 3.75vw;
    font-weight: bold;
    border-top: 1px dashed #626262;
    padding-left: 4.4vw;
    padding-right: 4.4vw;
}

.area-check--unit-area > button.checked {
    background: #faf153;
}

.area-check--unit-area > button:nth-child(1),
.area-check--unit-area > button:nth-child(1) + button {
    border-top: none;
}

.area-check--unit-area > button:nth-child( 2n - 1) {
    border-right: 1px dashed #626262;
}

.area-check--unit-pref {
    width: 100%;
    color: #545a5f;
    cursor: pointer;
    font-size: 3.75vw;
    text-align: center;
    font-weight: bold;
}

.area-check--unit-area {
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    justify-content: space-between;
}

/*
  Area Unit
--------------------- */

.area-unit {
    /* margin-top: 4.53vw; */
    width: 100%;
    border: 2px solid #fff;
}

.area-unit button[data-count="0"] {
    pointer-events: none;
    opacity: 0.7 !important;
}

.area-unit.hide {
    display: none;
}

.area-unit--head button {
    width: 100%;
    display: block;
    position: relative;
    font-weight: bold;
    color: #fff;
    font-size: 3.75vw;
    padding: 1.4vw 0;
}

.area-unit--head button::after {
    content: "▼";
    position: absolute;
    top: 50%;
    right: 2vw;
    color: #fff;
    font-size: 2.2vw;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

/* body */

.area-unit--body {
    padding: 1.47vw 3.07vw;
    border-top: 2px dashed #fff;
}

.area-unit--body.hide {
    display: none;
}

/* SVG */

.area-unit--body svg {
    position: relative;
    width: 100%;
    height: 69.2vw;
    z-index: 3;
}

.area-unit--body svg .state-pref.hide,
.area-unit--body svg .state-area.hide {
    display: none;
}

.area-unit--body svg .state-pref {
    z-index: 5;
}

.area-unit--body svg .state-area {
    z-index: 6;
}

.area-unit--body path {
    outline-style: none;
    cursor: pointer;
    pointer-events: auto;
    -webkit-transition: fill 250ms ease 0s;
    -moz-transition: fill 250ms ease 0s;
    -ms-transition: fill 250ms ease 0s;
    -o-transition: fill 250ms ease 0s;
    transition: fill 250ms ease 0s;
}

.area-unit--body path[data-count="0"] {
    pointer-events: none;
}

/* color */

.area-unit--body .fills[data-id="pref_1"] path {
    fill: #c2eacd;
}

.area-unit--body .fills[data-id="pref_2"] path {
    fill: #dbe7f1;
}

.area-unit--body .text-item[data-id="pref_1"] {
    background: #45a85e;
}

.area-unit--body .text-item[data-id="pref_2"] {
    background: #008ef2;
}

.area-unit--body .fills[data-id="pref_1"] path.checked,
.area-unit--body .fills[data-id="pref_2"] path.checked {
    fill: #faf153 !important;
    opacity: 1 !important;
}

.area-unit--body path.disable {
    pointer-events: none;
}

.area-unit--body .fills[data-id="pref_2"] path.disable.checked {
    fill: #dbe7f1 !important;
}

.area-unit--body svg .fills[data-id="pref_1"] .state-area {
    -webkit-transform: translateY(211px);
    -moz-transform: translateY(211px);
    -ms-transform: translateY(211px);
    -o-transform: translateY(211px);
    transform: translateY(211px);
}

.area-unit--body svg .fills[data-id="pref_2"] .state-area {
    -webkit-transform: translateX(181px);
    -moz-transform: translateX(181px);
    -ms-transform: translateX(181px);
    -o-transform: translateX(181px);
    transform: translateX(181px);
}

/* text */

.area-unit--body .text {
    color: #fff;
    font-size: 3vw;
    font-weight: bold;
    pointer-events: none;
}

.area-unit--body .text-item {
    width: 20.4vw;
    height: 6vw;
    display: inline-flex;
    -webkit-align-items: center;
    align-items: center;
    padding: 0 0.75em;
}

.area-unit--body .text-item[data-id="pref_1"] {
    position: absolute;
    bottom: 27.9vw;
    left: 3vw;
}

.area-unit--body .text-item[data-id="pref_2"] {
    position: absolute;
    bottom: 32vw;
    right: 12vw;
    -webkit-justify-content: flex-end;
    justify-content: flex-end;
}

/* map text */

.map02-text {
    z-index: 5;
    font-size: 3vw;
    pointer-events: none;
}

.map02-text span {
    line-height: 1;
    position: absolute;
    z-index: 5;
    font-weight: bold;
    pointer-events: none;
}

.map02-text span[data-id="pref_1"] {
    color: #4a8168;
}

.map02-text span[data-id="pref_2"] {
    color: #0d69aa;
}

.map02-text1 {
    top: 36.5vw;
    left: 33.7vw;
}

.map02-text2 {
    top: 49.1vw;
    left: 29.2vw;
}

.map02-text3 {
    top: 44vw;
    left: 17.7vw;
}

.map02-text4 {
    top: 60vw;
    left: 12vw;
}

/* 下越 */

.map02-text5 {
    left: 67vw;
    top: 21vw;
}

/* 中越 */

.map02-text6 {
    left: 54vw;
    top: 24vw;
}

/* 魚沼 */

.map02-text7 {
    left: 49.6vw;
    top: 33.4vw;
}

/* 上越 */

.map02-text8 {
    left: 36vw;
    top: 28vw;
}

.map02-text9 {
    left: 24.5vw;
    top: 51.7vw;
    writing-mode: vertical-rl;
}

/*
  Type Check
--------------------- */

.button-type--unit {
    margin-top: 5.5vw;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
}

.button-type--unit.hide {
    display: none;
}

.button-type--unit .list-item {
    width: 50% !important;
}

.button-type--unit .list-item:nth-child(2n + 1) button {
    border-right: 1px dashed transparent;
}

.button-type--unit .list-item:first-child button {
    border-right: 1px dashed #626262;
}

.button-type--unit .list-item:nth-child(n + 3) {
    margin-top: 2.53vw;
}

.button-type--unit .list-item button {
    width: 100%;
    position: relative;
    display: block;
    color: #545a5f;
    text-align: center;
    font-size: 3.76vw;
    background: #FFF;
    font-weight: bold;
    padding: 1.5vw 2.8vw 1.5vw 7.6vw;
}

.button-type--unit .list-item button.checked {
    background: #faf153;
}

.button-type--unit button.psuedo > span::before {
    content: "";
    width: 3.73vw;
    height: 3.73vw;
    -webkit-background-size: contain;
    -o-background-size: contain;
    background-size: contain;
    display: inline-block;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAcCAYAAAByDd+UAAAAQklEQVRIie3WsQ0AIRADweVFy3dFXNMQUQIgXuvI2ciZW0QMDuY7iQH0VapqK5SZwIWFgoKCgoKCgoKCL4Dt9897ApbsB/WBBUGzAAAAAElFTkSuQmCC");
    position: absolute;
    top: 50%;
    left: 5.3vw;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

.button-type--unit button.psuedo.checked span::before {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAcCAYAAAByDd+UAAABuElEQVRIie3WTasxcRjH8e9weCFKSspGkcVQRIlkwcZDU14DL8JrmKQkbJSy4x2QUrJRkmRn7WGMuRd3c+o0xo3uc+6HzrWa/v/59en6X82DUKlUNL6wLF+JAbzpF7Va7VOharUK/IEOv8G/F7xer3S7XSaTyd373u7uPoG1221msxnT6RRVVfH7/Z8DqqpKq9ViPp8DoGkavV4PVVUJBoO/F1RVlWazyWKx+LCuaRr7/f5m5u4Md7sd4/H45p6iKDQaDQMGEAqFSKVSN3OmHW63W2RZ5nA4oCjKh+PRseVyachFIhHi8bhpEzfBzWaDLMscj0cA+v0+l8sFURQ5n8/U63VWq5UhF4vFiEajppgpOBqN3jH4OZPBYMDpdGK5XLJerw2ZRCJBOBy+i4HJDAuFAg6Hw7A+HA4NmCAIJJPJhzBT0G63Uy6XcTqdd8OCIJBOpxFF8SHMFASw2WxIkoTL5TLFMpnMzWftJVBHS6WSAbVYLGSzWQKBwFPYL0EdlSQJt9v9juVyOXw+39MYPPimsVqtFItFOp0OHo8Hr9f7EvYwqKP5fP5lSK9/93v4Deol/Pd/3j8Agbegh3Z+hVMAAAAASUVORK5CYII=");
}

/*
  Button single
--------------------- */

.button-single {
    margin-top: 2.93vw;
}

.button-single.hide {
    display: none;
}

.button-single button {
    background: #fff;
    color: #545a5f;
    padding: 1.9vw 0;
    font-size: 3.75vw;
    width: 100%;
    font-weight: bold;
}

.button-single button[data-state="area"] .type {
    /* display: none; */
}

.button-single button[data-state="type"] .area {
    /* display: none; */
}

/*
  Map submit button
--------------------- */

.map-submit {
    margin-top: 2.93vw;
}

.map-submit > button {
    background: #faf153;
    color: #707b85;
    padding: 2.5vw 0;
    font-weight: bold;
    font-size: 3.75vw;
    width: 100%;
}

.map-submit .small button {
    color: #fff;
    margin-top: 1.9vw;
    font-weight: normal;
    font-size: 3vw;
    padding-left: 0.25em;
    padding-right: 0.25em;
}

.map-submit .small button::before {
    margin-right: 1vw;
    vertical-align: 0px;
}

/* =====================
  unit02
==================== */

.unit02 {
    padding-top: 6.27vw;
    padding-bottom: 8.4vw;
}

.unit02 .headstyle {
    position: relative;
}

.unit02 .unit02-01 {
    padding-left: 4vw;
    padding-right: 4vw;
}

.unit02 .headstyle h2 {
    color: #5b5b5b;
    font-size: 7.72vw;
    font-weight: bold;
    padding-right: 28.9vw;
}

.unit02 .headstyle a {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    right: 0;
    background: #a7b1b2;
    -webkit-border-radius: 50rem;
    border-radius: 50rem;
    font-size: 3.59vw;
    color: #fff;
    padding: 1.15vw 5.97vw;
}

.unit02 .headstyle a::after {
    content: "▶";
    position: absolute;
    right: 2.4vw;
    font-size: 2.5vw;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

/* .unit02-01 */

.unit02-01 .body {
    font-size: 3.41vw;
}

.unit02-01 .body ul {
    margin-top: 1.25em;
    margin-left: auto;
    margin-right: auto;
    /* max-height: 87.3vw; */
    /* overflow-y: auto; */
}

.unit02-01 .body li {
    color: #363636;
}

.unit02-01 .body li > span + a {
    text-decoration: underline;
}

.unit02-01 .body li > span + a,
.unit02-01 .body li > span + span {
    color: #363636;
    display: block;
    margin-top: 0.25em;
}

.unit02-01 .body li > span {
    color: #5d5d5d;
}

.unit02-01 .body li > span + span {
    display: block;
}

.unit02-01 .body li + li {
    margin-top: 1em;
}

/* .unit02-02 */

.unit02-02 {
    margin-top: 13.87vw;
    overflow: hidden;
}

.unit02-02 .headstyle h2 {
    text-align: center;
    padding-right: 0;
}

.unit02-02-swiper {
    margin-top: 5.07vw;
    padding-left: 10.93vw;
    padding-right: 10.93vw;
    margin-left: auto;
    margin-right: auto;
}

/* swiper-controller */

.unit02-02 .swiper-controller {
    pointer-events: none;
    position: absolute;
    width: 100%;
    top: 50%;
    left: 50%;
    position: absolute;
    z-index: 3;
    height: 6.4vw;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.unit02-02 .swiper-controller button {
    pointer-events: auto;
    width: 6.4vw;
    height: 6.4vw;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    background: rgba(104, 102, 100, 0.7);
    -webkit-transition: opacity 250ms ease 0s;
    -moz-transition: opacity 250ms ease 0s;
    -ms-transition: opacity 250ms ease 0s;
    -o-transition: opacity 250ms ease 0s;
    transition: opacity 250ms ease 0s;
    position: absolute;
    top: 0;
}

.unit02-02 .swiper-controller button.swiper-button-disabled {
    opacity: 0.5;
    pointer-events: none;
}

.unit02-02 .swiper-controller button.prev {
    left: 2.67vw;
}

.unit02-02 .swiper-controller button.next {
    right: 2.67vw;
}

.unit02-02 .swiper-controller button::before {
    content: "";
    width: 2.93vw;
    height: 2.93vw;
    border-top: 2px solid #fff;
    border-left: 2px solid #fff;
    position: absolute;
    top: 50%;
    left: 50%;
}

.unit02-02 .swiper-controller button.prev::before {
    -webkit-transform: translate(-30%, -50%) rotate(-45deg);
    -moz-transform: translate(-30%, -50%) rotate(-45deg);
    -ms-transform: translate(-30%, -50%) rotate(-45deg);
    -o-transform: translate(-30%, -50%) rotate(-45deg);
    transform: translate(-30%, -50%) rotate(-45deg);
}

.unit02-02 .swiper-controller button.next::before {
    -webkit-transform: translate(-70%, -50%) rotate(135deg);
    -moz-transform: translate(-70%, -50%) rotate(135deg);
    -ms-transform: translate(-70%, -50%) rotate(135deg);
    -o-transform: translate(-70%, -50%) rotate(135deg);
    transform: translate(-70%, -50%) rotate(135deg);
}


/* .unit02-03 */

.unit02-03 {
    text-align: center;
    display: flex;
    -ms-align-items: center;
    align-items: center;
    justify-content: center;
    margin-top: 0;
}



.js-prefButtonSP.checked {
    background: #faf153 !important;
    opacity: 1 !important;
}

.js-btnSingleToggle.hide {
    display: none;
}


.top-area {
    width: 100%;
    margin: 0 auto;
}

.top-area .area-map img {
    width: 100%;
}


.top-area .area-con {
    width: 100%;
    font-size: 14px;
}

.top-box h3 {
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 1em;
    width: 100%;
    margin: 0 auto 1em auto;
}

.top-area .area-con .search-panel-area {
    border-top: 1px solid #ccc;
    margin-top: 1em;
    padding-top: 1em;
}

.top-area .area-con .search-panel-area .m-area {
    margin-bottom: 0.5em;
}

.top-area .area-con .search-panel-area .search-panel-city {
    width: 45%;
    display: inline-block;
}


.map {
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0;
    padding-right: 0;
    width: 94%;
    margin: 0 auto 0 auto;
    height: 600px;
}

#map-prop-list {
    position: relative;
    height: 500px;
    width: 100%;
}

.map h2 {
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 1em;
}

.top-box {
    width: 94%;
    margin: 2em auto 0 auto;
}

.top-box h2 {
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 1em;
}

.top-box button {
    width: 250px;
    margin: 2em auto 0 auto;
    background-color: #83a2d9;
    display: block;
    color: #fff;
    padding: 0.3em;
    text-align: center;
}

.tabs {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 5em;
}

.tab_label {
    color: #666;
    font-weight: bold;
    border: solid 2px #666;
    position: relative;
    z-index: 1;
    cursor: pointer;
    flex: 1;
    padding: 5px 0;
    text-align: center;
}

.tab_label:hover {
    opacity: 0.75;
}

.tab_content {
    flex: 100%;
    display: none;
    overflow: hidden;
}

input[name="tab_switch"] {
    display: none;
}

.tabs input:checked + .tab_label {
    color: #fff;
    background-color: #666;
    text-align: center;
}

.tabs input:checked + .tab_label::after {
    content: '';
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 10px 0 10px;
    border-color: #666 transparent transparent transparent;
    display: block;
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -10px;
    transition: all 0.3s ease 0s;
}

#tab01:checked ~ #tab01_content,
#tab02:checked ~ #tab02_content,
#tab03:checked ~ #tab03_content {
    display: block;
}

.tab_content {
    position: relative;
    animation: fadeIn 1s ease;
    margin-top: 2em;
}


.map-pop {
    padding: 0px 10px 8px;
    color: #404040;
    max-width: 280px;
}

.map-pop .name {
    font-weight: bold;
    font-size: 18px;
}

.map-pop .address {
    font-size: 15px;
}

.map-pop .ref {
    color: #0d69aa;
    padding-top: 0.5em;
}

.map-pop .ref a:first-child {
    display: block;
    position: relative;
    background: #0d69aa;
    display: inline-flex;
    -webkit-align-items: center;
    align-items: center;
    white-space: nowrap;
    -webkit-justify-content: center;
    justify-content: center;
    color: #fff;
    font-size: 13px;
    width: 100%;
    padding: 7px 2.6em 7px 2.6em;
}

.map-pop .ref a:first-child::after {
    content: "▶";
    display: block;
    position: absolute;
    top: 50%;
    right: 7px;
    font-size: 10px;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

.map-pop .ref a + a {
    display: block;
    margin-top: 10px;
}

.map-pop .ref a + a:hover {
    opacity: 0.7;
    text-decoration: underline;
}

.item.u-item {
    padding: 0 1em;
}