@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');

/*----------------------------------------
	全体
----------------------------------------*/

html{
	font-family:'游ゴシック体', 'Yu Gothic', YuGothic,'メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ ゴシック',sans-serif;
	font-size:62.5%;
	color: #000;
	-webkit-text-size-adjust:100%;
	line-height:1.5;
	font-weight: 500;
}
body{
	font-size:1.4rem; font-size: 1.4em; overflow-x: initial; color:#000;
}
article{ overflow:hidden; }
img{ vertical-align: bottom; }
img {
    image-rendering: -webkit-optimize-contrast;
}
.yumin {
	font-family: '游明朝体', "Yu Mincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "ＭＳ 明朝", "Sawarabi Mincho", serif;
}


.montserrat {
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-style: normal;
}


a{
	color:#415c71;
	transition: all 0.4s;
}
a:hover{
	opacity: 0.7;
	transition: all 0.4s;
}
a img:hover{
	opacity: 0.7;
}

.max_respon{max-width: 100%;}
.bg_black{background-color: #000;}
.bg_gray{background: #f1f7f4}

@media screen and (max-width: 767px) {
  body {
    font-family:'游ゴシック体', 'Yu Gothic', YuGothic,'メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ ゴシック',sans-serif;
  }
}

:root {
  --font-size-12: clamp(1.2rem, 1.1vw, 1.2rem);
  --font-size-13: clamp(1.3rem, 1.25vw, 1.3rem);
  --font-size-14: clamp(1.4rem, 1.34vw, 1.4rem);
  --font-size-15: clamp(1.5rem, 1.5vw, 1.5rem);
  --font-size-16: clamp(1.6rem, 1.6vw, 1.6rem);
  --font-size-18: clamp(1.7rem, 1.7vw, 1.8rem);
  --font-size-20: clamp(1.8rem, 1.9vw, 2rem);
  --font-size-21: clamp(1.9rem, 2vw, 2.1rem);
  --font-size-22: clamp(2.0rem, 2.1vw, 2.2rem);
  --font-size-24: clamp(2.1rem, 2.3vw, 2.4rem);
  --font-size-26: clamp(2.2rem, 2.5vw, 2.6rem);
  --font-size-28: clamp(2.2rem, 2.6vw, 2.8rem);
  --font-size-30: clamp(2.4rem, 2.8vw, 3rem);
  --font-size-32: clamp(2.4rem, 3vw, 3.2rem);
  --font-size-34: clamp(2.6rem, 3.2vw, 3.4rem);
  --font-size-36: clamp(2.6rem, 3.3vw, 3.6rem);
  --font-size-38: clamp(2.8rem, 3.4vw, 3.8rem);
  --font-size-40: clamp(2.8rem, 3.8vw, 4rem);
}


/*----------------------------------------
	text
----------------------------------------*/

p{ line-height: 2; }
.text_bold{ font-weight: bold; }
.text_normal{ font-weight: normal; }

.text_sora{ color: #00abe1; }
.text_gray{ color: #7a7b7b; }
.text_red{ color: #e60012; }
.text_d_red{ color: #b02727; }

.text_white{ color: #fff; }

.palt{
  font-feature-settings: "palt";
}

.text_12 { font-size: var(--font-size-12); }
.text_13 { font-size: var(--font-size-13); }
.text_14 { font-size: var(--font-size-14); }
.text_15 { font-size: var(--font-size-15); }
.text_16 { font-size: var(--font-size-16); }
.text_18 { font-size: var(--font-size-18); }
.text_20 { font-size: var(--font-size-20); }
.text_21 { font-size: var(--font-size-21); }
.text_22 { font-size: var(--font-size-22); }
.text_24 { font-size: var(--font-size-24); }
.text_26 { font-size: var(--font-size-26); }
.text_28 { font-size: var(--font-size-28); }
.text_30 { font-size: var(--font-size-30); }
.text_32 { font-size: var(--font-size-32); }
.text_34 { font-size: var(--font-size-34); }
.text_36 { font-size: var(--font-size-36); }
.text_38 { font-size: var(--font-size-38); }
.text_40 { font-size: var(--font-size-40); }

/*line-height*/
.lh_06{ line-height: 0.6; }
.lh_11{ line-height: 1.1; }
.lh_12{ line-height: 1.2; }
.lh_13{ line-height: 1.3 ; }
.lh_14{ line-height: 1.4; }
.lh_15{ line-height: 1.5; }
.lh_16{ line-height: 1.6; }
.lh_17{ line-height: 1.7; }
.lh_18{ line-height: 1.8; }

/*letter-spacing*/
.ls_-2{ letter-spacing: -2px; }
.ls_-1{ letter-spacing: -1px; }
.ls_1{ letter-spacing: 1px; }
.ls_2{ letter-spacing: 2px; }
.ls_3{ letter-spacing: 3px; }

.text_r{text-align:right;}

a.link_tex{ color: #0199cc; }
a.link_tex:hover{ opacity: 0.7; }



@media print, screen and (min-width: 821px) {

  /*line-height*/
  .lh_19{ line-height: 1.9 !important; }
  .lh_20{ line-height: 2 !important; }
  .lh_21{ line-height: 2.1 !important; }
  .lh_22{ line-height: 2.2 !important; }
  .lh_23{ line-height: 2.3 !important; }
  .lh_24{ line-height: 2.4 !important; }
  .lh_25{ line-height: 2.5 !important; }
  .lh_26{ line-height: 2.6 !important; }
  .lh_28{ line-height: 2.8 !important; }
  .lh_36{ line-height: 3.6 !important; }

  /*letter-spacing*/
  .ls_4{ letter-spacing: 4px; }
  .ls_5{ letter-spacing: 5px; }
  .ls_6{ letter-spacing: 6px; }
  .ls_7{ letter-spacing: 7px; }
  .ls_8{ letter-spacing: 8px; }

}/*END*/


@media screen and (max-width: 820px){
  /*letter-spacing*/
  .ls_4{ letter-spacing: 3px; }
  .ls_5{ letter-spacing: 4px; }
  .ls_6{ letter-spacing: 4px; }
  .ls_7{ letter-spacing: 4px; }
  .ls_8{ letter-spacing: 4px; }

  /*line-height*/
  .lh_19,
  .lh_20,
  .lh_21,
  .lh_22,
  .lh_23,
  .lh_24,
  .lh_25{
    line-height: 1.8 !important;
  }

}/*END*/

@media screen and (max-width: 599px){
  /*letter-spacing*/
  .ls_4{ letter-spacing: 2px; }
  .ls_5{ letter-spacing: 2px; }
  .ls_6{ letter-spacing: 2px; }
  .ls_7{ letter-spacing: 2px; }
  .ls_8{ letter-spacing: 2px; }

}/*END*/


li{ list-style:none; }
.center{ text-align:center; }
.text_left{ text-align:left; }
.text_right{ text-align:right; }
.left{ float:left; }
.right{ float:right; }
.clear{ clear:both; }
.m_center{ margin-inline:auto; }

.op:hover{
  filter: alpha(opacity=60);
  -moz-opacity:060;
  opacity:0.60;
}

@media screen and (max-width: 599px){
  .sp_text_left{ text-align:left; }
  .sp_text_right{ text-align:right; }
  .sp_center {text-align: center;}
}/*END*/





/*----------------------------------------
  layout
----------------------------------------*/
.max_respon{
  max-width:100%;
}
.pc_block{
  display: block;
}
.sp_block{
  display: none;
}
.tb_block{
  display: none;
}


.inner_frame{
  max-width: 1140px;
  width: 100%;
  position: relative;
  box-sizing: border-box;
  margin-inline: auto;
  padding-right: 20px;
  padding-left: 20px;
}

.content_fl_box{
  display: flex;
  gap: 3.5%;
}

.content_fl_box.between{
  justify-content: space-between;
}
.content_fl_box.reverse{
  flex-direction: row-reverse;
}
.content_fl_box.end{
  justify-content: flex-end;
}
.content_fl_box.j_center{
  justify-content: center;
}
.i_center{
  align-items: center;
}
.i_end{
  align-items: end;
}
.content_fl_box50{
  display: flex;
}
.content_fl_box.nogap{
    gap: 0;
}

.fl_right{
  display: flex;
  justify-content: flex-end;
  align-items: flex-start;
}

.box20{width: 20%; }
.box25{width: 25%; }
.box30{width: 30%; }
.box35{width: 35%; }
.box40{width: 40%; }
.box43{width: 41%; }
.box45{width: 45%; }
.box47{width: 48%; }
.box50{width: 50%; }
.box55{width: 55%; }
.box60{width: 60%; }
.box65{width: 65%; }
.box70{width: 70%; }
.box75{width: 75%; }
.box80{width: 80%; }


.order01{ order: 1; }
.order02{ order: 2; }




@media screen and (max-width: 768px){
  .inner_frame{
    padding-right: 3.5%;
    padding-left: 3.5%;
  }

}/*END*/

@media screen and (max-width: 599px){

  .inner_frame{
    padding-right: 4.3%;
    padding-left: 4.3%;
  }


    .pc_block{
      display: none;
    }
    .sp_block{
      display: block;
    }

	.sp_discon{
		display: contents;
	}

  .sp_order00{ order: 0; }
  .sp_order01{ order: 1; }
  .sp_order02{ order: 2; }
  .sp_order03{ order: 3; }
  .sp_order04{ order: 4; }
  .sp_order05{ order: 5; }

  .order01,.order02{ order: 0; }

  .content_fl_box{
    flex-wrap: wrap;
  }

  .box80,.box70,.box65,.box60,.box40,.box50,.box55,.box25,.box75,.box47,.box45,.box43,.box35,.box30,.box20{
    width: 100%;
    margin-bottom: 20px;
  }

  .content_fl_box50{
    flex-wrap: wrap;
  }

  .content_fl_box.nowrap{
    flex-wrap: nowrap;
  }

  .sp_content_fl_box{
    display: flex;
    gap:2%;
  }

  .content_fl_box > div:last-child{
  	margin-bottom: 0;
  }

   .content_fl_box.nowrap .box70{ width: 70%; }
   .content_fl_box.nowrap .box60{ width: 60%; }
   .content_fl_box.nowrap .box40{ width: 40%; }
   .content_fl_box.nowrap .box30{ width: 30%; }

   .sp_palt{
    font-feature-settings: "palt";
   }

   .fl_right{
	  display: block;
   }


}/*END*/








/*----------------------------------------
	mv
----------------------------------------*/
.mv_area{
	position: relative;
	aspect-ratio: 1100/600;
}
.mv_ttl{
	width: 43%;
	max-width: 463px;
	position: absolute;
	transform: translate(0,-50%);
	top:50%;
	left:4%;
}



@media screen and (max-width: 599px){

	.mv_ttl{
		width: 94%;
		transform: translate(0,0);
		top:4%;
		left:4%;
	}




}/*END*/




/*----------------------------------------
	contents　コンテンツ
----------------------------------------*/

.rela{
	position: relative;
}

.sora_pan{
	margin-top:20px;
}
.sora_pan li{
	display: inline-block;
	padding-right: 8px;
	font-size: var(--font-size-13);
}

.sora_ttl{
	font-size: var(--font-size-36);
	font-weight: bold;
	font-feature-settings: "palt";
	letter-spacing: 15px;
	line-height: 2;
}

.sora_ttl_s{
	font-size: var(--font-size-28);
	font-weight: bold;
	font-feature-settings: "palt";
	letter-spacing: 10px;
	line-height: 2;
}


.list_three_box{
	display: flex;
	justify-content: space-between;
}
.list_three_box .box{
	width: 30.55%;
}

.kurashi_deco1{
	width: calc(294 / 1100 * 100%);
	max-width: 294px;
	position: absolute;
	top:5%;
	left: -5%;
}
.kurashi_deco2{
	width: calc(349 / 1100 * 100%);
	max-width: 349px;
	position: absolute;
	top:5%;
	right: -10%;
}

.left_over_box{
	display: flex;
	justify-content: flex-end;
}
.right_over_box{
	display: flex;
	justify-content: flex-start;
}

.about_img1{
	width: 52.5vw;
	max-width: 698px;
}

.design_img1{
	width: 51vw;
	max-width: 557px;
}

.bg_aside_c{
	background: #fada2e;
}

.ttl500 img{
	max-width: 500px;
}

.aside_contact_ttl img{
	margin-top:-70px;
}

.design_deco1{
	width: calc(366 / 1100 * 100%);
	max-width: 366px;
	position: absolute;
	top:1%;
	left: -10%;
}
.design_deco2{
	width: calc(353 / 1100 * 100%);
	max-width: 353px;
	position: absolute;
	top:0;
	right: -10%;
}

.d_s_tex{
	margin-left:-1.6%;
}

.text_box500{
	max-width: 530px;
}



@media screen and (max-width: 599px){
	.sora_pan{
		margin-top:0;
	}

	.sora_ttl{
		line-height: 1.8;
		letter-spacing: 10px;
	}

	.sora_ttl_s{
		line-height: 1.6;
		letter-spacing: 5px;
	}

	.about_img1{
		width: 100%;
	}

	.design_img1{
		width: 100%;
	}

	.kurashi_deco1 {
	  display: none;
	}
	.kurashi_deco2{
		top: auto;
		    right: 6%;
		    bottom: -18%;
		    width: 33%;
	}

	.bg_aside_c .list_three_box{
		flex-wrap: wrap;
	}

	.bg_aside_c .list_three_box .box{
	  width: 100%;
	  margin-bottom: 15px;
	}
	.bg_aside_c .list_three_box .box:last-child{
		margin-bottom: 0;
	}

	.aside_contact_ttl img{
		margin-top: -50px;
	}


	.design_deco1 {
	  width: 25%;
	  top: auto;
	  left: 15%;
	  bottom: -25%;
	}
	.design_deco2 {
	  width: 30%;
	  top: auto;
	  right: 12%;
	  top: 75%;
	}

	.sp_pt0{
		padding-top:0;
	}

	.sp_ds_in_pt{
		padding-top:140px;
	}


}/*END*/





/*----------------------------------------
	map
----------------------------------------*/

.map{
	position: relative;
	overflow: hidden;
	width: 100%;
	height: 100%;
	padding:50% 0 0;
	text-align: center;
}
.map iframe{
	width: 100%;
	height: 100%;
	position: absolute;
	left: 50%;
	top: 50%;
	-webkit-transform: translate3d(-50%, -50%, 0);
	-ms-transform: translate3d(-50%, -50%, 0);
	transform: translate3d(-50%, -50%, 0);
}
.map iframe:not(:target){
	left: 0\9;
	top: 0\9;
}
.map iframe{
	left: 0\9;
	top: 0\9;
}
@media all and (-ms-high-contrast: none) {
.map iframe{
		left: 50%\9 !important;
		top: 50%\9 !important;
	}
}
.map{ z-index: 2; }/*chrome対策*/

@media screen and (max-width: 599px){
	.map{
		padding:75% 0 0;
	}

}/*END*/




.btn{
	display: block;
	width: 100%;
}
.btn_01{
	position: absolute;
	bottom: 13%;
	left: 50%;
	transform: translateX(-50%);
	width: 80%;
}

.btn_reserve{
	display: block;
	position: absolute;
	width: 100%;
	transform: translate(-50%, 0);
	left:50%;
	bottom: 3%;
}
.btn_mi{
	display: block;
	width: 70%;
	margin-inline: auto;
}

.nm_plan{
	margin-top:-15px;
}


.rela_z2{
	position: relative;
	z-index: 2;
}

.lp_frame_ac{
	width: 96%;
	margin-inline: auto;
}




@media screen and (min-width: 768px), print {
  .main-title {
    min-width: auto;
  }

  footer {
    min-width: auto;
  }

 footer .f-link-Box {
 	width: 100%;
    max-width: 730px;
    padding-top: 10px;
    float: left;
  }

  footer .footer-Box{
  	width: 100%;
  	max-width: 1099px;
  }


}