@charset "utf-8";
/*===========================
〜479px        ：SP縦
480px〜599px ：SP横
600px〜959px ：タブレット
960px〜1279px：小型PC
1280px〜      ：大型PC
===========================*/
/*----------------------------------------
共通
----------------------------------------*/
/* 〜479px：SP縦 */
main {
  position: relative;
  font-family: "Noto Serif Japanese", serif, san-serif;
  font-weight: bold;
  width: 950px;
  margin: 0 auto;
}
#navi .section_inner {
  padding: 10px 0 30px 0;
}
h1 {
  font-size: 22px;
  margin: 0 auto 30px;
  letter-spacing: 3px;
  line-height: 1.5;
}
section#hero_image {
  width: 950px;
  margin: 0 auto;
}
#hero_image img {
  width: 100%;
}
#concept .concept_text {
  font-size: 15px;
}
#contents #area_contents h2 {
  font-size: 22px;
}
#map h2 {
  font-size: 22px;
  margin: 30px auto 10px;
}
/*----------------------------------------
　追従ナビ
----------------------------------------*/
#p_navi {
  position: -webkit-sticky; /* safari用 */
  position: sticky;
  top: 9%;
}
#p_navi nav.item_navi {
  position: absolute;
  right: 0;
  background: #e9c361;
  border-radius: 5px 0 0 5px;
  z-index: 999999;
  padding: 10px 23px 20px 10px;
  line-height: 1.2;
}
#p_navi nav.cale_navi {
  position: absolute;
  right: 0;
  background: #ec9e94;
  border-radius: 5px 0 0 5px;
  z-index: 999999;
  padding: 10px 23px 20px 10px;
  margin-top: 31%;
  line-height: 1.2;
}
#p_navi nav.item_navi p,
#p_navi nav.cale_navi p {
  -ms-writing-mode: tb-lr;
  writing-mode: vertical-lr;
}
#p_navi nav.item_navi p a,
#p_navi nav.cale_navi p a {
  color: #fff;
}

