@charset "UTF-8";
/* CSS Document */

/* -------------------------------------------------------- html & body */
html { height: 100%; background-position: center; }
body { /* min-width: 1200px; *//* background: #f0f0f0; */ height: 100%; width: 100%; /* overflow-x: hidden; */box-sizing: border-box; scroll-behavior: smooth;}
body:before { /* position: fixed; content: ""; top: 0; left: 0; height: 100%; width: 4rem; background: #ffec00; z-index: -1; */ }
body:after { /* position: fixed; content: ""; top: 0; right: 0; height: 100%; width: 4rem; background: #ffec00; z-index: -1; */ }
div.wrapper { /* padding-top: 19.5rem; */ /* transition: 0.01s all; */ }
div.wrapper.opacity { /* padding-top: 19.5rem; */ }
body.top div.contents-wrapper { box-sizing: border-box; overflow: hidden; background: #fff; }
.contents-wrapper { box-sizing: border-box; overflow: hidden; /* background: #f8f8f8; */ /* padding-top: 1rem; */ /* padding-bottom: 1rem; */ }
div.inner { /* width: 1000px; */ width: 100%; max-width: 150rem; margin-left: auto; margin-right: auto; position: relative; z-index: 1; }

/* --------------------------------------------------- header */
header { width: 100%; z-index: 9999; /* background: #fff; *//* position: fixed; */
  height: 19.5rem; transition: all .1s; top: 0; }
header > div.inner { /* max-height: 10rem; *//* padding-top: 1rem; padding-bottom: 1rem; *//* max-width: inherit; */
  height: 16rem; position: relative; }
header div.header-top { padding-top: 0.5rem; max-width: 150rem; margin-left: auto; margin-right: auto; }
header div.header-top > div.inner { max-width: inherit; }
header ul.utility { text-align: right; font-size: 0; }
header ul.utility li { display: inline-block; margin-right: 2rem; }
header ul.utility li:last-child { margin-right: 0; }
header ul.utility li a { font-size: 1.4rem; position: relative; color: #000; text-decoration: none; display: block; padding-top: 0.25rem; padding-bottom: 0.25rem; transition: 0.25s all; vertical-align: middle; }
header ul.utility li a:hover { color: #4cbabf; }
header ul.utility li a::before {}
header ul.utility li a span { vertical-align: middle; color: #4cbabf; position: relative; top: -0.1rem; margin-right: 0.2rem; }

/* -------------------------------------------------------------------------- */
header div.logo { float: left; width: calc(100% - 4rem - 86rem); position: relative; top: 0; padding-left: 2rem; min-width: 17rem; transition: all 0.4s ease 0s; }
header div.logo h1 { margin-bottom: 0 !important; }
header div.logo a { display: block; padding: 0; color: #000; text-decoration: none; float: left; font-size: 3rem; white-space: nowrap; }
header div.logo a img { display: block; /* width: 30rem; */ /* */
  width: 36rem; margin-left: auto; margin-right: auto; transition: all 0.4s ease 0s; }

/* -------------------------------------------------- header の fixed */
header.opacity { /* position: fixed; width: 100%; background: rgba(255,255,255,0.75); background: linear-gradient(rgba(255,255,255,1),rgba(255,255,255,0)); background: linear-gradient(to top, rgba(255,255,255,0), rgba(255,255,255,0.9) 5%, rgba(255,255,255,0.9) 95%, rgba(255,255,255,0.9) 100%); top: 0; height: 15.5rem; */ }
body.top header.opacity { /* height: auto; */ }
header.opacity > div.inner { /* height: auto; */ }
header.opacity nav { /* margin-top: 0; */ }
header.opacity { /* margin-top: 0; */ }

/* ------------------------ nav */
header div.menu-button { display: none; }
header nav { background: #fff; position: relative; float: right; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2); box-sizing: border-box; padding:1.5rem 1rem; border-radius: 0.75rem; margin-top: 2rem; z-index: 1; width: 86rem; transition: all 0.4s ease 0s; }
nav div.nav-heading { position: absolute; top: -1.0rem; left: 2.25rem; color: #4cbabf; font-size: 1.2rem; font-weight: bold; letter-spacing: 0.2rem; line-height: 1.5; }
nav ul { width: 100%; white-space: nowrap; font-size: 0; }
nav ul li { position: relative; display: inline-block; vertical-align: middle; padding-left: 1.5rem; padding-right: 1.5rem; }
nav ul li:after { position: absolute; content: ""; top: 50%; right: 0; transform: translateY(-50%); width: 0.1rem; height: 2rem; background: #cacaca; }
nav ul li:nth-child(7):after, nav ul li:last-child:after { display: none; }
nav ul li a { font-size: 1.4rem; /* font-weight: bold; */ line-height: 1.2; position: relative; display: block; box-sizing: border-box; width: 100%; /* padding: 0.125rem 1.5rem; */ text-align: center; white-space: nowrap; text-decoration: none; color: #000; letter-spacing: 0.2rem; transition: 0.25s all; }
nav ul li a:hover { color: #4cbabf; }

/* ------------------------ */
/* ------------------------ */
a.anchor { position: absolute; top: -6rem; }
section { font-size: 1.8rem; line-height: 2; padding-top: 4rem; padding-bottom: 4rem; }
section div.inner { max-width: 150rem; margin-left: auto; margin-right: auto; }
section div.titles-wrap { margin-bottom: 4rem; position: relative; }
section div.titles-wrap div.title { margin-bottom: 0; text-align: center; }
section div.titles-wrap div.title h2 { font-size: 3.0rem; font-weight: bold; letter-spacing: 0.25rem; color: #323c46; position: relative; }
section div.titles-wrap div.description { font-size: 1.3rem; color: #788898; font-weight: bold; letter-spacing: 0.25rem; text-align: center; }
section div.titles-wrap div.more-link { position: absolute; /* right: calc((100vw - 120rem) / 2); */ right: 4rem; top: 1rem; }
@media only screen and (max-width: 150rem) { section div.titles-wrap div.more-link { right: 4rem; }}
section div.titles-wrap div.more-link a { color: #ff90bd; border: 0.2rem solid #ff90bd; font-size: 1.2rem; padding: 0.75rem 4rem; text-decoration: none; border-radius: 1000rem; position: relative; transition: all 0.2s ease-in-out 0s; }
section div.titles-wrap div.more-link a:after { border-right: 0.15rem solid #ff90bd; border-top: 0.15rem solid #ff90bd; content: ""; display: block; height: 0.25rem; right: 0.5rem; position: absolute; top: 50%; transform: translateX(-50%) translateY(-50%) rotate(45deg); transition: all 0.2s ease-in-out 0s; width: 0.25rem; }
section div.titles-wrap div.more-link a:hover { color: #fff; background: #ff90bd; }
section div.titles-wrap div.more-link a:hover:after { border-right: 0.15rem solid #fff; border-top: 0.15rem solid #fff; }
section div.titles-wrap div.title h2 span {}
section div.titles-wrap div.title h2:after {}
section div.titles-wrap div.title span.material-icons { display: block; color: #000; font-size: 4rem; }
body.top div.link a { display: block; padding-top: 1rem; padding-bottom: 1rem; box-sizing: border-box; text-align: center; color: #ff90bd; text-decoration: none; font-weight: bold; position: relative; /* background: #e8eaeb; */
  border: 0.2rem solid #ff90bd; transition: 0.25s all; border-radius: 1000rem; }
body.top div.link a:before { border-right: 0.15rem solid #ff90bd; border-top: 0.15rem solid #ff90bd; content: ""; display: block; height: 0.5rem; right: 1rem; position: absolute; top: 50%; transform: translateX(-50%) translateY(-50%) rotate(45deg); transition: all 0.2s ease-in-out 0s; width: 0.5rem; }
body.top div.link a:hover { background: #ff90bd; color: #fff; }
body.top div.link a:hover:before { border-right: 2px solid #fff; border-top: 2px solid #fff; }
body.top div.link a.active { background: #8dc031; color: #fff; pointer-events: none; }
body.top div.link a.active:hover:after { display: none; }
body.top div.link a.active:after { display: none; }

/* */
/* ------------------------ */
section.top { position: relative; padding-left: 4rem; padding-right: 8rem; box-sizing: border-box; }
section.top:before { background: #fff99b; position: absolute; top: -4rem; left: calc(50% + 1rem); content: ""; width: calc(50% - 4rem); height: calc(50% + 4rem); max-width: 79rem; z-index: 0; border-radius: 1rem 1rem 0 0; }
section.top:after { background: #4cbabf; position: absolute; bottom: 4rem; left: calc(50% + 1rem); content: ""; width: calc(50% - 4rem); /* height: calc(50% + 4rem); */
  height: 50%; max-width: 79rem; z-index: 0; border-radius: 0 0 1rem 1rem; }
section.top div.inner { z-index: 1000; position: relative; /* max-width: inherit; */
  overflow: visible; visibility: visible; padding: 0; }
section.top div.copy { font-size: 3.6rem; font-weight: normal; letter-spacing: 1rem; line-height: 1.75; margin-bottom: 4rem; color: #323c46; padding-left: 3rem; white-space: nowrap; transition: 0.25s all; transform: skew(-2.5deg); }
section.top div.copy span { display: inline-block; position: relative; z-index: 1; }
section.top div.copy span:before { position: absolute; bottom: 1rem; left: 0; height: 1.5rem; width: 100%; background: #fff99b; content: ""; z-index: -1; }
section.top div.copy-search-area { width: 40.0%; position: absolute; left: calc(1200); top: 40%; padding-left: 3rem; transform: translateY(-50%); z-index: 1000; }
section.top div.copy-search-area div.search-window div.search-lead { color: #4cbabf; font-weight: bold; font-size: 1.6rem; padding-left: 3rem; letter-spacing: 0.1rem; white-space: nowrap; text-shadow: 1px 1px 0 #FFF, -1px -1px 0 #FFF, -1px 1px 0 #FFF, 1px -1px 0 #FFF, 0px 1px 0 #FFF, 0-1px 0 #FFF, -1px 0 0 #FFF, 1px 0 0 #FFF; }
section.top div.copy-search-area div.search-window form#search-form { border: 0.25rem solid #4cbabf; border-radius: 1000rem; overflow: hidden; padding-left: 2rem; padding-right: 2rem; height: 5.5rem; position: relative; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2); margin-bottom: 2rem; background: #fff; }
section.top div.copy-search-area div.search-window form#search-form div.clearfix > div { float: left; }
section.top div.copy-search-area div.search-window form#search-form div.clearfix > div.input-wrap { width: 35.00%; }
section.top div.copy-search-area div.search-window form#search-form div.clearfix > div.input-wrap input { border: none; height: 5rem; width: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; /* -webkit-appearance: none; */ background: none; }
section.top div.copy-search-area div.search-window form#search-form div.clearfix > div.select-wrap.thing { width: 29.50%; position: relative; box-sizing: border-box; }
section.top div.copy-search-area div.search-window form#search-form div.clearfix > div.select-wrap.thing::before { position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 0.1rem; height: 1.5rem; background: #ccc; content: ""; }
section.top div.copy-search-area div.search-window form#search-form div.clearfix > div.select-wrap.thing::after { border-right: 0.2rem solid #4cbabf; border-top: 0.2rem solid #4cbabf; content: ""; display: block; height: 0.5rem; right: 1rem; position: absolute; top: 50%; transform: translateX(-50%) translateY(-50%) rotate(-225deg); transition: all 0.2s ease-in-out 0s; width: 0.5rem; pointer-events: none; }
section.top div.copy-search-area div.search-window form#search-form div.clearfix > div.select-wrap.area { width: 30.50%; position: relative; }
section.top div.copy-search-area div.search-window form#search-form div.clearfix > div.select-wrap.area::before { position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 0.1rem; height: 1.5rem; background: #ccc; content: ""; }
section.top div.copy-search-area div.search-window form#search-form div.clearfix > div.select-wrap.area::after { border-right: 0.2rem solid #4cbabf; border-top: 0.2rem solid #4cbabf; content: ""; display: block; height: 0.5rem; right: 1rem; position: absolute; top: 50%; transform: translateX(-50%) translateY(-50%) rotate(-225deg); transition: all 0.2s ease-in-out 0s; width: 0.5rem; pointer-events: none; }

/* ----------- reset */
section.top div.copy-search-area div.search-window form#search-form select { -webkit-appearance: none; -moz-appearance: none; appearance: none; height: 5rem; /* */ border: none; padding: 0; cursor: pointer; background: none; box-sizing: border-box; padding-left: 1rem; padding-right: 2rem; width: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
section.top div.copy-search-area div.search-window form#search-form::-ms-expand { display: none; }
section.top div.copy-search-area div.search-window form#search-form select:focus { -webkit-appearance: none; -moz-appearance: none; appearance: none; /* box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(102, 175, 233, 0.6); */ box-shadow: none; outline: none; }

/* ----------- */
section.top div.copy-search-area div.search-window form#search-form div.clearfix > button { position: absolute; top: 50%; right: 0.25rem; width: 4.5rem; height: 4.5rem; background: #4cbabf; transform: translateY(-50%); border: none; border-radius: 1000rem; }
section.top div.copy-search-area div.search-window form#search-form div.clearfix > button span { color: #fff; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); position: absolute; font-size: 3.5rem; }

/* ----------- */
section.top div.copy-search-area div.search-window div.popular-keywords { box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2); padding: 1rem 2rem; border-radius: 0.5rem; background: #fff; width: calc(100% - 8rem); margin-left: auto; margin-right: auto; }
section.top div.copy-search-area div.search-window div.popular-keywords div.heading { color: #4cbabf; font-size: 1.6rem; font-weight: bold; letter-spacing: 0.2rem; }
section.top div.copy-search-area div.search-window div.popular-keywords div.heading span { vertical-align: middle; position: relative; top: -0.25rem; margin-right: 1rem; }
section.top div.copy-search-area div.search-window div.popular-keywords ul li { display: inline-block; color: #323c46; font-size: 1.4rem; margin-bottom: 1rem; }
section.top div.copy-search-area div.search-window div.popular-keywords ul li a { color: #323c46; }
section.top div.copy-search-area div.search-window div.popular-keywords ul li a:hover { color: #4cbabf; }

/* ------------------------ */
div.main-visual-slider { width: 60%; float: left; left: 42.25%; border-radius: 0.5rem 0 0 0.5rem; position: relative; top: -6rem; /* top: 50%; *//* transform: translateY(-50%); */ z-index: 0; }
div.main-visual-slider ul { position: relative; }
div.main-visual-slider ul li { position: relative; z-index: 0; }
div.main-visual-slider ul li a { position: relative; z-index: 1; display: block; }
div.main-visual-slider ul li a:after { content: ""; position: relative; padding-top: 56.25%; }
div.main-visual-slider img { overflow: hidden; border-radius: 1rem; }
div.main-visual-slider .flexslider { overflow: visible; }
div.main-visual-slider ul li div.information { position: absolute; bottom: -7rem; background: rgba(255, 255, 255, 0.9); max-width: 60rem; right: 2rem; padding: 1rem 2rem; box-sizing: border-box; border-radius: 0.5rem; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2); transition: 0.25s all; }

/* --------------------  */
div.main-visual-slider ul li div.information div.category-display { font-size: 1.2rem; border-bottom: 0.1rem solid #4cbabf; color: #4cbabf; /* margin-bottom: 0.5rem; padding-bottom: 0.5rem; */ }
div.main-visual-slider ul li div.information div.heading { color: #323c46; font-size: 1.8rem; /* letter-spacing: 0.2rem; */ line-height: 1.25; padding-top: 0.75rem; }
div.main-visual-slider ul li div.information div.description { font-size: 1.3rem; color: #323c46; display: none; }
div.main-visual-slider .flexslider ul.slides li a { /* overflow: hidden; */ }
div.main-visual-slider ul li a:hover div.information div.heading { color: #4cbabf; }
/* div.main-visual-slider ul li a:hover div.information { 	bottom: 0; } */

/*------------------------ */
body.top div.articles-inner { /* overflow: hidden; *//* padding-left: calc((100vw - 150rem + 4rem) / 2); */ max-width: 150rem; margin-left: auto; margin-right: auto; overflow: hidden; }
body.top div.articles-list-wrap { position: relative; margin-bottom: 2rem; }

/* ----------------------------------- start - end */
/* start */
body.top div.articles-list-wrap:before { content: ""; background: #4cbabf; width: 0.2rem; height: 0.2rem; position: absolute; right: 6.25rem; top: -4rem; transform: translateY(-50%); transition: all 0.125s ease 0s; z-index: 1; animation-duration: 1.5s; animation-fill-mode: both; animation-iteration-count: infinite; animation-name: slideInDownScroll; }
body.top div.articles-list-wrap:after { border-right: 0.2rem solid #4cbabf; border-top: 0.2rem solid #4cbabf; content: ""; display: block; height: 1.0rem; pointer-events: none; position: absolute; right: 4rem; top: -4rem; transform: translateX(-50%) translateY(-50%) rotate(45deg); transition: all 0.1s; width: 1.0rem; }
@keyframes slideInDownScroll { 0% { width: 0; opacity: 0; right: 8.25rem; transform: translateY(-50%); }
  10% { opacity: 0; }
  90% { opacity: 1; }
  100% { width: 3rem; opacity: 0; right: 5.25rem; transform: translateY(-50%); }
}
@-webkit-keyframes slideInDownScroll { 0% { width: 0; opacity: 0; right: 8.25rem; transform: translateY(-50%); }
  10% { opacity: 0; }
  90% { opacity: 1; }
  100% { width: 3rem; opacity: 0; right: 5.25rem; transform: translateY(-50%); }
}
.slideInDownScroll { animation-name: slideInDown; }

/* end */
body.top section.recommended div.titles-wrap:before { /* background: url(../img/deco-osusume.png); background-size: 18rem 3rem; display: block; position: absolute; top: -4rem; left: 0; width: 18rem; height: 3rem; content: ""; */ }
body.top div.articles-list-wrap.end:before { display: none; opacity: 0 !important; }
body.top div.articles-list-wrap.end:after { border-right: 0.2rem solid #4cbabf; border-top: 0.2rem solid #4cbabf; content: ""; display: block; height: 1.5rem; pointer-events: none; position: absolute; right: 4rem; top: -4rem; transform: translateX(-50%) translateY(-50%) rotate(225deg); transition: all 0.2s ease-in-out 0s; width: 1.5rem; }
body.top div.articles-list { width: 100%; position: relative; }
body.top div.articles-list { overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; transition: all .4s; display: block; position: relative; /* margin-bottom: -2rem; */ padding-bottom: 2rem; }
body.top div.articles-list ul { white-space: nowrap; font-size: 0; }
body.top div.articles-list ul li { display: inline-block; vertical-align: top; width: 24vw; max-width: 27.2rem; margin-right: 3rem; /* margin-bottom: 2rem; */ }
body.top div.articles-list ul li:hover {}
body.top div.articles-list ul li a { display: block; padding: 1rem; border-radius: 1rem; transition: 0.1s all; }
body.top div.articles-list ul li a:hover { background: #f1f4f7; }
body.top div.articles-list ul li a div.thumbnail { position: relative; margin-bottom: 1.5rem; overflow: hidden; border-radius: 1rem; background: #f1f4f7; }
body.top div.articles-list ul li a div.thumbnail span { display: block; /* padding-top: 75%; */ padding-top: 66.66%; position: relative; }
body.top div.articles-list ul li a div.thumbnail span img { position: absolute; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); max-width: 100%; height: auto; width: 100%; }
body.top div.articles-list ul li a div.heading { white-space: normal; font-size: 1.9rem; color: #323c46; text-decoration: none; margin-bottom: 1rem; font-weight: bold; line-height: 1.5; }
body.top div.articles-list ul li a div.description { white-space: normal; font-size: 1.4rem; color: #323c46; }
body.top div.articles-list ul li a { text-decoration: none; }
body.top div.articles-list ul li a div.area-label { white-space: normal; font-size: 1.3rem; border: 0.1rem solid #aaaaaa; display: inline-block; color: #aaa; padding: 0.125rem 1rem; background: #fff; }

/* ------------------------ */
body section.articles.recommended div.link { max-width: calc(30% - 4rem); margin-left: auto; margin-right: auto; }
body section.season div.link { max-width: calc(30%); margin-left: auto; margin-right: auto; }
body section.articles.season {}
body.top section.articles.season {}
body.top section.season div.articles-list { display: block; overflow: hidden; padding-bottom: 2rem; position: relative; transition: all 0.4s ease 0s; }
body.top section.season div.articles-list ul { font-size: 0; white-space: normal; clear: both; overflow: hidden; max-width: 150rem; margin-left: auto; margin-right: auto; }
body.top section.season div.articles-list ul li { display: block; float: left; margin-right: 2%; max-width: inherit; vertical-align:top; width: 32%; }
body.top section.season div.articles-list ul li:nth-child(3n) { margin-right: 0; }
body.top section.season div.articles-list ul li a div.thumbnail span { display: block; padding-top: 75.00%; position: relative; }

/* ------------------------ */
section.search-thing-map { overflow: hidden; }
section.search-thing-map div.inner { /* padding-left: 4rem; padding-right: 4rem; */ box-sizing: border-box; /* max-width: 100%; */ }
section.search-thing-map div.thing-wrap { float: left; width: 48%; margin-right: 4%; }
section.search-thing-map div.select-category { margin-bottom: 4rem; }
section.search-thing-map div.select-category ul { font-size: 0; white-space: nowrap; text-align: center; }
section.search-thing-map div.select-category ul li { display: inline-block; margin-right: 1%; width: calc(24.25%); }
section.search-thing-map div.select-category ul li:nth-child(4) { margin-right: 0; }
section.search-thing-map div.select-category ul li span { background: #e8eaeb; font-size: 1.5rem; color: #323c46; display: block; /* width: 16rem; */ text-align: center; border-radius: 1000rem; text-decoration: none; cursor: pointer; transition: 0.25s all; }
section.search-thing-map div.select-category ul li.active span, section.search-thing-map div.select-category ul li:hover span { background: #4cbabf; color: #fff; }
section.search-thing-map div.recommended-articles-wrap {}
section.search-thing-map div.recommended-articles-wrap div.link { max-width: calc(85% - 2rem); margin-left: auto; margin-right: auto; }
section.search-thing-map div.recommended-articles-wrap ul li { float: left; width: 48%; margin-right: 4%; margin-bottom: 2rem; }
section.search-thing-map div.recommended-articles-wrap ul li:nth-child(2n) { margin-right: 0; }
section.search-thing-map div.recommended-articles-wrap ul li a { color: #323c46; text-decoration: none; }
section.search-thing-map div.recommended-articles-wrap ul li a div.thumbnail { position: relative; margin-bottom: 1.0rem; overflow: hidden; border-radius: 1rem; background: #f1f4f7; }
section.search-thing-map div.recommended-articles-wrap ul li a div.thumbnail span { display: block; padding-top: 75%; position: relative; }
section.search-thing-map div.recommended-articles-wrap ul li a div.thumbnail span img { position: absolute; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); max-width: 100%; height: auto; width: 100%; }
section.search-thing-map div.recommended-articles-wrap ul li a div.heading { line-height: 1.5; font-weight: bold; }
section.search-thing-map div.recommended-articles-wrap ul li a div.description { font-size: 1.4rem; }
section.search-thing-map div.recommended-articles-wrap div.recommended-article { display: none; }
section.search-thing-map div.recommended-articles-wrap div.recommended-article.active { display: block; }

/* */
section.search-thing-map div.map-wrap { float: right; width: 48%; background: #99daff; border-radius: 1.5rem; position: relative; padding: 4rem; box-sizing: border-box; }
section.search-thing-map div.map-wrap:before { width: calc(100% - 4rem); height: calc(100% - 4rem); content: ""; border: 0.1rem solid #fff; border-radius: 1.5rem; position: absolute; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); pointer-events: none; }
section.search-thing-map div.map-wrap:after { background: #fff99b; width: 100%; height: 100%; position: absolute; content: ""; bottom: -4rem; left: 12rem; border-radius: 1.5rem; z-index: -1; pointer-events: none; }
section.search-thing-map div.map-wrap div.map-title { width: 18rem; margin-left: auto; margin-right: auto; }

/* */
section.search-thing-map div.map-wrap div.map-description { font-size: 1.3rem; text-align: center; }
section.search-thing-map div.map-wrap div.map-description span.lead { font-size: 1.8rem; }
section.search-thing-map div.map-wrap div.link { margin-top: 1.5rem; }
section.search-thing-map div.map-wrap div.link a { background: #fff; }
section.search-thing-map div.map-wrap div.link a:before { border-right: 0.15rem solid #ff90bd; border-top: 0.15rem solid #ff90bd; content: ""; display: block; height: 0.5rem; right: 1rem; position: absolute; top: 50%; transform: translateX(-50%) translateY(-50%) rotate(45deg); transition: all 0.2s ease-in-out 0s; width: 0.5rem; }
section.search-thing-map div.map-wrap div.link a:hover { background: #ff90bd; color: #fff; }
section.search-thing-map div.map-wrap div.link a:hover:before { border-right: 2px solid #fff; border-top: 2px solid #fff; }

/* ------------------------ */
section.digital-map {}
section.digital-map div.digital-map { position: relative; padding-top: 65%; margin-bottom: 4rem; max-width: 100rem; margin-left: auto; margin-right: auto; border-radius: 1rem; overflow: hidden; }
section.digital-map div.digital-map iframe { width: 100%; height: 100%; position: absolute; left: 0; top: 0; }
section.digital-map div.link { max-width: calc(30%); margin-left: auto; margin-right: auto; }
section.digital-map div.extra-banner { max-width: 100rem; margin-left: auto; margin-right: auto; text-align: center; }
section.digital-map div.extra-banner div.extra-banner-description { position: relative; display: inline-block; color: #323c46; font-weight: bold; letter-spacing: 0.1rem; line-height: 1.5; }
section.digital-map div.extra-banner div.extra-banner-description:before { position: absolute; top: 50%; left: -2rem; transform: translateY(-50%) rotate(-30deg); width: 0.2rem; height: 2rem; background: #323c46; content: ""; }
section.digital-map div.extra-banner div.extra-banner-description:after { position: absolute; top: 50%; right: -2rem; transform: translateY(-50%) rotate(30deg); width: 0.2rem; height: 2rem; background: #323c46; content: ""; }
section.digital-map div.extra-banner img { margin-left: auto; margin-right: auto; display: block; margin-bottom: 4rem; max-width: 60%; }

/* ------------------------ */
body.top section.topics { /* padding-top: 4rem; */}
section.topics { position: relative; background: #fff; padding-top: 1rem; }
section.topics div.titles-wrap { text-align: center; }
section.topics div.topics-category { text-align: center; }
section.topics div.topics-category ul { font-size: 0; white-space: nowrap; }
section.topics div.topics-category ul li { display: inline-block; margin-right: 2rem; margin-bottom: 2rem; }
section.topics div.topics-category ul li:last-child { margin-right: 0; }
section.topics div.topics-category ul li span { background: #f1f4f7; font-size: 1.6rem; display: block; width: 16rem; text-align: center; border-radius: 0.25rem; text-decoration: none; color: #000; transition: 0.25s all; cursor: pointer; }
section.topics div.topics-category ul li:hover span, section.topics div.topics-category ul li.active span { background: #4cbabf; color: #fff; }
body.top div.list-display { display: none; }
body.top div.list-display.active { display: block; }

/* ---------------------------------------------- */
/* 見出し - を - 別途 掲載する 場合 - */
div.list-display h4 { max-width: 90rem; margin-left: auto; margin-right: auto; }
div.list-display div.title { font-size: 2.8rem; /* font-weight: bold; */
  letter-spacing: 0.5rem; margin-bottom: 2rem; text-align: center; max-width: 90rem; margin-left: auto; margin-right: auto; }
div.list-display div.sub-title { font-size: 1.8rem; font-weight: bold; padding-bottom: 1rem; padding-top: 1rem; letter-spacing: 0.5rem; margin-bottom: 2rem; text-align: center; /* border-bottom: 0.1rem solid #cacaca; */ background: #f1f4f7; max-width: 90rem; margin-left: auto; margin-right: auto; border-radius: 0.75rem; }
div.list-display div.link { margin-left: auto; margin-right: auto; max-width: calc(30% - 4rem); margin-bottom: 6rem; }
div.list-display div.link a { border: 0.2rem solid #ff90bd; border-radius: 1000rem; box-sizing: border-box; color: #ff90bd; display: block; font-weight: bold; padding-bottom: 1rem; padding-top: 1rem; position: relative; text-align: center; text-decoration: none; transition: all 0.25s ease 0s; }
div.list-display div.link a:before { border-right: 0.15rem solid #ff90bd; border-top: 0.15rem solid #ff90bd; content: ""; display: block; height: 0.5rem; right: 1rem; position: absolute; top: 50%; transform: translateX(-50%) translateY(-50%) rotate(45deg); transition: all 0.2s ease-in-out 0s; width: 0.5rem; }
div.list-display div.link a:hover { background: #ff90bd; color: #fff; }
div.list-display div.link a:hover:before { border-right: 2px solid #fff; border-top: 2px solid #fff; }

/* */
div.list-display ul { margin-bottom: 4rem; position: relative; margin-left: auto; margin-right: auto; max-width: 90rem; }
div.list-display ul li { position: relative; }
div.list-display ul li:first-child a { border-top: 0.1rem solid #cacaca; }
div.list-display ul li a { color: #000; display: block; padding-top: 1.25rem; padding-bottom: 1.25rem; border-bottom: 0.1rem solid #cacaca; font-size: 1.6rem; position: relative; width: 100%; padding-left: 1.25rem; padding-right: 5rem; box-sizing: border-box; transition: 0.125s all; }
div.list-display ul li a:hover { background: #f1f4f7; }
div.list-display ul li:before { background: #323c46; content: ""; height: 4rem; right: 1rem; margin: auto; position: absolute; top: 50%; transform: translateY(-50%); width: 4rem; z-index: 1; transition: 0.125s all; border-radius: 1000rem; pointer-events: none; }
div.list-display ul li:after { border-right: 0.2rem solid #fff; border-top: 0.2rem solid #fff; content: ""; display: block; height: 0.75rem; position: absolute; right: 2.2rem; top: 50%; transform: translateX(-50%) translateY(-50%) rotate(45deg); transition: all 0.2s ease-in-out 0s; width: 0.75rem; z-index: 2; pointer-events: none; }
div.list-display ul li a div.thumbnail { position: relative; overflow: hidden; border-radius: 0.5rem; float: left; width: 12rem; margin-right: 2rem; background: #f1f4f7; }
div.list-display ul li a div.thumbnail span { display: block; padding-top: 75%; position: relative; }
div.list-display ul li a div.thumbnail span img { position: absolute; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); max-width: 100%; height: auto; width: 100%; }
div.list-display ul li a div.details-information { line-height: 1.5; }
div.list-display ul li a div.thumbnail + div.details-information { float: left; width: calc(100% - 16rem); }
div.list-display ul li a div.heading { font-size: 1.6rem; }
div.list-display ul li a div.description { font-size: 1.4rem; }
div.list-display ul li a div.category-label-display { font-size: 1.2rem; color: #788898; }
div.list-display ul li a div.area-display { font-size: 1.2rem; color: #788898; }
div.list-display ul li a div.update { margin-top: 1rem; font-size: 1.2rem; }
div.list-display ul li a div.category-new-wrap { font-size: 1.2rem; }
div.list-display ul li a div.category-new-wrap span.category { font-size: 1.2rem; }
div.list-display ul li a div.category-new-wrap span.new { border: 0.1rem solid #ff80b4; padding: 0.125rem 1rem; border-radius: 1000rem; color: #ff80b4; font-size: 1.0rem; }

/* */
/* 2 カラム の とき */
div.list-display.column-02 ul {}
div.list-display.column-02 ul li { float: left; width: 49%; margin-right: 2%; margin-bottom: 2rem; }
div.list-display.column-02 ul li:nth-child(2n) { margin-right: 0; }
div.list-display.column-02 ul li a { border: 0.1rem solid #ddd; /* border-bottom: 0.1rem solid #ddd; */ border-radius: 0.75rem; }
div.list-display.column-02 ul li:before { /* border-radius: 0.75rem; */ }
div.list-display.column-02 ul li::before { height: 2.5rem; width: 2.5rem; }
div.list-display.column-02 ul li::after { border-right: 0.2rem solid #fff; border-top: 0.2rem solid #fff; height: 0.5rem; right: 1.65rem; width: 0.5rem; }

/* 5 カラム の とき */
div.list-display.column-05 ul {}
div.list-display.column-05 ul li { float: left; width: 18.4%; margin-right: 2%; margin-bottom: 2rem; }
div.list-display.column-05 ul li:nth-child(5n) { margin-right: 0; }
div.list-display.column-05 ul li a { border: 0.1rem solid #ddd; /* border-bottom: 0.1rem solid #ddd; */ border-radius: 0.75rem; padding: 0.5rem; }
div.list-display.column-05 ul li::before, div.list-display.column-05 ul li::after { display: none; }
div.list-display.column-05 ul li a div.thumbnail { float: none; width: calc(100%); margin-right: 0; margin-bottom: 1rem; }
div.list-display.column-05 ul li a div.thumbnail span {}
div.list-display.column-05 ul li a div.thumbnail span img {}
div.list-display.column-05 ul li a div.details-information {}
div.list-display.column-05 ul li a div.thumbnail + div.details-information { float: none; width: calc(100%); }

/* -----------------------------------ss--------------------------------- 観光情報  */
/* categorylist の 変更 */
div.category-tree-display { /* background: #f8f8f8; */ text-align: left; padding: 1rem; border: 0.3rem double #ccc; border-radius: 0.5rem; max-width: 94rem; margin-left: auto; margin-right: auto; }
div.category-tree-display a { color: #4cbabf; font-weight: bold; text-decoration: underline; }
div.category-tree-display a:hover { text-decoration: none; }

/* ---------------------------------------------- */
div.list-display.card ul { clear: both; overflow: hidden; width: 100%; max-width: inherit; }
div.list-display.card ul li { float: left; width: 31%; margin-right: 3.5%; margin-bottom: 3rem; border-radius: 0.5rem; overflow: hidden; }
div.list-display.card ul li:nth-child(3n) { margin-right: 0; }
div.list-display.card ul li a { padding: 1.25rem 1.25rem 1.25rem 1.25rem; border: none; }
div.list-display.card ul li a div.thumbnail { position: relative; overflow: hidden; border-radius: 0.5rem; float: none; width: 100%; margin-right: 0; margin-bottom: 1rem; }
div.list-display.card ul li a div.thumbnail + div.details-information { float: none; width: 100%; }
div.list-display.card ul li::before, div.list-display.card ul li::after { display: none; }
div.list-display.card ul li a div.details-information div.heading { font-size: 1.6rem; margin-bottom: 0.5rem; font-weight: bold; }
div.list-display.card ul li a div.details-information div.description { font-size: 1.4rem; }

/* ---- */
section.topics div.link { /* font-size: 1.2rem; *//* max-width: 26rem; */ max-width: 30%; box-sizing: border-box; margin-left: auto; margin-right: auto; /* padding-top: 0.5rem; padding-bottom: 0.5rem; */ }

/* ------------------------ */
section.calendar div.titles-wrap { text-align: center; }
section.calendar ul { max-width: 150rem; margin-left: auto; margin-right: auto; }
section.calendar ul li { float: left; width: 33.33%; text-align: center; }
section.calendar ul li a { display: block; color: #323c46; text-decoration: none; opacity: 1; transition: 0.25s all; }
section.calendar ul li a:hover { opacity: 0.75; background: #f0f0f0; }
section.calendar ul li div.thumbnail { margin-bottom: 0.25rem; }
section.calendar ul li div.thumbnail span {}
section.calendar ul li div.thumbnail img { width: 100%; }
section.calendar ul li div.heading { font-size: 1.8rem; font-weight: bold; margin-bottom: 0.125rem; }
section.calendar ul li div.description { font-size: 1.6rem; /* font-weight: bold; */ }

/* ------------------------ */
section.movie-sns {}
section.movie-sns div.titles-wrap div.title { text-align: center; }
section.movie-sns div.movie { float: left; width: 48%; margin-right: 4%; }
section.movie-sns div.movie div.youtube-wrap { position: relative; padding-bottom: 56.25% !important; height: 0; overflow: hidden; margin-bottom: 4rem; }
section.movie-sns div.movie div.youtube-wrap iframe, section.movie-sns div.movie div.youtube-wrap object, section.movie-sns div.movie div.youtube-wrap a { position: absolute; top: 0; left: 0; width: 100% !important; height: 100% !important; border: none; }
section.movie-sns div.movie div.banner-sorakara { border: 0.1rem solid #e8eaeb; box-sizing: border-box; margin-bottom: 4rem; }
section.movie-sns div.sns-display { float: left; width: 48%; }
section.movie-sns div.sns-display div.sns-link ul {}
section.movie-sns div.sns-display div.sns-link ul li { display: block; margin-bottom: 2rem; width: 25%; float: left; text-align: center; position: relative; cursor: pointer; padding-top: 0.5rem; padding-bottom: 0.5rem; border-radius: 0.5rem; transition: 0.25s all; }
section.movie-sns div.sns-display div.sns-link ul li:hover { background: #f8f8f8; }
section.movie-sns div.sns-display div.sns-link ul li:before { background: #ff90bd; width: 50%; height: 0; position: absolute; bottom: -1rem; left: 50%; transform: translateX(-50%); content: ""; transition: 0.25s all; }
section.movie-sns div.sns-display div.sns-link ul li.active:before { height: 0.25rem; }
section.movie-sns div.sns-display div.sns-link ul li span { cursor: pointer; }
section.movie-sns div.sns-display div.sns-link ul li img { width: 4rem; /* -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); filter: grayscale(100%); */ }
section.movie-sns div.sns-display div.sns-link ul li:hover img, section.movie-sns div.sns-display div.sns-link ul li.active img { /* -webkit-filter: grayscale(0); -moz-filter: grayscale(0); -ms-filter: grayscale(0); filter: grayscale(0); */ }
section.movie-sns div.sns-display div.sns-display-wraps { max-width: 48rem; margin-left: auto; margin-right: auto; }
section.movie-sns div.sns-display div.sns-display-wraps div.sns-display-wrap { display: none; }
section.movie-sns div.sns-display div.sns-display-wraps div.sns-display-wrap.active { display: block; border: 0.2rem solid #e8eaeb; }

/* */
section.movie-sns div.sns-display div.sns-display-wraps div.sns-display-wrap.facebook > .fb-page { width: 100% !important; }
section.movie-sns div.sns-display div.sns-display-wraps div.sns-display-wrap.facebook > .fb-page > span, section.movie-sns div.sns-display div.sns-display-wraps div.sns-display-wrap.facebook iframe { height: 48rem !important; width: 100% !important; }
section.movie-sns div.sns-display div.sns-display-wraps div.sns-display-wrap.facebook img { display: block !important; width: 100% !important; }

/* */
section.movie-sns div.sns-display div.sns-display-wraps div.sns-display-wrap.youtube div.youtube-wrap { position: relative; padding-bottom: 56.25% !important; height: 0; overflow: hidden; margin-bottom: 1rem; }
section.movie-sns div.sns-display div.sns-display-wraps div.sns-display-wrap.youtube div.youtube-wrap iframe { position: absolute; top: 0; left: 0; width: 100% !important; height: 100% !important; border: none; }
section.movie-sns div.sns-display div.sns-display-wraps div.sns-display-wrap.youtube div.link { width: 80%; margin-left: auto; margin-right: auto; margin-bottom: 1rem; }
section.movie-sns div.link { max-width: calc(85% - 2rem); margin-left: auto; margin-right: auto; }

.youtube { position:relative; width:100%; box-sizing:border-box; overflow:hidden; }
.youtube iframe { border:none; width:100% !important; height:100% !important; aspect-ratio:16/9; vertical-align:bottom; }

/* ------------------------ */
div.scroller { background: #323c46; bottom: 1rem; display: block; height: 6rem; position: fixed; right: 1rem; width: 6rem; z-index: 2000; border-radius: 1000rem; }
div.scroller div.button { height: 6rem; position: absolute; top: 0; width: 6rem; }
div.scroller div.button a { display: block; height: 6rem; position: relative; width: 6rem; }
div.scroller div.button a::before { border-right: 0.2rem solid #fff; border-top: 0.2rem solid #fff; content: ""; display: block; height: 1rem; left: 50%; position: absolute; top: 50%; transform: translateX(-50%) translateY(-50%) rotate(-45deg); transition: all 0.2s ease-in-out 0s; width: 1rem; }

/* ------------------------ */
footer { background: #323c46; color: #fff; text-align: center; z-index: 1000; position: relative; }
footer div.logo { margin-left: auto; margin-right: auto; max-width: 30rem; margin-bottom: 2rem; }
footer div.logo div.site-name-addition { color: #898971; font-weight: normal; letter-spacing: 0.1rem; }
footer div.footer-utility ul.utility { border-bottom: 0.1rem solid #5f5f5f; }
footer div.footer-utility ul.utility { padding-top: 1.5rem; padding-bottom: 1.5rem; font-size: 0; }
footer div.footer-utility ul.other-link { padding-top: 1.5rem; padding-bottom: 1.5rem; font-size: 0; border-bottom: 0.1rem solid #5f5f5f; }
footer div.footer-utility ul.other-link li { font-size: 1.4rem; padding-left: 1.5rem; padding-right: 1.5rem; }
footer div.footer-utility ul li { display: inline-block; font-size: 1.6rem; padding-left: 3rem; padding-right: 3rem; position: relative; }
footer div.footer-utility ul li:before { width: 0.1rem; height: 1.5rem; display: block; background: #5f5f5f; position: absolute; content: ""; left: 0; top: 50%; transform: translateY(-50%); }
footer div.footer-utility ul li a { text-decoration: none; display: block; color: #fff; transition: 0.25s all; }
footer div.footer-utility ul li a:hover { color: #4cbabf; }
footer div.logo { margin-top: 2rem; }
footer a { color: #fff; }
footer a[href^="tel:"] { color: #fff !important; }
footer div.sns-link ul { font-size: 0; }
footer div.sns-link ul li { display: inline-block; margin-bottom: 2rem; margin-right: 1rem; }
footer div.sns-link img,  .sns-link img { width: 3rem; }
footer div.sns-link ul li:nth-child(3) img { position: relative; top: -0.25rem; }
footer div.copyright { background: #0a0e13; padding-top: 1rem; padding-bottom: 1rem; font-size: 1.6rem; letter-spacing: 0.1rem; }

/* ------------------------ 検索窓 トップページ - 以外 - の */
header.opacity div.search-window { /* top: 6rem; */ }
header div.search-window { clear: both; max-width: 60rem; /* float: right; */ position: absolute; right: 0; top: 7rem; transition: all 0.4s ease 0s; }
header div.search-window form#search-form { border: 0.25rem solid #4cbabf; border-radius: 1000rem; padding-left: 2rem; padding-right: 2rem; height: 4.5rem; position: relative; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2); background: #fff; box-sizing: border-box !important; }
header div.search-window form#search-form div.clearfix > div { float: left; }
header div.search-window form#search-form div.clearfix > div.input-wrap { width: 40.00%; }
header div.search-window form#search-form div.clearfix > div.input-wrap input { border: none; height: 4.0rem; width: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; /* -webkit-appearance: none; */ background: none; font-size: 1.5rem; padding:0;  }
header div.search-window form#search-form div.clearfix > div.select-wrap.thing { width: 24.50%; position: relative; box-sizing: border-box; }
header div.search-window form#search-form div.clearfix > div.select-wrap.thing::before { position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 0.1rem; height: 1.5rem; background: #ccc; content: ""; }
header div.search-window form#search-form div.clearfix > div.select-wrap.thing::after { border-right: 0.2rem solid #4cbabf; border-top: 0.2rem solid #4cbabf; content: ""; display: block; height: 0.5rem; right: 1rem; position: absolute; top: 50%; transform: translateX(-50%) translateY(-50%) rotate(-225deg); transition: all 0.2s ease-in-out 0s; width: 0.5rem; pointer-events: none; }
header div.search-window form#search-form div.clearfix > div.select-wrap.area { width: 30.50%; position: relative; }
header div.search-window form#search-form div.clearfix > div.select-wrap.area::before { position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 0.1rem; height: 1.5rem; background: #ccc; content: ""; }
header div.search-window form#search-form div.clearfix > div.select-wrap.area::after { border-right: 0.2rem solid #4cbabf; border-top: 0.2rem solid #4cbabf; content: ""; display: block; height: 0.5rem; right: 1rem; position: absolute; top: 50%; transform: translateX(-50%) translateY(-50%) rotate(-225deg); transition: all 0.2s ease-in-out 0s; width: 0.5rem; pointer-events: none; }

/* ----------- reset */
header div.search-window form#search-form select { -webkit-appearance: none; -moz-appearance: none; appearance: none; height: 4rem; /* */ border: none; padding: 0; cursor: pointer; background: none; box-sizing: border-box; padding-left: 0.5rem; padding-right: 2rem; width: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 1.5rem; line-height:4.0rem;}
header div.search-window form#search-form::-ms-expand { display: none; }
header div.search-window form#search-form select:focus { -webkit-appearance: none; -moz-appearance: none; appearance: none; /* box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(102, 175, 233, 0.6); */ box-shadow: none; outline: none; }

/* ----------- */
header div.search-window form#search-form div.clearfix > button { position: absolute; top: 50%; right: 0.3rem; width: 3.5rem; height: 3.5rem; background: #4cbabf; transform: translateY(-50%); border: none; border-radius: 1000rem; cursor: pointer; padding: 0; }
header div.search-window form#search-form div.clearfix > button span { color: #fff; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); position: absolute; font-size: 2.5rem; }

/* ----------- */
/* ---------------------------- topicPath */
.topicPath { font-size: 1.2rem; display: block; /* margin: 0 auto 40px; *//* background: #4568DC; *//* background: -webkit-linear-gradient(to right, #B06AB3, #4568DC); background: linear-gradient(to right, #B06AB3, #4568DC); *//* 		background: #f8f8f8; *//* background: #f2f2f0; */ text-align: left; background: #f8f8f8; position: relative; z-index: 0; }
.topicPath ul { padding: 1rem; /* padding-left: 0.5em; padding-right: 0.5em;*/ list-style: none; }
.topicPath ul li { display: inline; }
.topicPath ul li a { font-size: 1.2rem; /* font-weight: bold; */position: relative; padding-right: 1rem; padding-left: 1rem; color: #4cbabf; /* color: #003e6c; */ font-weight: bold; text-decoration: underline; }
.topicPath ul li:first-child a { padding-left: 0; }
.topicPath ul li span { padding-right: 1rem; padding-left: 1rem; }
.topicPath ul li a:before { width: 0.4rem; height: 0.4rem; position: absolute; top: 50%; right: 0; content: ""; /* 	border-top: 1px solid #003e6c; border-right: 1px solid #003e6c; */ border-top: 1px solid #689d38; border-right: 1px solid #689d38; transform: translateX(-50%) translateY(-50%) rotate(45deg); transition: all .2s ease-in; }
.topicPath ul li a:hover { text-decoration: none; }

/* ---------------------------- div.page-title */
div.page-title { /*margin-top: 2rem; *//* margin-bottom: 2rem; */ padding-top: 1rem; padding-bottom: 2rem; /* background: #323c46; */ /* background: #8dc031; */ }
div.page-title div.title { /* border: 0.2rem solid #8dc031; */ padding-top: 3rem; /* padding-bottom: 2rem; */ text-align: center; background: #fff; /* box-shadow: 0 2px 4px rgba(0, 0, 0, 0.09); */ /* border-top: 1rem solid #a4d4ed; border-right: 1rem solid #cba5bd; border-bottom: 1rem solid #e9afbd; border-left: 1rem solid #aed071; */ }
div.page-title div.title h1 { font-size: 3.0rem; letter-spacing: 0.5rem; font-weight: bold; margin-bottom: 0; }
div.page-title div.title h1 div { display: inline-block; }
div.page-title div.title h1 span { color: #8dc031; display: inline-block; }
div.page-title div.description h2 { background: #fff; font-weight: normal; text-align: center; padding-bottom: 1rem; /* reset */ border-top: none; font-size: 1.6rem; font-family: "Yu Gothic", YuGothic, sans-serif, YakuHanJP, -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif; }
div.page-title div.update { /* background: #f8f8f8; */ color: #4cbabf; text-align: center; font-size: 1.4rem; /*font-family: oswald; */ }
div.page-title + div.inner { padding-left: 0; padding-right: 0; /* max-width: 96rem; */ /* */ }
div.page-title div.description div.number { border-radius: 100rem; border: 0.1rem solid #f0f0f0; display: inline-block; padding-left: 1rem; padding-right: 1rem; background: #f8f8f8; white-space: nowrap; }
div.page-title div.description span.material-icons { color: #8dc031; font-size: 1.8rem; vertical-align: middle; position: relative; top: -0.1rem; }

/* ---------------------------- div.map */
div.anchor-wrap { position: relative; }
div.anchor-wrap a { position: absolute; top: -8rem; }
div.areamap { max-width: 76.8rem; margin-left: auto; margin-right: auto; }
div.areamap img { width: 76.8rem; }

/*  */
div.menu-select { padding-top: 4rem; padding-bottom: 4rem; }
div.menu-select ul li { width: 48%; float: left; margin-right: 4%; }
div.menu-select ul li:nth-child(2) { margin-right: 0; }

/* ---------------------------- 観光情報 検索結果 */
div.category-result { text-align: left; padding: 1rem; border-bottom: 0.3rem double #ccc; /* border-radius: 0.5rem; */ max-width: 94rem; margin-left: auto; margin-right: auto; margin-bottom: 2rem; font-size: 1.4rem; }
div.category-result span.category, div.category-result span.count { font-weight: bold; }
div.category-result div.note { color: #fb83b3; font-weight: bold; float: right; font-size: 1.5rem; }

/* ---------------------------- pager */
.pager { border-radius: 4px; display: inline-block; font-size: 0; margin: 20px 0; padding-left: 0; text-align: center; width: 100%; /* font-family: "Oswald", sans-serif; */ }
.pager a, .pager span { /* border: 2px solid #eee; */ box-sizing: border-box; display: inline-block; font-size: 1.4rem; height: 4.2rem; width: 4.2rem; margin-left: 0.25rem; margin-right: 0.25rem; max-width: 4.2rem; padding: 0; text-align: center; /* width: 7.5%; */ vertical-align: top; line-height: 4.2rem; transition: 0.25s all; border-radius: 1000rem; color: #000; }
.pager a.disable { /* pointer-events: none; */ }
.pager .prev { height: 4.2rem; width: 4.2rem; position: relative; }
.pager .prev a::before, .pager .prev span::before { border-right: 0.2rem solid #fff; border-top: 0.2rem solid #fff; content: ""; display: block; height: 5px; left: 50%; position: absolute; top: 50%; transform: translateX(-50%) translateY(-50%) rotate(-135deg);  transition: all 0.2s ease-in-out 0s; width: 5px; }
.pager .next { width: 4.2rem; height: 4.2rem; position: relative; }
.pager .next a::after, .pager .next span::after { border-right: 0.2rem solid #fff; border-top: 0.2rem solid #fff; content: ""; display: block; height: 0.5rem; left: 50%; position: absolute; top: 50%; transform: translateX(-50%) translateY(-50%) rotate(45deg); transition: all 0.2s ease-in-out 0s; width: 0.5rem; }
.pager a::before { display: none; }
.pager a, .pager span { /* box-sizing: border-box; color: #000; display: block; float: left; width: 4.2rem; height: 4.2rem; line-height: 4.2rem; position: relative; text-decoration: none; width: 100%; */ }
.pager a:first-child, .pager a:first-child { margin-left: 0; background: #4cbabf; border-radius: 1000rem; }
.pager a:last-child, .pager a:last-child { background: #4cbabf; border-radius: 1000rem; }
.pager .active a, .pager .active span, .pager .active a:hover, .pager .active span:hover, .pager .active a:focus, .pager .active span:focus { background: #000; color: #fff; cursor: default; z-index: 2; }

/* .pager a:hover, .pager span:hover, .pager a:focus, .pager span:focus { background: #f8f8f8; } */
.pager a.page:hover, .pager a.page:focus { background: #f0f0f0; }
.pager span.current { background: #f0f0f0; }

/* */
.covid19_box { display: block; margin-top: 4rem; margin-bottom: 4rem; text-align: center; width: calc(100% - 2rem); margin-left: auto; margin-right: auto; }
.covid19_box a { border: 0.25rem solid #f84b45; display: inline-block; font-size: 1.8rem; margin: auto; padding: 1rem 3rem; width: auto; letter-spacing: 0.125rem; color: #f84b45; transition: 0.5s all; }
.covid19_box a:hover { background: #f84b45; color: #fff; }

/* ---------------------------- banner */
div.banner-wrapper ul { text-align: center; font-size: 0; margin-bottom: 4rem; }
div.banner-wrapper ul li { display: inline-block; padding-left: 1rem; padding-right: 1rem; margin-bottom: 2rem; }
div.banner-wrapper ul li a { display: block; }
div.banner-wrapper ul li a img { display: block; max-width: 24rem; }

/* ---------------------------- banner-a、banner-b */
body.top {}
body.top section.topics { float: left; width: 70%; }
div.banner-a { float: left; width: 30%; margin-top: 10.5rem; }
div.banner-a ul li { margin-bottom: 2rem; text-align: center; }
div.banner-a ul li a { display: block; }
/* 横3つ */
/*
div.banner-b ul li { float: left; width: 32%; margin-right: 2%; margin-bottom: 2rem; text-align: center; }
div.banner-b ul li:nth-child(3n) { margin-right: 0; }
*/
/* 横4つ */
div.banner-b ul li { float: left; width: 24%; margin-right: 1%; margin-bottom: 2rem; text-align: center; }
div.banner-b ul li:nth-child(4n) { margin-right: 0; }

div.banner-b ul li a { display: block; }
div.banner-b ul li img { max-width: 32rem; width: 100%; margin-left: auto; margin-right: auto; display: block; }
div.banner-a div.heading, div.banner-b div.heading { text-align: center; position: relative; margin-bottom: 2rem; }
div.banner-a div.heading:after, div.banner-b div.heading:after { position: absolute; top: 50%; left: 0; width: 100%; height: 0.1rem; background: #cacaca; content: ""; }
div.banner-a div.heading span, div.banner-b div.heading span { background: #fff; position: relative; z-index: 100; padding-left: 2rem; padding-right: 2rem; color: #323c46; }
@media print { body { min-width: 1500px !important; }
  div.scroller { display: none !important; }
}

/* --------------------------------------------------------  */
div.fine-contents { max-width: 100rem; margin-left: auto; margin-right: auto; padding: 4rem; margin-top: 4rem; box-sizing: border-box; border-top: 0.5rem dotted #fff99b; border-bottom: 0.5rem dotted #fff99b; }
div.fine-contents div.fine-contents-heading { font-size: 3rem; text-align: center; font-weight: bold; color: #323c46; letter-spacing: 0.25rem; }
div.fine-contents div.fine-contents-heading span { display: inline-block; position: relative; z-index: 1; }
div.fine-contents div.fine-contents-heading span::before { position: absolute; bottom: 1rem; left: 0; height: 1.5rem; width: 100%; background: #fff99b; content: ""; z-index: -1; }
div.fine-contents div.fine-contents-sub-heading { font-size: 2.4rem; text-align: center; font-weight: bold; margin-top: 2rem; margin-bottom: 2rem; padding-top: 0.5rem; padding-bottom: 0.5rem; color: #4cbabf; border: 0.2rem solid #4cbabf; }
div.fine-contents-key-visual { max-width: 60rem; margin-right: auto; margin-left: auto; margin-bottom: 4rem; margin-top: 4rem; }
div.fine-contents div.fine-contents-articles-wrap { display: flex; flex-wrap: nowrap; }
div.fine-contents div.fine-contents-article { width: 31.00%; margin-right: 3.5rem; box-sizing: border-box; border: 0.2rem solid #f1f4f7; border-radius: 1rem; padding: 2rem; position: relative; padding-bottom: 8rem; padding-top: 2rem; }
div.fine-contents div.fine-contents-article:nth-child(1):before { position: absolute; top: 1rem; left: 50%; transform: translateX(-50%); border-radius: 1rem; }
div.fine-contents div.fine-contents-article:nth-child(2):before { position: absolute; top: 1rem; left: 50%; transform: translateX(-50%); border-radius: 1rem; }
div.fine-contents div.fine-contents-article:nth-child(3):before { position: absolute; top: 1rem; left: 50%; transform: translateX(-50%); border-radius: 1rem; }
div.fine-contents div.fine-contents-article div.fine-contents-article-link { position: absolute; bottom: 2rem; left: 0; width: 100%; }
div.fine-contents div.fine-contents-article div.fine-contents-article-link a { color: #ff90bd; display: block; padding: 1rem 2rem; box-sizing: border-box; text-align: center; font-weight: bold; border: 0.2rem solid #ff90bd; border-radius: 1000rem; width: calc(100% - 2rem); margin-left: auto; margin-right: auto; }
div.fine-contents div.fine-contents-article div.fine-contents-article-link a:before { border-right: 0.15rem solid #ff90bd; border-top: 0.15rem solid #ff90bd; content: ""; display: block; height: 0.5rem; right: 2rem; position: absolute; top: 50%; transform: translateX(-50%) translateY(-50%) rotate(45deg); transition: all 0.2s ease-in-out 0s; width: 0.5rem; }
div.fine-contents div.fine-contents-article div.fine-contents-article-link a:hover { color: #fff; background: #ff90bd; }
div.fine-contents div.fine-contents-article div.fine-contents-article-link a:hover:before { border-right: 0.15rem solid #fff; border-top: 0.15rem solid #fff; }
div.fine-contents div.fine-contents-article:nth-child(3) { margin-right: 0; }
div.fine-contents div.fine-contents-article div.fine-contents-article-thumbnail { margin-bottom: 1.5rem; }
div.fine-contents div.fine-contents-article div.fine-contents-article-thumbnail img { border-radius: 0.75rem; overflow: hidden; }
div.fine-contents div.campaign-article { clear: both; overflow: hidden; border-top: 0.3rem dotted #ccc; padding-top: 2rem; padding-bottom: 2rem; }
div.fine-contents div.campaign-article div.campaign-article-title { font-size: 2.1rem; margin-bottom: 1rem; font-weight: bold; border-bottom: 0.2rem solid #4cbabf; }
div.fine-contents div.campaign-article div.campaign-article-thumbnail { width: 28%; float: right; margin-left: 4%; }
div.fine-contents div.campaign-article div.campaign-article-details { width: 68%; float: left; }


/* WIDE PAGE*/
body.wide .mceContentBody { max-width:100%; background:none; margin-bottom:4rem; }




/*ルート表示*/
.material-symbols-outlined { font-variation-settings:'FILL' 1,'wght' 400,'GRAD' 0,'opsz' 24; vertical-align: middle; margin:-0.4rem 0.6rem 0 0; font-size: inherit; unicode-bidi: isolate; }
.mceContentBody a.b_route, 
.mceContentBody a.b_route:visited { display:inline-block; background:#4cbabf; color:#fff; border-radius:2rem; padding:0.4rem 1.6rem 0.4rem 1.2rem; margin-right:0.5rem; border:1px solid #4cbabf; font-size:1.8rem; text-decoration:none; line-height:1.6; }
.mceContentBody a.b_route .material-symbols-outlined { color:#fff; font-size:2.4rem; }