@charset "UTF-8";

/*-------------------------
__hoge_style
-------------------------*/

.contents{ background-color: #f5f5e1;}
.contents .page_title{ background-image: url(/images/back_gray.png),url(../images/title_back.jpg); background-repeat: repeat, no-repeat; background-size: auto, cover; background-position: center,center; text-align: center;}
.contents .page_title h1{ position: relative; width: 500px; height: auto; margin: 0 auto;}
.contents .page_title h1 img{ width:100%; height: auto;}
#prefectures_list{ padding: 0 0 60px; box-sizing: border-box;}
.map_japan_pc{ width: 1000px; height: 520px; margin: 0 auto; background: -moz-linear-gradient(top, #effeec, #FFF); background: -webkit-linear-gradient(top, #effeec, #FFF); background: linear-gradient(to bottom, #effeec, #FFF); position: relative; text-align: center;}
.map_japan_pc img{ width: 100%; height: 100%;}
.map_japan_pc ul li:nth-child(1){ position: absolute; top: 70px; left: 100px; width: 150px; height: auto;}
.map_japan_pc ul li:nth-child(2){ position: absolute; top: 70px; left: 250px; width: 150px; height: auto;}
.map_japan_pc ul li:nth-child(3){ position: absolute; top: 70px; left: 400px; width: 150px; height: auto;}
.map_japan_pc ul li img{ width: 100%; height: auto;}
/* マップcss */
.map_japan_pc svg{ width: 90%; margin: 30px auto 30px;}
.map_japan_pc .st0{fill:#68a8ca;stroke:#FFFFFF;stroke-width:2;}
.map_japan_pc .st1{fill:#9697c3;stroke:#FFFFFF;stroke-width:2;}
.map_japan_pc .st2{fill:#bde0fc;stroke:#FFFFFF;stroke-width:2;}
.map_japan_pc .st3{fill:#a7d287;stroke:#FFFFFF;stroke-width:2;}
.map_japan_pc .st4{fill:#bbda68;stroke:#FFFFFF;stroke-width:2;}
.map_japan_pc .st5{fill:#e9f35f;stroke:#FFFFFF;stroke-width:2;}
.map_japan_pc .st6{fill:#efb54b;stroke:#FFFFFF;stroke-width:2;}
.map_japan_pc .st7{fill:#ea7930;stroke:#FFFFFF;stroke-width:2;}
.map_japan_pc .st8{fill:#FFFFFF;}
.map_japan_pc .st9{font-family: 'Kosugi Maru', sans-serif;}
.map_japan_pc .st10{font-size:24px;}
.map_japan_pc .st11{fill:#7A7A73;}
.map_japan_pc a:hover .st0,
.map_japan_pc a:hover .st1,
.map_japan_pc a:hover .st2,
.map_japan_pc a:hover .st3,
.map_japan_pc a:hover .st4,
.map_japan_pc a:hover .st5,
.map_japan_pc a:hover .st6,
.map_japan_pc a:hover .st7{ opacity: 0.5;}


#area_list{ width: 1000px; margin: 0 auto;}
#area_list .contents{ background-color: #fff; padding: 50px; box-sizing: border-box;}
#area_list .contents .js-ac{ margin-bottom: 40px;}
#area_list .contents .js-ac:last-child{ margin-bottom: 0;}
#area_list .contents .js-ac h2{ text-align: center; font-size: 2.3em; font-weight: 700; margin-bottom: 35px; color: #fff; padding: 15px 0;}
#area_list .contents .js-ac#area01 h2{ background-color: #68a8ca;}
#area_list .contents .js-ac#area02 h2{ background-color: #9697c3;}
#area_list .contents .js-ac#area03 h2{ background-color: #bde0fc; color: #7A7A73;}
#area_list .contents .js-ac#area04 h2{ background-color: #a7d287;}
#area_list .contents .js-ac#area05 h2{ background-color: #bbda68;}
#area_list .contents .js-ac#area06 h2{ background-color: #e9f35f; color: #7A7A73;}
#area_list .contents .js-ac#area07 h2{ background-color: #efb54b;}
#area_list .contents .js-ac#area08 h2{ background-color: #ea7930;}
#area_list .contents .js-ac .js-ac-target{}
#area_list .contents .js-ac .js-ac-target ul{ display: flex; flex-wrap: wrap;}
#area_list .contents .js-ac .js-ac-target ul li{ width:calc(25% - 15px); text-align: center; margin-right: 20px; margin-bottom: 20px;}
#area_list .contents .js-ac .js-ac-target ul li:nth-child(4n){ margin-right: 0;}
#area_list .contents .js-ac .js-ac-target ul li a{ display: block; background-color: #fff; text-decoration: none; font-size: 1.7em;
border: 1px solid #9b814b; box-sizing: border-box; color: #9b814b; text-decoration: none; font-weight: 700; line-height: 1.3; margin: auto; padding: 20px 0; cursor: pointer;}

@media screen and (min-width: 768px) {

.map_japan_sp{ display: none;}
#area_list .contents .js-ac .js-ac-target ul li a:hover{ background-color: #9b814b; color: #fff;}
#area_list .contents .js-ac h2{ pointer-events: none;}

}

@media screen and (max-width: 767px) {

.js-ac .js-ac-trigger:before { content: "＋"; font-size: 1.2em; padding-right: 5px;}
.js-ac .js-ac-trigger .js-ac-target { display: none;}
.js-ac .js-ac-trigger.is-active:before { content: "−"; font-size: 1.2em;}
.js-ac .js-ac-trigger.is-active .js-ac-target{ display: block;}
.contents .page_title h1{ width: 240px; height: auto;}
#prefectures_list{ padding: 0 10px 30px; box-sizing: border-box;}

.map_japan_sp{ text-align: center;}
.map_japan_sp svg{ width: 90%; margin: 10px auto 10px;}
.map_japan_sp{ background: -moz-linear-gradient(top, #effeec, #FFF); background: -webkit-linear-gradient(top, #effeec, #FFF); background: linear-gradient(to bottom, #effeec, #FFF); position: relative;}
.map_japan_sp .st0{fill:#68a8ca;stroke:#FFFFFF;stroke-width:2;}
.map_japan_sp .st1{fill:#9697c3;stroke:#FFFFFF;stroke-width:2;}
.map_japan_sp .st2{fill:#bde0fc;stroke:#FFFFFF;stroke-width:2;}
.map_japan_sp .st3{fill:#a7d287;stroke:#FFFFFF;stroke-width:2;}
.map_japan_sp .st4{fill:#bbda68;stroke:#FFFFFF;stroke-width:2;}
.map_japan_sp .st5{fill:#e9f35f;stroke:#FFFFFF;stroke-width:2;}
.map_japan_sp .st6{fill:#efb54b;stroke:#FFFFFF;stroke-width:2;}
.map_japan_sp .st7{fill:#ea7930;stroke:#FFFFFF;stroke-width:2;}
.map_japan_sp .st8{fill:#FFFFFF;}
.map_japan_sp .st9{font-family: 'Kosugi Maru', sans-serif;}
.map_japan_sp .st10{font-size:30px;}
.map_japan_sp .st11{fill:#7A7A73;}

.map_japan_sp ul li:nth-child(1){ position: absolute; top: 20px; left: 20px; width: 46px; height: auto;}
.map_japan_sp ul li:nth-child(2){ position: absolute; top: 20px; left: 70px; width: 46px; height: auto;}
.map_japan_sp ul li:nth-child(3){ position: absolute; top: 20px; left: 120px; width: 46px; height: auto;}
.map_japan_sp ul li img{ width: 100%; height: auto;}
    
.map_japan_pc{ display: none;}

#area_list{ width: 100%; margin: 0 auto; box-sizing: border-box;}
#area_list .contents{ background-color: #fff; padding: 10px;}
#area_list .contents .js-ac{ margin-bottom: 10px;}
#area_list .contents .js-ac h2{ font-size: 1.6em; margin-bottom: 10px; color: #fff; padding: 15px 0;}

#area_list .contents .js-ac .js-ac-target ul{}
#area_list .contents .js-ac .js-ac-target ul li{ width:calc(50% - 2.5px); margin-right: 5px; margin-bottom: 5px;}
#area_list .contents .js-ac .js-ac-target ul li:nth-child(2n){ margin-right: 0;}
#area_list .contents .js-ac .js-ac-target ul li a{ padding: 15px 0; font-size: 1.6em; padding: 15px 0;}
/*#area_list .contents .js-ac#area01 .js-ac-target ul li a{ color: #68a8ca; border: 1px solid #68a8ca;}
#area_list .contents .js-ac#area02 .js-ac-target ul li a{ color: #9697c3; border: 1px solid #9697c3;}
#area_list .contents .js-ac#area03 .js-ac-target ul li a{ color: #bde0fc; border: 1px solid #bde0fc;}
#area_list .contents .js-ac#area04 .js-ac-target ul li a{ color: #a7d287; border: 1px solid #a7d287;}
#area_list .contents .js-ac#area05 .js-ac-target ul li a{ color: #bbda68; border: 1px solid #bbda68;}
#area_list .contents .js-ac#area06 .js-ac-target ul li a{ color: #e9f35f; border: 1px solid #e9f35f;}
#area_list .contents .js-ac#area07 .js-ac-target ul li a{ color: #efb54b; border: 1px solid #efb54b;}
#area_list .contents .js-ac#area08 .js-ac-target ul li a{ color: #ea7930; border: 1px solid #ea7930;}*/

}