@charset "UTF-8";
/* */
/* グラデーション */
/* アイコン表示 */
/* http://meyerweb.com/eric/tools/css/reset/  v2.0 | 20110126 License: none (public domain) */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

body { line-height: 1; }

ol, ul { list-style: none; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

table { border-collapse: collapse; border-spacing: 0; }

input[type="submit"], input[type="button"] { border-radius: 0; -webkit-box-sizing: content-box; -webkit-appearance: button; -moz-appearance: button; appearance: button; border: none; box-sizing: border-box; }

input[type="submit"]::-webkit-search-decoration, input[type="button"]::-webkit-search-decoration { display: none; }

input[type="submit"]::focus, input[type="button"]::focus { outline-offset: -2px; }

img { vertical-align: top; }

/* @import url("//fonts.googleapis.com/earlyaccess/notosansjp.css"); 
@import url("//fonts.googleapis.com/css?family=Raleway");
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+TC:100');
*/
/* ユーティリティ */
/* clearfix */
.clearfix { content: ""; display: table; clear: both; }

.u_long_text { letter-spacing: -2px; }

.u_long_text_1 { letter-spacing: -0.5px; }

.u_fll { float: left; }

.u_flr { float: right; }

.lang_en { font-family: 'Raleway', sans-serif; }

.font_min { font-family: 'latin-modern-roman10-regular', 'ヒラギノ明朝 Pro W6', 'Hiragino Mincho Pro', 'HGS明朝E', 'ＭＳ Ｐ明朝', serif; }

.border1 { border: 1px solid #d9d9da; }

* { margin: 0; padding: 0; line-height: 1.5; }

html { font-size: 62.5%; /* html 10px */ color: #3e3a39; }

html body { font-family: 'Noto Sans JP', "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", "YuGothic", "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; font-size: 1.6rem; background: #ffffff; }

html select, html input, html textarea { font-family: 'Lucida Grande',sans-serif; }

html main { display: block; /* IE */ }

img { border: 0; vertical-align: bottom; }

li { list-style-type: none; }

body { min-height: calc(100vh + 110px); height: 100%; position: relative; }

footer { position: absolute; bottom: 0; right: 0; width: 100%; text-align: center; border-top: 1px solid #e9e9e9; font-size: 1.4rem; color: #ffffff; background: rgba(90, 190, 150, 0.8); padding: 0.5em 0; }

.pagetop { position: fixed; border: 1px solid #ffffff; box-sizing: border-box; bottom: 10px; right: 50%; width: 1em; font-size: 4rem; margin-right: -340px; }

@media screen and (max-width: 600px) { .pagetop { margin-right: 0; right: 10px; font-size: 3rem; } }

.pagetop a { display: block; height: 0; padding-top: 1em; overflow: hidden; position: relative; background: #5ac8a0; }

.pagetop a:after { content: ""; position: absolute; display: block; top: 50%; right: 50%; width: 0.4em; height: 0.4em; border-top: 2px solid #ffffff; border-right: 2px solid #ffffff; transform: rotate(-45deg) translateX(50%) translateY(10%); }

@media screen and (max-width: 600px) { .pagetop a:after { transform: rotate(-45deg) translateX(55%) translateY(13%); } }

.pagetop a:hover { background: rgba(90, 190, 150, 0.8); }

header { border-top: 4px solid #5ac8a0; border-bottom: 1px solid #e9e9e9; }

header h1 { font-size: 1.4rem; text-align: center; color: #9c9c9c; padding: 0.7em 0; }

h2.logo { max-width: 300px; width: 50%; margin: 12vh auto 8vh auto; }

@media screen and (max-width: 600px) { h2.logo { margin: 10vh auto 8vh auto; } }

h2.logo a img { width: 100%; height: auto; }

.search_area { width: 100%; text-align: center; }

.search_area input.search-field { width: 90%; max-width: 450px; border: 1px solid #5ac8a0; padding: 0.8em; font-size: 1.8rem; line-height: 1; text-align: center; border-radius: 50px; display: block; margin: 0 auto; }

@media screen and (max-width: 600px) { .search_area input.search-field { font-size: 1.5rem; width: 80%; } }

.search_area input.search-field:-ms-input-placeholder, .search_area input.search-field:-ms-input-placeholder { color: #9d9d9d; }

.search_area input.search-field::-ms-input-placeholder, .search_area input.search-field:-ms-input-placeholder { color: #9d9d9d; }

.search_area input.search-field::placeholder, .search_area input.search-field:-ms-input-placeholder { color: #9d9d9d; }

.search_area h3 { position: relative; color: #797979; font-size: 1.6rem; text-align: center; margin: 2em 0 1.5em 0; display: inline-block; }

@media screen and (max-width: 600px) { .search_area h3 { font-size: 1.4rem; } }

.search_area h3:before, .search_area h3:after { content: ""; display: block; width: 1em; height: 0.2em; background: #5ac8a0; position: absolute; top: 50%; line-height: 1; }

.search_area h3:before { left: -0.4em; transform: translateX(-100%) translateY(-50%); }

.search_area h3:after { right: -0.4em; transform: translateX(100%) translateY(-50%); }

.search_area .range ul { display: flex; flex-wrap: wrap; justify-content: space-between; width: 350px; margin: 0 auto; border: 1px solid #5ac8a0; border-radius: 0.4em; }

@media screen and (max-width: 600px) { .search_area .range ul { width: 90%; font-size: 1.4rem; } }

.search_area .range ul li { width: 25%; box-sizing: border-box; text-algin: center; color: #a5a5a5; }

.search_area .range ul li span { display: block; padding: 0.8em 0; border-right: 1px solid #5ac8a0; box-sizing: border-box; }

.search_area .range ul li:hover { cursor: pointer; background: rgba(90, 190, 150, 0.1); }

.search_area .range ul li:last-child span { border-right: none; }

.search_area .range ul li:nth-of-type(1) { background: #5ac8a0; color: #ffffff; }

.search_area .range ul.sl_geo300 li:nth-of-type(1), .search_area .range ul.sl_geo600 li:nth-of-type(1), .search_area .range ul.sl_geo1000 li:nth-of-type(1) { background: transparent; color: #a5a5a5; }

.search_area .range ul.sl_geo300 li:nth-of-type(2) { background: #5ac8a0; color: #ffffff; }

.search_area .range ul.sl_geo600 li:nth-of-type(3) { background: #5ac8a0; color: #ffffff; }

.search_area .range ul.sl_geo1000 li:nth-of-type(4) { background: #5ac8a0; color: #ffffff; }

.search_area button#submit { background: #fb8c9b; color: #ffffff; border: none; font-size: 2rem; padding: 0.5em 1.2em; line-height: 1; border-radius: 1em; margin: 2em 0; cursor: pointer; }

@media screen and (max-width: 600px) { .search_area button#submit { font-size: 1.6rem; } }

.search_area button#submit:after { content: ""; display: inline-block; width: 0.6em; height: 0.6em; border-right: 2px solid #ffffff; border-top: 2px solid #ffffff; transform: rotate(45deg); margin-left: 0.4em; }

.search_area button#submit:hover { opacity: 0.8; }

.search_area button#submit.disable { background: #aaa; cursor: wait; }

#reslist { width: 600px; margin: 40px auto 0; }

@media screen and (max-width: 600px) { #reslist { width: 90%; margin-top: 20px; } }

#reslist:before { content: ""; width: 95%; margin: 0 auto 20px; height: 0; border-top: 1px solid #eee; display: block; }

.page_counter { text-align: center; }

.page_counter li { font-size: 1.6rem; display: inline-block; padding: 0.2em 1em; }

.pager { display: block; padding: 1em 0; text-align: center; }

.pager li { display: inline-block; font-size: 1.4rem; padding: 0.3em; }

.pager li a { text-decoration: none; display: block; text-align: center; background: #e4e4e4; width: 2em; line-height: 2em; border-radius: 2em; color: #434343; }

.pager li a:visited { color: #434343; }

.pager li a:hover { opacity: 0.8; }

.pager li.active a { background: #5ac8a0; color: #ffffff; }

.pager:last-child { padding: 40px 0 80px 0; }

#item_list + .page_counter { display: none; }

#item_list { padding-bottom: 60px; }

#item_list li { margin-bottom: 1px; }

#item_list li a { color: #454545; text-decoration: none; padding: 1em 6em 1em 1em; display: block; position: relative; }

@media screen and (max-width: 600px) { #item_list li a { padding-right: 4.5em; } }

#item_list li a h2 { font-size: 2.2rem; font-weight: bold; padding-bottom: 0.5em; }

@media screen and (max-width: 600px) { #item_list li a h2 { font-size: 1.6rem; } }

#item_list li a:after { content: ""; font-size: 3.5rem; width: 1.5em; height: 1.5em; text-align: center; color: #ffffff; background: url("../img/arrow.png") no-repeat center center #63b8db; background-size: cover; display: block; position: absolute; top: 50%; right: 20px; transform: translateY(-50%); border-radius: 1rem; }

@media screen and (max-width: 600px) { #item_list li a:after { font-size: 3rem; right: 10px; } }

@media screen and (max-width: 600px) { #item_list li address { font-size: 1.4rem; } }

#item_list li span { padding: 0.5em 0 0 1em; display: block; font-size: 0.8em; position: relative; }

#item_list li span:before { content: ""; display: block; width: 0.8em; height: 0.8em; border-radius: 0.4em; background: rgba(90, 190, 150, 0.8); position: absolute; top: 50%; left: 0; transform: translateY(-20%); }

#item_list li:nth-child(odd) { background: #f8f8f8; }

#item_list li:hover { background: rgba(90, 190, 150, 0.1); }

#item_list li:hover a:after { background-color: #5ac8a0; }

.pager + #item_list { padding-bottom: 0; }

p.note { display: block; max-width: 300px; width: 90%; text-align: center; margin: 0 auto; padding: 1.5em 0; line-height: 1; font-size: 1.5rem; background: #fff2f2; border: 1px solid #f99898; border-radius: 0.4em; color: #f99898; font-weight: bold; }

div.about { border-top: 1px solid #e9e9e9; width: 100%; text-align: center; box-sizing: border-box; padding: 1em 2em; position: absolute; bottom: 30px; color: #9c9c9c; }

div.about h2 { font-size: 1.6rem; margin-bottom: 1em; font-weight: bold; }

div.about p { font-size: 1.4rem; }

div.about p a, div.about p a:visited { text-decoration: none; color: #00b4ff; }

.small_comment { text-align: center; font-size: 80%; color: #797979; margin-top: 1em; }

body { min-height: calc(100vh); height: 100%; position: relative; }

footer { position: absolute; bottom: 0; width: 100%; text-align: center; border-top: none; font-size: 1.4rem; color: #ffffff; background: rgba(90, 190, 150, 0.8); padding: 0.5em 0; }

header { border-bottom: none; }

header h1 { line-height: 1.4em; }

@media screen and (max-width: 600px) { header h1 { font-size: 1.3rem; line-height: 1.4em; padding: 0.7em; } }

.search_area input.search-field::-webkit-input-placeholder { font-size: calc(1rem + 1vw); color: #b5b5b5; }

.search_area input.search-field::-moz-placeholder { font-size: calc(1rem + 1vw); color: #b5b5b5; }

.search_area input.search-field:-ms-input-placeholder { font-size: calc(1rem + 1vw); color: #b5b5b5; }

.search_area input.search-field::-ms-input-placeholder { font-size: calc(1rem + 1vw); color: #b5b5b5; }

.search_area input.search-field::placeholder { font-size: calc(1rem + 1vw); color: #b5b5b5; }

@media screen and (min-width: 769px) { .search_area input.search-field::-webkit-input-placeholder { font-size: calc(1.8rem); } .search_area input.search-field::-moz-placeholder { font-size: calc(1.8rem); } .search_area input.search-field:-ms-input-placeholder { font-size: calc(1.8rem); } .search_area input.search-field::-ms-input-placeholder { font-size: calc(1.8rem); } .search_area input.search-field::placeholder { font-size: calc(1.8rem); } }

.small_comment { text-align: center; font-size: 70%; color: #797979; margin-top: 1em; }

p.note { position: relative; z-index: 200; /* @include sp() { margin: 0 auto 30vw auto; } */ }

p.note span { padding: 1em 0 0 0; display: block; }

p.note span a { font-size: 1.3rem; color: #3670e7; }

div.about { border-top: none; width: 100%; text-align: center; box-sizing: border-box; padding: 1em 0 0.7em 0; position: absolute; bottom: 30px; color: #9c9c9c; background-color: rgba(255, 255, 255, 0.8); }

div.about h2 { font-size: 1.4rem; font-weight: normal; line-height: 1.2em; padding: 0.3em 0.6em; margin: 0 0.1em 1em 0.1em; border: 1px solid #8e8e8e; border-radius: 0.8em; display: inline-block; cursor: pointer; }

@media screen and (min-width: 769px) { div.about h2 { margin: 0 0.3em 0.3em 0.3em; } }

div.about p { font-size: 1.4rem; line-height: 1.2em; display: inline-block; }

div.about p a, div.about p a:visited { text-decoration: none; color: #00b4ff; }

@media screen and (min-width: 769px) { div.about p { margin: 0 0.3em 0.3em 0.3em; } }

.slide-content { display: none; margin-bottom: 3em; }

.modal { display: none; height: 100vh; position: fixed; top: 0; width: 100%; z-index: 100; }

.modal ul li { font-size: 1.4rem; line-height: 1.5em; text-align: left; color: #000000; }

.modal ul li b, .modal ul li span { font-size: 1.5rem; line-height: 1.5em; font-weight: bold; }

.modal ul li span { color: #dd6e47; }

.modal ul li img { max-width: 300px; height: auto; margin: 1em auto; display: block; }

@media screen and (max-width: 768px) { .modal ul li img { width: 100%; height: auto; } }

.modal ul li a { text-align: center; color: #717171; text-decoration: none; padding: 0.5em 1em; margin: 2em auto 0 auto; border: 1px solid #717171; background-color: #ffffff; border-radius: 1em; display: block; cursor: pointer; }

.modal ul li:nth-child(3) { margin-bottom: 1.2em; }

.modal ul li:nth-child(2), .modal ul li:nth-child(5) { margin-bottom: 0.5em; }

.modal__bg { background: rgba(0, 0, 0, 0.8); height: 100vh; position: absolute; width: 100%; }

.modal__content { background: #fff; left: 50%; padding: 8vw; position: absolute; top: 50%; transform: translate(-50%, -50%); width: 70%; }

@media screen and (min-width: 769px) { .modal__content { padding: 4vw; } }

.geo { margin-top: 15px !important; box-sizing: border-box; border: 1px solid #63b8db; position: relative; }

.geo:after { content: "詳細情報あり"; font-size: 70%; color: #ffffff; padding: 0.4em; background-color: #63b8db; border-radius: 0.5em; position: absolute; top: -10px; left: -10px; }

/* .geo { padding-left: calc(40px + 2.4vw); margin-bottom: 5px !important; box-sizing: border-box; border: 2px solid #63b8db; position: relative; } .geo:after { content: "詳細情報\Aあり"; white-space: pre; font-size: calc(70% + 0.5vw); color: #ffffff; padding: 0.5em; background-color: #63b8db; border-radius: 0.7em; transform: translateY(-50%); position: absolute; top: 50%; left: -10px; } */
h2.logo { max-width: 300px; width: 50%; margin: 8vh auto; }

h2.logo a img { width: 100%; height: auto; }