/*----------------------------------------
concept
----------------------------------------*/
#concept .text {
  font-size: 13px;
  line-height: 1.7;
}
#contents #calender {
  width: 100%;
  margin: 90px auto;
}
#map p:last-child,
#calender p:last-child {
  text-align: right;
  font-size: 15px;
  margin: 10px 0 40px;
}
section {
  border-top: none;
}
/*----------------------------------------
navi
----------------------------------------*/
#contents #navi {
  border-top: none;
  margin: 30px 0;
}
#contents #navi .section_inner {
  padding: 0;
  width: 100%;
}
#contents #navi ul {
  display: flex;
  flex-wrap: wrap;
  gap: 20px 2%;
  font-size: 16px;
}
#contents #navi nav ul li {
  font-size: 18px;
  padding: 5px 0;
  width: 32%;
}
#navi nav ul li:nth-child(1) {
  border-bottom: 2px solid #ef858c;
}
#navi nav ul li:nth-child(2) {
  border-bottom: 2px solid #f3981e;
}
#navi nav ul li:nth-child(3) {
  border-bottom: 2px solid #ffe874;
}
#navi nav ul li:nth-child(4) {
  border-bottom: 2px solid #5db7e8;
}
#navi nav ul li:nth-child(5) {
  border-bottom: 2px solid #9070af;
}
#navi nav ul li:nth-child(6) {
  border-bottom: 2px solid #0ba29a;
}
#navi nav ul li a:hover {
  background: url("../img/common/yaji.png") no-repeat bottom;
  padding: 0 0 20px 0;
}
#area_contents .midashi_h3 {
  margin-top: 12px;
  font-size: 20px;
}
#area_contents #yama_area {
  margin-top: -20px;
  padding-top: 20px;
  clear: both;
}
/*----------------------------------------
contents
----------------------------------------*/
#contents #navi {
  padding-top: 110px;
  margin-top: -80px;
}
section#item_01,
section#item_02,
section#item_03,
section#item_04,
section#item_05,
section#item_06,
#calender {
  padding-top: 90px;
  position: relative;
}
section#item_01,
section#item_04 {
  float: right;
}
section#item_02,
section#item_06 {
  float: left;
}
#area_contents {
  font-size: 15px;
}
section.area_box {
  margin: 80px 0;
}
section.area_box h2 {
  font-size: 18px;
  text-align: center;
  padding: 2% 0px;
  margin: 0;
}
section#item_01 h2 {
  border-bottom: 2px solid #ef858c;
}
section#item_02 h2 {
  border-bottom: 2px solid #f3981e;
}
section#item_03 h2 {
  border-bottom: 2px solid #ffe874;
  width: 90%;
  margin: 0 auto 20px;
}
section#item_04 h2 {
  border-bottom: 2px solid #5db7e8;
}
section#item_05 h2 {
  border-bottom: 2px solid #9070af;
  width: 90%;
  margin: 0 auto;
}
section#item_05 h2.sp_on {
  width: 100%;
}
section#item_06 h2 {
  border-bottom: 2px solid #0ba29a;
}
section.area_box .text {
  text-align: left;
  position: relative;
  font-size: 14px;
  line-height: 1.5;
  bottom: 20px;
  width: 38%;
  padding: 1%;
}
.area_box .flexslider.box_l,
.area_box .flexslider.box_r {
  width: 60%;
}
.area_box .box_l {
  float: left;
  width: 40%;
}
.area_box .box_r {
  float: right;
  width: 40%;
}
.area_box img.box_l,
.area_box img.box_r {
  width: 60%;
}
#contents section.box_03 div {
  position: absolute;
  top: 22%;
  left: 25%;
  width: 46%;
  background: rgb(255, 255, 255, 0.8);
  padding: 30px 0 0;
}
section#item_03.box_03,
section#item_05.box_03 {
  position: relative;
  margin-bottom: 80px;
}
#contents section.box_03 .text {
  width: 90%;
  margin: 0 auto;
  padding: 20px 0 0 0;
}
section.area_box.box_03 h2 img.deco_reef {
  width: 15%;
  margin: 5px 10px;
}
section#item_02 h2,
section#item_05 h2 {
  letter-spacing: 0;
}
section#item_05 h2 img.deco_reef {
  width: 10%;
  margin: 15px 0;
}
section.area_box .text span {
  position: absolute;
  top: -75px;
  right: 2%;
  width: 15%;
}
.area_box p.box_l.s_flower {
  position: absolute;
  bottom: 0;
  float: left;
  width: 38%;
}
.area_box p.box_r.s_flower {
  position: absolute;
  bottom: 0;
  right: 5px;
  width: 38%;
}
section.area_box p.s_flower {
  padding: 10px;
}
#calender h2 {
  margin: 0 auto;
}
#calender h2 img {
  width: 15%;
}
#calender p img {
  padding: 20px 0;
}
/*----------------------------------------
  tab_contents
----------------------------------------*/
#tab_contents {
  margin-top: 30px;
}
#contents .tab_lab1,
#contents .tab_lab2,
#contents .tab_lab3 {
  background: #ccc;
  padding: 5px 80px;
  border-radius: 5px 5px 0 0;
  border: #a3a3a3 solid 1px;
  border-bottom: none;
}
/*タブにチェック入ったとき*/
#contents #tab1:checked ~ .tab_lab1,
#contents #tab2:checked ~ .tab_lab2,
#contents #tab3:checked ~ .tab_lab3 {
  padding: 5px 80px;
  border-radius: 5px 5px 0 0;
}
#tab1:checked ~ .tab_lab1 {
  background: #ffefe9;
}
#tab2:checked ~ .tab_lab2 {
  background: #e8ffd8;
}
#tab3:checked ~ .tab_lab3 {
  background: #feffd8;
}
/*タブボタンとボックス連動*/
#tab1:checked ~ .panels #area1 {
  background: #ffefe9;
  display: block;
  border-top: #a3a3a3 solid 1px;
  margin-top: 2px;
}
#tab2:checked ~ .panels #area2 {
  background: #e8ffd8;
  display: block;
  border-top: #a3a3a3 solid 1px;
  margin-top: 2px;
}
#tab3:checked ~ .panels #area3 {
  background: #feffd8;
  display: block;
  border-top: #a3a3a3 solid 1px;
  margin-top: 2px;
}
/*チェックボックスとボックス非表示*/
input[name="check"] {
  display: none;
}
#tab_contents .panel {
  display: none;
}
#tab_contents .tab_box {
  width: 100%;
  margin: 0 auto;
  padding: 20px 0;
}
#tab_contents .tab_box div {
  width: 90%;
  margin: 0 auto;
  padding: 10px;
  position: relative;
  z-index: 1;
  box-sizing: border-box;
}
#tab_contents .panel div.tab_box div p:nth-child(1) {
  float: left;
  width: 50%;
}
#tab_contents .panel div.tab_box div p:nth-child(2) {
  float: left;
  margin: 20px 0 0 30px;
  width: 40%;
}
#tab_contents .panel div.tab_box div p.pc_on {
  position: absolute;
  bottom: 0;
  right: 0;
}

#tab_contents .panel div.tab_box dl {
  display: flex;
  flex-wrap: wrap;
  width: 90%;
  border: 1px solid #a3a3a3;
  margin: 20px auto;
}
#tab_contents .panel div.tab_box dl dt {
  padding: 10px;
  background: #ececec;
  width: 20%;
  display: flex;
  justify-content: center;
  align-items: center;
  border-right: 1px solid #a3a3a3;
}
#tab_contents .panel div.tab_box dl dd {
  padding: 10px;
  text-align: left;
  background: #fff;
  width: 75%;
}
#tab_contents .panel div.tab_box dl dt:nth-child(1),
#tab_contents .panel div.tab_box dl dd:nth-child(2) {
  border-bottom: 1px solid #a3a3a3;
}
#plan {
  border-top: #ccc solid 1px;
}
.clearfix::after {
  content: "";
  display: block;
  clear: both;
}