@charset "utf-8";


/* CMS Template(CSS編集はCMS管理画面から)

/model-plan/css/model-plan.css

Update:  2025-11-21 PM 01:37

====================*/
/* ----------------------------------------------------
全端末共通
---------------------------------------------------- */
/* common reset ==== */
main h2{
  font-size:clamp(2.0rem, 2.5vw, 3.0rem);
}
main h3{
  font-size:clamp(1.8rem, 1.6vw, 2.0rem);
  margin-bottom: 5px;
}
.nav-main-list #gm4 .nav-set::after {
  transform: scale(1, 1);
}

/* ----------------------------------------------------
Media query All
---------------------------------------------------- */
/* common */
#timeline .column{
  max-width: 1200px;
  margin: 0 auto 70px;
  align-items: center;
}
#timeline .column:nth-of-type(odd){
  flex-direction: row-reverse;
}
#timeline .column .img{
  width: 45%;
}
#timeline .column .text{
  width: 50%;
}
#timeline .column .text p{
  margin-bottom: 25px;
  font-size: 1.8rem;
}
#timeline .column .text p:last-of-type{
  margin-bottom: 0px;
}
#timeline .column.size-s{
  max-width: 1070px;
  margin: 0 auto 70px;
}
#timeline .column.size-s .img{
  width: 35%;
}
#timeline .column.size-s .text{
  width: 58%;
}
#timeline .column.size-s img,#timeline .column.map img{
  border-radius: 8px;
}
#timeline strong{
  font-weight: bold;
  color: #54b5c7;
}
#timeline .title{
  margin: 0 auto 23px;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
}
#timeline .title .time{
  width: 90px;
  text-align: center;
  margin-right: 22px;
  padding: 5px 0 5px;
  font-size: 1.8rem;
  background-color: #ede7e1;
}
#timeline .title h2{
  flex: 1;
  font-size:clamp(1.8rem, 2.3vw, 2.4rem);
  color: #54b5c7;
  line-height: 1.6;
  text-align: left;
  margin: 0;
}
#timeline .column .btn.s-small{
	margin-top: 15px;
}
/* mainvis */
.fallback #mainvis {
	background: url("/model-plan/img/img_main_pc.jpg") no-repeat center top;
}
.webp #mainvis {
	background: url("/model-plan/img/img_main_pc.webp") no-repeat center top;
}
.avif #mainvis {
	background: url("/model-plan/img/img_main_pc.avif") no-repeat center top;
}
#mainvis {
    margin-bottom: 55px;
}
#mainvis + p{
  text-align: center;
  margin: 0 auto 30px;
}

/* navi-tab */
.navi-tab{
  max-width: 1200px;
  margin: 0 auto 45px;
  padding: 0 10px;
}
.navi-tab .set{
  position: relative;
  width: 31%;
  background-color: #ac9d8a;
  border-radius: 6px;
  padding: 10px;
  display: flex;
  align-items: center;
}
.navi-tab .set:not(.active){
  box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
  transition: .3s;
}
.navi-tab .set:not(.active):hover{
  box-shadow: none;
  transition: .3s;
}
.navi-tab .set:nth-child(1){
  background: rgba(172,157,138,0.15);
}
.navi-tab .set:nth-child(2){
  background: rgba(93,147,161,0.15);
}
.navi-tab .set:nth-child(3){
  background: rgba(179,113,152,0.15);
}
.navi-tab .set img{
  opacity: .5;
}
.navi-tab .set.active:nth-child(1){
  background: rgba(172,157,138,1.0);
}
.navi-tab .set.active:nth-child(2){
  background: rgba(93,147,161,1.0);
}
.navi-tab .set.active:nth-child(3){
  background: rgba(179,113,152,1.0);
}
.navi-tab .set.active img{
  opacity: 1.0;
}
.navi-tab .set a{
  position: absolute; width: 100%; height: 100%; top: 0; left: 0; text-indent: 100%; white-space: nowrap; overflow: hidden;
}
.navi-tab .set.active a{
  pointer-events: none;
}
.navi-tab .set p{
  color: #FFFFFF;
  font-weight: bold;
  font-size: 1.8rem;
  text-decoration: none;
}
.navi-tab .set:not(.active) p{
  color: #333333;
}
.navi-tab .set img{
  border-radius: 6px;
  margin-right: 30px;
}
/* overview */
#overview{
  max-width: 1180px;
  margin: 0 auto 65px auto;
  padding: 0 10px;
}
#overview p{
  font-size: 1.8rem;
}
#overview strong{
  font-weight: bold;
  color: #54b5c7;
}
/* All END */

