/* Scss Document search-area*/
/* Scss Document _base*/
article { border-top: none; }
article > #modoru { display: block; width: 12em; margin: 2em auto; padding: 0.5em 1em; background: #224e78; text-align: center; color: #fff; font-weight: bold; }
article > #modoru::before { display: inline-block; padding-right: 0.5em; content: "\f104"; font-family: 'FontAwesome'; color: #fff; }
article h1 { color: #041423;font-size: 28px;padding: 0 0 10px;border-bottom: 2px solid #041423;margin: 40px auto 20px;max-width: 100%; }
section { position: relative; width: 100%; max-width: 1000px; margin: 0 auto 0 auto; padding: 0 0 1em 0; text-align: left; }
section:last-of-type { border-bottom: none; }
*.inner1, *.inner2 { vertical-align: top; }
#search-menu { position: relative; background: #efefef; padding: 0.5em 5% 0.5em 5%; text-align: right; }
#search-menu > p { display: inline-block; width: auto; padding: 0 0.5em; }
#search-menu > p:first-of-type { padding: 0.5em; background: #efefef; border-radius: 10px 10px 0 0; font-size: 1.5em; font-weight: bold; }
#search-menu > div { width: 100%; background: #fff; margin: 0.5em auto; padding: 0.5em 0 0.5em 1em; text-align: center; }
#search-menu > div p { display: table-cell; padding-right: 1em; }
#search-menu > div p.search-btn { display: inline-block; margin: 0 0.5em; padding: 0; border: solid 1px #e7d3b5; font-weight: bold; }
#search-menu > div p.search-btn span { font-size: 1.3em; padding-right: 0.2em; }
#search-menu > div p.search-btn a { display: block; padding: 0.2em 1em; margin: 0; background: linear-gradient(to bottom, #e7d3b5, #f0e8de 50%, #e7d3b5); color: #6c3e34; text-align: center; }
#search-menu > div p.search-btn a:hover { background: #896f56; color: #fff; }
#search-menu > div p.okiniiri-btn { display: inline-block; margin: 0 0.5em; padding: 0; font-weight: bold; }
#search-menu > div p.okiniiri-btn span { font-size: 1.3em; padding-right: 0.2em; color: #19234d; }
#search-menu > div p.okiniiri-btn a { display: block; padding: 0.2em 1em; margin: 0; background: #fff; color: #6c3e34; text-align: center; border: solid 3px #896f56; }
#search-menu > div p.okiniiri-btn a:hover { background: #896f56; color: #fff; border: solid 3px #896f56; }
#search-menu > div p.okiniiri-btn a:hover span { color: #fff; }
#search-menu > div:first-of-type { display: inline-block; width: auto; top: -4em; right: 0; background: none; }
#search-menu > div:last-of-type { background: none; }
#search-menu .caution { background: #edf3f8; }
input[type="search"] { display: inline-block; width: 100%; max-width: 30%; margin: 0 auto 0 1em; padding: 0.2em 1em; }
#area-container { position: relative; }
/* #area-name-box { position: absolute; width: 50%; padding: 1em; z-index: 5; text-align: center; } */
#area-name-box { padding: 1em; text-align: center; }
#area-name-box #area-osakashi, #area-name-box ul[id^="area-other"] { margin-bottom: 1em; padding: 0 0.5em 0.5em 0.5em; -moz-column-count: 3; -webkit-column-count: 3; column-count: 3; border: solid 5px #efefef; text-align: left; column-gap: 0.5em; }
#area-name-box #area-osakashi li, #area-name-box ul[id^="area-other"] li { padding-left: 1em; list-style: none; }
#area-name-box #area-osakashi li.none, #area-name-box ul[id^="area-other"] li.none { display: none; }
#area-name-box #area-osakashi li:first-of-type, #area-name-box ul[id^="area-other"] li:first-of-type { margin-left: -0.2em; padding-bottom: 1em; font-size: 1.2em; line-height: 2em; font-weight: bold; column-span: all; padding-left: 1em;}
#area-name-box ul li:first-of-type input[type="checkbox"]:checked + label::after {top:20px;}
/* #area-name-box #area-other-hyogo { width: 70%; -moz-column-count: 2; -webkit-column-count: 2; column-count: 2; } */
#area-name-box #area-other-hyogo { width: 100%; -moz-column-count: 3; -webkit-column-count: 3; column-count: 3; }
#area-map { position: relative; width: 100%; min-width: 700px; height: 900px; }
#area-map img { position: absolute; z-index: 1; top: 0; right: 0; width: 600px; height: 800px; }
#area-map p { position: absolute; z-index: 10; padding: 0 0.1em; font-weight: bold; color: #224e78; font-size: 1.1em; }
#area-map p.on { color: #cf3c26; font-weight: bold; background: rgba(255, 255, 255, 0.5); }
#area-map p.on::before { content: "\f00c"; font-family: 'FontAwesome'; }
#area-map p.none { color: #666; font-size: 0.9em; font-weight: normal; }
#area-map p.none::before { display: none; }
#area-map p:nth-of-type(1) { top: 10px; right: 250px; }
#area-map p:nth-of-type(2) { top: 130px; right: 270px; }
#area-map p:nth-of-type(3) { top: 60px; right: 200px; }
#area-map p:nth-of-type(4) { top: 130px; right: 200px; }
#area-map p:nth-of-type(5) { top: 100px; right: 140px; }
#area-map p:nth-of-type(6) { top: 130px; right: 90px; }
#area-map p:nth-of-type(7) { top: 90px; right: 30px; }
#area-map p:nth-of-type(8) { top: 160px; right: 30px; }
#area-map p:nth-of-type(9) { top: 180px; right: 250px; }
#area-map p:nth-of-type(10) { top: 200px; right: 200px; }
#area-map p:nth-of-type(11) { top: 220px; right: 150px; }
#area-map p:nth-of-type(12) { top: 200px; right: 80px; }
#area-map p:nth-of-type(13) { top: 220px; right: 30px; }
#area-map p:nth-of-type(14) { top: 350px; right: 210px; }
#area-map p:nth-of-type(15) { top: 270px; right: 140px; }
#area-map p:nth-of-type(16) { top: 250px; right: 90px; }
#area-map p:nth-of-type(17) { top: 270px; right: 20px; }
#area-map p:nth-of-type(18) { top: 320px; right: 80px; }
#area-map p:nth-of-type(19) { top: 370px; right: 90px; }
#area-map p:nth-of-type(20) { top: 430px; right: 100px; }
#area-map p:nth-of-type(21) { top: 500px; right: 210px; }
#area-map p:nth-of-type(22) { top: 460px; right: 130px; }
#area-map p:nth-of-type(23) { top: 480px; right: 80px; }
#area-map p:nth-of-type(24) { top: 460px; right: 30px; }
#area-map p:nth-of-type(25) { top: 510px; right: 80px; }
#area-map p:nth-of-type(26) { top: 550px; right: 150px; }
#area-map p:nth-of-type(27) { top: 570px; right: 100px; }
#area-map p:nth-of-type(28) { top: 550px; right: 50px; }
#area-map p:nth-of-type(29) { top: 590px; right: 50px; }
#area-map p:nth-of-type(30) { top: 530px; right: 260px; }
#area-map p:nth-of-type(31) { top: 560px; right: 260px; }
#area-map p:nth-of-type(32) { top: 600px; right: 250px; }
#area-map p:nth-of-type(33) { top: 660px; right: 120px; }
#area-map p:nth-of-type(34) { top: 650px; right: 30px; }
#area-map p:nth-of-type(35) { top: 630px; right: 270px; }
#area-map p:nth-of-type(36) { top: 650px; right: 310px; }
#area-map p:nth-of-type(37) { top: 670px; right: 340px; }
#area-map p:nth-of-type(38) { top: 690px; right: 390px; }
#area-map p:nth-of-type(39) { top: 720px; right: 450px; }
#area-map p:nth-of-type(40) { top: 750px; right: 530px; }
input[type="submit"], input[type="button"] {display: inline-block;font-size: 16px;line-height: 100%;padding: 17px 15px 17px 35px;color: #031424;border: 2px solid #031424 !important;border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;font-family: "游明朝", "YuMincho", "HG明朝B", "ＭＳ 明朝", "MS PMincho", serif !important;text-decoration: none;font-weight: bold;position: relative;-webkit-transition: 0.3s ease-in-out;-moz-transition: 0.3s ease-in-out;-o-transition: 0.3s ease-in-out;transition: 0.3s ease-in-out;background: none;background: url(../images/setting/arrow1.png) 15px center no-repeat;-webkit-transition: 0.3s ease-in-out;-moz-transition: 0.3s ease-in-out;-o-transition: 0.3s ease-in-out;transition: 0.3s ease-in-out;}
input[type="submit"]:hover, input[type="button"]:hover { background: url(../images/setting/arrow2.png) 15px center no-repeat #031424; color: #FFF; }

@media all and (-ms-high-contrast:none){
  *::-ms-backdrop, input[type="submit"], input[type="button"] {background: url(../images/setting/arrow1.png) 15px 18px no-repeat !important;}
}


@media screen and (max-width: 750px) {
	article h1 { top: 0; font-size: 1.2em; padding: 0.2em 1em; }
	section { max-width: 750px; }
	*.inner1, *.inner2 { display: block; width: 100%; }
	#search-menu { text-align: left; margin-top: 0.5em; }
	#search-menu > p:first-of-type { display: block; font-size: 1.2em; padding-bottom: 0.5em; border: solid 1px #224e78; background: #224e78; color: #fff; }
	#search-menu > div { padding: 0 0 1em 0; }
	#search-menu > div.table { text-align: left; }
	#search-menu > div p { display: inline-block; padding: 0 1em; margin: 0.2em 1em; }
	#search-menu > div p.search-btn { display: inline-block; width: 49%; margin: 0.2em auto; }
	#search-menu > div p.okiniiri-btn { display: inline-block; width: 49%; margin: 0.2em auto; }
	#search-menu > div:first-of-type { position: static; display: block; margin-bottom: 0; padding-bottom: 0; }
	input[type="search"] { width: 100%; max-width: none; margin: 0.2em auto; }
	input[type="submit"] { display: table; margin: 0 auto 0 auto; }
	#area-name-box { position: static; width: 100%; }
	#area-name-box #area-osakashi, #area-name-box ul[id^="area-other"] { -moz-column-count: 2; -webkit-column-count: 2; column-count: 2; }
	#area-name-box #area-other-hyogo { display: block; width: 100%;  -moz-column-count: 2; -webkit-column-count: 2; column-count: 2; }
	#area-map { display: none; }
}