/* ----------------------------------------------------
- 520px (Smartphone layout Only)
---------------------------------------------------- */
@media (max-width: 520px) {




/* - 520px (Smartphone layout Only) END */
}

/* ----------------------------------------------------
- 960px (Smartphone Tablet layout Only)
---------------------------------------------------- */
@media (max-width: 960px) {
/* common */
#timeline .column{
  margin: 0 auto 50px;
  padding: 0 10px;
}
#timeline .column .img{
  width: 90%;
  margin: 0 auto 0;
}
#timeline .column .text{
  width: 100%;
  margin-bottom: 25px;
}
#timeline .column .text p{
  font-size: 1.6rem;
}
#timeline .column.size-s{
  max-width: 1070px;
  margin: 0 auto 50px;
}
#timeline .column.size-s .img{
  width: 90%;
  margin: 0 auto 0;
}
#timeline .column.size-s .text{
  width: 100%;
}
#timeline .title{
  margin: 0 auto 23px;
  display: block;
}
#timeline .title .time{
  width: 90px;
  margin-bottom: 6px;
}
#timeline .title h2{
  width: 100%;
}
  /* mainvis */
.fallback #mainvis {
	background: url("/model-plan/img/img_main_sp.jpg") no-repeat center top;
  background-size: cover;
}
.webp #mainvis {
	background: url("/model-plan/img/img_main_sp.webp") no-repeat center top;
  background-size: cover;
}
.avif #mainvis {
	background: url("/model-plan/img/img_main_sp.avif") no-repeat center top;
  background-size: cover;
}
#mainvis {
    margin-bottom: 25px;
}


/* ナビ */
  .navi-local-top{
    margin: 0 auto 50px !important;
    padding: 0 0;
    padding-top: 0;
  }
  .navi-local-top li + li {
    margin-left: 0;
}
  .navi-local-top li{
    width: 31%;
    margin: 0 1% 15px;
  }
  .navi-local-top li a{
    width: 100%;
    font-size: 1.0rem;
  }

.details-index .navi-local li:nth-child(1) a { background-color:#ececec;}
.details-business .navi-local li:nth-child(2) a { background-color:#ececec;}
.details-tourism .navi-local li:nth-child(3) a { background-color:#ececec;}

#mainvis + p{
  text-align: left;
  margin: 0 auto 30px;
  padding: 0 10px 0;
}

/* navi-tab */
.navi-tab{
  margin: 0 auto 45px;
  padding: 0 10px;
}
.navi-tab .set{
  position: relative;
  width: 100%;
  margin-bottom: 10px;
}
.navi-tab .set img{
  margin-right: 25px;
}
/* overview */
#overview{
  margin: 0 auto 45px auto;
}
#overview p{
  font-size: 1.6rem;
}


/* - 960px (Smartphone Tablet layout Only) END*/
}

/* ----------------------------------------------------
961px- (Pc layout Only)
---------------------------------------------------- */
@media (min-width: 961px) {

/*ローカルナビ*/
.navi-local li + li{
  margin-left: 0;
}
.navi-local li{
  width: 18%;
  margin: 0 1% 0;
}
.navi-local li a{
  width: 100%;
}
.details-index .navi-local li:nth-child(1) a { background-color:#66b2c0; color: #FFFFFF;}
.details-business .navi-local li:nth-child(2) a { background-color:#66b2c0; color: #FFFFFF;}
.details-tourism .navi-local li:nth-child(3) a { background-color:#66b2c0; color: #FFFFFF;}



/* 961px - END*/
}

/* ----------------------------------------------------
- 1200px (Pc layout Only コンテンツ内 基本幅)
---------------------------------------------------- */
@media (max-width: 1200px) {



/* - 1200px (Pc layout Only) END*/
}

/* ----------------------------------------------------
961px- 1250px (Pc layout Only)
---------------------------------------------------- */

@media (min-width: 961px) and (max-width: 1250px) {


}

/* ----------------------------------------------------
- 1920px (Pc layout Only)
---------------------------------------------------- */
@media (max-width: 1920px) {


/* - 1920px - END*/
}

/* ----------------------------------------------------
1921px- (Pc layout Only Wide)
---------------------------------------------------- */
@media (min-width: 1921px) {
.fallback #mainvis {
	background: url("/model-plan/img/img_main_pc.jpg") no-repeat center top;
  background-size: cover;
}
.webp #mainvis {
	background: url("/model-plan/img/img_main_pc.webp") no-repeat center top;
  background-size: cover;
}
.avif #mainvis {
	background: url("/model-plan/img/img_main_pc.avif") no-repeat center top;
  background-size: cover;
}

/* 1921px - END*/
}