@charset "utf-8";
/* CSS Document */

/* 限定適用 */
.m-c{margin: 0 auto;}
.m-r{margin-left: auto;}
.m-l{margin-right: auto;}

.t-c{text-align: center;}
.t-r{text-align: right;}
.t-l{text-align: left;}

.mb10{margin-bottom: 10px;}
.mb20{margin-bottom: 20px;}
.mb30{margin-bottom: 30px;}
.mb40{margin-bottom: 40px;}
.mb50{margin-bottom: 50px;}
.mb60{margin-bottom: 60px;}
.mb70{margin-bottom: 70px;}
.mb80{margin-bottom: 80px;}
.mb90{margin-bottom: 90px;}
.mb100{margin-bottom: 100px;}
.mb200{margin-bottom: 200px;}

.mt10{margin-top: 10px;}
.mt20{margin-top: 20px;}
.mt30{margin-top: 30px;}
.mt40{margin-top: 40px;}
.mt50{margin-top: 50px;}
.mt60{margin-top: 60px;}
.mt70{margin-top: 70px;}
.mt80{margin-top: 80px;}
.mt90{margin-top: 90px;}
.mt100{margin-top: 100px;}

.pb10{padding-bottom: 10px;}
.pb20{padding-bottom: 20px;}
.pb30{padding-bottom: 30px;}
.pb40{padding-bottom: 40px;}
.pb50{padding-bottom: 50px;}
.pb60{padding-bottom: 60px;}
.pb70{padding-bottom: 70px;}
.pb80{padding-bottom: 80px;}
.pb90{padding-bottom: 90px;}
.pb100{padding-bottom: 100px;}
.pb200{padding-bottom: 200px;}

.pt10{padding-top: 10px;}
.pt20{padding-top: 20px;}
.pt30{padding-top: 30px;}
.pt40{padding-top: 40px;}
.pt50{padding-top: 50px;}
.pt60{padding-top: 60px;}
.pt70{padding-top: 70px;}
.pt80{padding-top: 80px;}
.pt90{padding-top: 90px;}
.pt100{padding-top: 100px;}
.pt200{padding-top: 200px;}

.dis-b{display: block;}
.dis-f{display: flex;}

.rev{flex-direction:row-reverse;}
.no_rev{flex-direction: row;}
@media screen and (max-width:769px) {
  .rev,.no_rev{display: block;}
}

/* 特別限定（サイズでオンオフ） */
.pc_on-none{
  display: block;
}
.sp_none-on{
  display: none;
}
.sp_none-on_map{
  display: none;
}
@media (max-width:600px){
  .pc_on-none{
    display: none;
  }
  .sp_none-on{
    display: block;
  }
}
@media(max-width:800px){
  .pc_on-none_map{
    display: none;
  }
  .sp_none-on_map{
    display: block;
  }
}
/* ＝＝＝＝＝＝＝＝＝＝＝＝ */

/* 枠類 */
body{
    font-family: "游ゴシック体",YuGothic,"游ゴシック Medium","Yu Gothic Medium","游ゴシック","Yu Gothic",Roboto,-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Hiragino Kaku Gothic Pro","Meiryo UI",Meiryo,sans-serif;
    font-size: 16px;
    background-color: #fffbf7;
    max-width: 1920px;
    width: 100%;
}
/* header{} */
main{
  overflow: hidden;
}
footer{
  width: 100%;
  position: relative;
}

.conte_box_n{
    display: flex;
    justify-content: center;
    margin-bottom: 10%;
    padding-right: 10px;
    h2{
      margin-bottom: 2%;
      color: #631915;
    }
    .desc{
      width: 70%;
      padding-top: 20px;
    .img_1{
      margin-bottom: 3%;
    }
  }
}
.conte_box_rev{
  display: flex;
  justify-content:center;
  background-color: #F1EBE0;
  padding-bottom: 7%;
  padding-left: 10px;
  h2{
    margin-bottom: 10px;
    color: #631915;
  }
  .desc{
    width: 70%;
    .item_1{
      width: 100%;
      height: auto;
      margin-bottom: 1%;
    }
    .item_2{
      display: flex;
      justify-content: space-between;
      margin-bottom: 3%;
      gap: 10px;
      width: auto;
    }
  }
}
.security .conte_box_rev{
  display: flex;
  justify-content:center;
  background-color: #F1EBE0;
  padding-bottom: 7%;
  padding-top: 30px;
  .desc{
    width: 70%;
    .item_1{
      width: 100%;
      height: auto;
      margin-bottom: 1%;
    }
    .item_2{
      display: flex;
      justify-content: flex-start;
      margin-bottom: 50px;
      gap: 10px;
      width: auto;
    }
    h2{
      margin-bottom: 2%;
      color: #631915;
    }
  }
}
@media (max-width:769px) {
  .security .conte_box_rev .desc .item_2{
    display: block;
  }
}
/* タイトルヘッダー */
.title_container{
  max-width: 1920px;
  width: 100%;
  margin: 0 auto;
  position: relative;
}
.title_container img{
  background: linear-gradient(to left,#333333e3, #eeeeee00 100%,);
  width: 100%;
  justify-content: center;
  height: 300px;
  object-fit: cover;
}
.container {
  position: relative;
  max-width: 100%;
}

.container::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 90px;
  background-color: #8d8d8dcc;
}

.container img {
  width: 100%;
}
.title_container h1{
  font-size:clamp(40px,10vw,60px);
  font-weight: bold;
  color: #fffcf6;
  position: absolute;
  bottom: 0;
  padding-left: 20px;
}
.title_container h1 small{
  font-size: 35%;
  margin-left: 1.6em;
}
.title_container h2{
  font-size: 1000%;
  font-weight: bold;
  color: #dddddd98;
  position: absolute;
  top: 10%;
  left: 0;
  overflow: hidden;
  letter-spacing: 30px;
  height: 90%;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
}
/* ================================ */
/* テキスト類 */
h1{
    font-size: 36px;
    font-weight: bold;
}
h2{
    font-size: 28px;
    font-weight: bold;
    color: #631915;
    padding-bottom: 20px;
}
h3{
    font-size: 20px;
    font-weight: bold;
    color:#331188;
    border-left: 3px solid #331188;
    padding-left: 5px;
    margin-left: 20px;
}
h4{
    font-size: 18px;
    font-weight: bold;
    color: #631915;
    padding-bottom: 10px;
}
p{
    font-size: 16px;
    line-height: 1.5em;
}

.title_sub img{
  max-height: 450px;
  margin: 0 50px;
}
@media(max-width:600px){
  .title_sub img{
    margin: 0;
  }
}

ol{
  list-style-type: decimal;
  margin-left: 1em;
  padding-bottom: 10px;
  li{
    padding-bottom: 10px;
  }
}

/* ボタン */
a.btn {
	display: flex;
	align-items: center;
	position: relative;
	overflow: hidden;
	text-decoration: none;
	height: 2em;
	width: 100%;
	margin: auto;
	padding: 0 2rem;
	background: linear-gradient(
    82.3deg,
    rgb(25, 31, 82) 10.8%,
    rgba(224, 223, 219, 0.205) 25%
  );
	background-size: 400%;
	color: #fffbf7;
}
a.btn:hover::before {
  transform: scaleX(1);
}
a.btn:hover {
	color: #fffbf7;
}
a.btn span {
  position: relative;
  z-index: 1;
}
a.btn::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  transform: scaleX(0);
  transform-origin: 0 50%;
  width: 100%;
  height: inherit;
  border-radius: inherit;
  background: linear-gradient(
    82.3deg,
    #95260c 20%,
    rgba(224, 223, 219, 0.205) 94.3%
  );
  transition: all 1.15s;
}

/* top */
.logo{
  background-color: #fff;
  width: 175px;
  z-index: 500;
  padding: 10px;
  text-align: center;
  position: absolute;
  top: 40px;
  left: 10px;
  h2{
    font-family: "Yu Mincho", "YuMincho";
    font-size: clamp(14px,1vw,16px);
    padding: 0;
  }
}
@media(max-width:350px){
  .logo{
    display: none;
  }
}
#top{
    position: fixed;
    right: 0;
    top: 0;
    z-index: 100;
}

.contact_btn{
  background-color: #95260c;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  display: inline-block;
  padding: 10px;
  z-index: 500;
  position: absolute;
  top: 40px;
  right: 90px;
  width: 100px;
  text-align: center;
}
.contact_btn:hover{
  background-color: #fff;
  color: #95260c;
  border: 2px solid #95260c;
}

.contact_btn_footer{
  background-color: #95260c;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  display: inline-block;
  padding: 10px;
  width: 100px;
  text-align: center;
  height: 38.39px;
}
.contact_btn_footer:hover{
  background-color: #fff;
  color: #95260c;
  border: 2px solid #95260c;
}

/*ハンバーガーメニュー*/
.menu_btn{
    position: relative;/*ボタン内側の基点となるためrelativeを指定*/
    background:#95260cdd;
    cursor: pointer;
    width: 50px;
    height:50px;
    border-radius: 5px;
    z-index: 5;
    margin-right: 15px;
}
  
  /*menuボタン内側*/
.menu_btn span{
    display: inline-block;
    transition: all .4s;/*アニメーションの設定*/
    position: absolute;
}

.menu_btn span:nth-of-type(1),
.menu_btn span:nth-of-type(3) {
      height: 2px;
      background: #fcfaf2;
      width: 62%;
      left: 10px;
}
  
.menu_btn span:nth-of-type(1) {
  top:13px; 
}

.menu_btn span:nth-of-type(2) {
  top:19px;
  left:10.8px;
  font-size:0.6rem;
  text-transform: uppercase;
  color: #fcfaf2;
}

.menu_btn span:nth-of-type(3) {
  top:36px;
}

/*activeクラスが付与されると線が回転して×になり、Menu表記をしている2つ目の要素が透過して消える*/
.menu_btn.active span:nth-of-type(1) {
    top: 18px;
    left: 18px;
    transform: translateY(6px) rotate(-45deg);
    width: 30%;
}

.menu_btn.active span:nth-of-type(2) {
  opacity: 0;
}

.menu_btn.active span:nth-of-type(3){
    top: 30px;
    left: 18px;
    transform: translateY(-6px) rotate(45deg);
    width: 30%;
}

.menu-container {
  top: 0; /* 変更: top から bottom に変更 */
  left: 0;
  width: 100%;
  overflow: hidden;
  z-index: 2;
}

.menu_button {
    position: fixed;
    top: 20%; /* 変更: top から bottom に変更 */
    right: 3%;
    cursor: pointer;
    z-index: 2;
}

#menu-toggle {
  display: none;
}

/* メニュー内 */
.menu {
  position: fixed;
  right: -100%; /* 変更: top から bottom に変更 */
  top:0;
  width: 20%;
  min-width:230px;
  height: 100%;
  background-color: #21354fee;
  transition: 0.4s;
  z-index: 1;
  overflow-y: auto;
  .sub_menu .sub_list{
    display: none;
    padding: 0;
    li a{
    font-size: 12px;
    }
  }
  .sub_menu:hover{
    .sub_list{
      display: block;
    }
  }
}
@media screen and (max-width:769px) {
  .menu {
    left: 100%;
    width: 100%;
    .sub_menu .sub_list{
      display: block;
    }
  }
}

#menu-toggle:checked ~ .menu {
  right: 0; /* 変更: top から bottom に変更 */
}
@media screen and (max-width:769px) {
  #menu-toggle:checked ~ .menu {
    left: 0;
  }  
}

.menu ul {
  list-style: none;
  padding-top: 180px;
  text-align: center;
    li a{
      text-decoration: none;
      color: #dadada;
      font-size: 18px;
      display: block;
      padding: 10px 0;
      transition: 0.2s;
  }
}
@media(max-width:600px) {
  .menu ul{
    padding-top: 110px;
  } 
}

.menu ul li a:hover {
  color: #fcfaf2;
  transform: perspective(100px) translateZ(20px);
}

#top label{
  position: absolute;
  top: 35px;
  right: 10%;
}

nav small{
  font-size: 10px;
}

.footer_menu_pc{
  background-color: #95260c;
  font-size: 14px;
  width: 100%;
  color: #fffbf7;
   ul{
    display:flex;
    padding: 10px;
    justify-content: center;
    li{
      margin: 0 10px;
      flex-grow: 1;
      text-align: center;
      max-width: 120px;
    }
  }
}
.footer_menu_sp{
  display: none;
  background-color: #95260c;
  font-size: 14px;
  width: 100%;
  color: #fffbf7;
   ul{
    display:flex;
    padding: 10px;
    justify-content: center;
    li{
      margin: 0 10px;
      flex-grow: 1;
      text-align: center;
      max-width: 120px;
    }
  }
}
.footer_menu_pc li + li,
.footer_menu_sp li + li {
  border-left: 2px solid #fffbf7;
}

.footer_menu_pc ul li a,
.footer_menu_sp ul li a{
  display: block;
  height: 100%;
  width: 100%
}

.footer_menu_pc ul li a .footer_on,
.footer_menu_sp ul li a .footer_on{
  display: none;
}
.footer_menu_pc ul li a:hover .footer_off,
.footer_menu_sp ul li a:hover .footer_off{
  display: none;
}
.footer_menu_pc ul li a:hover .footer_on,
.footer_menu_sp ul li a:hover .footer_on{
  display: inline;
}

@media (max-width:600px) {
  .footer_menu_pc{
    display: none;
  }
  .footer_menu_sp{
    display: block;
  }
}

.footer_conte{
  margin-top: 30px;
  display: flex;
  padding: 10px;
  justify-content: space-around;
}

.footer_info{
  text-align: left;
  padding-left: 100px;
}
.footer_tel{
  font-size: 36px;
  font-weight: bold;
}
@media (max-width:850px) {
  .footer_conte{
    display: block;
    text-align: center;
    .footer_info{
      text-align: center;
      padding-left: 0;
    }
  }
}
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
/* MV */
.mv_top_pc{
  position: relative;
}
.mv_top_sp{
  position: relative;
  display: none;
}
.mv_top_pc img,
.mv_top_sp img{
  max-width: 100%;
}
.mv_top_sp{
  display: none;
}
.catch{
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  color: #fffbf7;
  font-size: clamp(24px,3vw,50px);
  text-shadow: 2px 3px 2px rgba(0, 0, 0, 0.4);
  font-weight: bold;
}
@media (max-width:600px){
  .mv_top_pc{
    display: none;
  }
  .mv_top_sp{
    display: block;
  }
  .catch{
    bottom: 140px;
  }
}
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
/* topセクション */
.top_conte1,
.top_conte2,
.top_conte3{
  position: relative;
  margin-top: -2px;
}
.top_hako1,
.top_hako2{
  display: flex;
}
  .top_hako1 div,
  .top_hako2 div{
  border: 2px solid #331188;
}
.top_hako2{
  margin-top: -2px;
}
.title_conte{
  width: 35%;
  text-align: right;
  border-left: none!important;
  padding-left: 80px;
  background-color: #fffbf7;
  img{
    max-height: 350px;
  }
  h1{
    padding-top: 15px;
  }
}
.top_thumb{
  width: 65%;
  height: 400px;
  border-right: none!important;
  margin-left: -2px;
}
.top_location{
  background-image: url(../img/top_location.jpg);
  background-size: cover;
  width: 100vw;
  height: 100%;
}
.top_facility{
  background-image: url(../img/top_facility.png);
  background-size: cover;
  width: 100%;
  height: 100%;
}
.top_plan{
  background-image: url(../img/top_plan.png);
  background-size: cover;
  width: 100vw;
  height: 100%;
}

.title_under{
  width: 35%;
  border-left: none!important;
  padding-left: 100px;
  p{
    width: 100%;
    height: 400px;
  }
}

.top_textarea{
  width: 65%;
  border-right: none!important;
  margin-left: -2px;
  background-color: #fffbf788;
  padding: 30px 100px 30px 0;
  h2,p{
    padding: 20px;
  }
  a img{
    width: 100%;
    margin: 50px 0 50px;
  }
}
@media (max-width:769px) {
  .top_textarea{
    padding-right: 10px;
  }
}
.rev .title_conte,
.rev .title_under{
  width: 35%;
  border-right: none!important;
  border-left: 2px solid #331188!important;
  margin-left: -2px;
  padding-left: 0;
  img{
    max-height: 350px;
  }
  h1{
    text-align: left;
  }
}
.rev .top_thumb,
.rev .top_textarea{
  border-right: 2px solid #331188!important;
  border-left: none!important;
  width: 65%;
}
.back_img{
  border: none;
  z-index: -1;
  position: absolute;
  top: 45%;
  left: 0;
  img{
    max-width: 70%;
    min-width: 500px;
    height: auto;
  }
}
.back_img_rev{
  border: none;
  z-index: -1;
  position: absolute;
  top: 45%;
  text-align: right;
  right: 0;
  img{
    max-width: 70%;
    min-width: 500px;
    height: auto;
  }
}
/* セクション */
.conte_n{
  flex-direction: row;
  position: relative;
    h1{
      transform: rotate(90deg);
      color: #838383;
      border-bottom: 3px solid #838383;
      font-size: 128px;
      position: absolute;
      top: 70px;
      width: 500px;
      text-align: end;
      line-height: 60%;
    }
}

.conte_r{
  flex-direction:row-reverse;
  position: relative;
  background-color: #f1ebe0;
  transform-origin: top right;
  margin-left: calc(((100vw - 100%) / 2) * -1);
  margin-right: calc(((100vw - 100%) / 2) * -1);
  padding-left: calc((100vw - 100%) / 2);
  padding-right: calc((100vw - 100%) / 2);
  h1{
    transform: rotate(-90deg);
    border-right: 3px solid #fffbf7;
    transform: scaleX(-1);
    color: #fffbf7;
    font-size: 128px;
    position: absolute;
    right: 10px;
    width: 500px;
    text-align: end;
    line-height: 60%;
  }
}

@media screen and (max-width:769px) {
  .conte_n,.conte_r{display: block;}
}
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
/* セキュリティ */

/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
/* 設備 */
.txt_sub{
  display: flex;
  margin-bottom: 30px;
  img{
    padding-left: 20px;
    margin-top: -50px;
    max-width: 300px;
    width: 100%;
    margin-bottom: 10px;
  }
}
@media (max-width:850px){
  .txt_sub img{
    display: none;
  }
}
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
/* 来店予約 */
.contact{
  margin:0 auto;
  padding: 100px 20px 150px;
    table {
    margin: 30px auto;
    padding: 10px;
    border: 1px solid #ccc;
    width: 70%;
    max-width: 700px;
    min-width: 380px;
    }
    th{
      font-weight: bold;
      text-align: left; /* テキスト左寄せ */
      width: 35%; /* 横幅30%指定（グレーの背景色部分） */
      background-color: #eee;
      vertical-align: middle;
      padding-left: 20px;
      font-size: 14px;
    }
    td{
      padding: 20px;
      border: 1px solid #ccc;
      width: 50%;
    }
}
@media (max-width:600px){
  .contact{
    padding: 100px 0;
  }
  .contact table{
    width: 100vw;
  }
}

.form-text {
    width: 100%;
    padding: 10px;
    border-radius: 5px;
    border: 1px solid #ccc;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    max-width: 400px;
  }
.form-textarea {
    width: 100%;
    padding: 10px;
    height: 200px;
    border-radius: 5px;
    border: 1px solid #ccc;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
}
.form-select {
    width: 180px;
    height: 40px;
    padding: 5px;
    border: 1px solid #ccc;
    border-radius: 5px;
}
.contact-submit {
    width: 250px; /* 横幅指定 */
    background-color: #333; /* 背景色 */
    color: #fff; /* 文字色 */
    font-weight: bold; /* 文字の太さ */
    display: block; /* インライン要素をブロック要素に変更 */
    margin: 0 auto; /* 中央寄せ */
    font-size: 16px; /* 文字の大きさ */
    padding: 15px; /* 内側の余白 */
    border-radius: 100vh; /* 角丸指定 */
    border: none;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    cursor: pointer;
    text-align: center;
}
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

.privacy{
  padding: 50px;
  p{
    margin-bottom: 30px;
  }
}
@media(max-width:600px){
  .privacy{
    padding: 50px 10px;
  }
}


  /* 廣瀬エリア */
  img,object,embed {
    max-width: 100%;
    height: auto;
    }
    /* 廣瀬エリア */
  .de{
    .mterial{
      display: flex;
      justify-content: center;
      margin-bottom: 10%;
      .desc{
        width: 70%;
      .img_1{
        margin-bottom: 3%;
      }
      h2{
        margin-bottom: 2%;
        color: #631915;
      }
     }
    }
    .green{
      display: flex;
      justify-content:center;
      background-color: #F1EBE0;
      padding-bottom: 7%;
      .desc{
        width: 70%;
        .item_1{
          width: 100%;
          height: auto;
          margin-bottom: 1%;
        }
        .item_2{
          display: flex;
          justify-content: space-between;
          margin-bottom: 3%;
          gap: 10px;
          width: auto;
        }
        h2{
          margin-bottom: 2%;
          color: #631915;
        }
      }
    }
    .entrance{
      display: flex;
      justify-content: center;
      margin-bottom: 10%;
      .desc{
        width: 70%;
        img{
          margin-bottom: 3%;
          width: 100%;
          height: auto;
        }
        h2{
          margin-bottom: 2%;
          color: #631915;
        }
       }
    }
  }
  /* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

/* 橋本エリア */
.Lo-res-title{
  display: none;
}
.Lo-style{
  width: 1300px;
  padding-bottom: 100px;
  margin: 0 auto;
  position: relative;
  z-index: 40;
  display: flex;
  .Lo-style-title{
    width: 30%;
  }
  .Lo-style-contents {
    width: 70%;
    .Lo-style-img {
      width: calc(100% + (50vw - 650px));
      height: 300px;
      background-color: #838383;
      margin: 100px 0 0 50px;
      img{
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: left top;
      }
    }  
    h2 {
      margin: 100px 50px 0;
      font-weight: bold;
    }
    p {
      margin: 100px 0 0 50px;
      line-height: 1.7em;
      letter-spacing: 0.1em;
    }
  }  
}

.Lo-map{
  background-color: #f1ebe0;
  .Lo-map-box{
    width: 1300px;
    margin: 0 auto;
    position: relative;
    z-index: 30;
    display: flex;
    .Lo-map-contents{
      width: 80%;
      .google-map{
        margin: 100px 50px;
      }    
    } 
    .Lo-map-title{
      width: 20%;
      position: relative;
      img{
        position: absolute;
        right: 0;
      }
    }    
  }
}

.Lo-spot{
  /* padding-bottom: 50px; */
  .Lo-spot-explanation{
    margin: 0 auto;
    width: 1300px;
    display: flex;
    z-index: 20;
    position: relative;
    .Lo-spot-title{
      width: 30%;
    }
    .Lo-spot-text {
      width: 70%;
      h2 {
        margin: 100px 50px 0;
        font-weight: bold;
      }
      h3 {
        margin: 70px 50px 0;
        font-weight: bold;
      }
      p {
        margin: 20px 0 0 50px;
        line-height: 1.7em;
        letter-spacing: 0.1em;
      }
    }    
  }
}

.Lo-spot-shopping, .Lo-spot-Me-Ed, .Lo-spot-Pa-Fi, .Lo-spot-PF-Fi {
  width: 1300px;
  margin: 0 auto;
  h2 {
  margin: 100px 50px 0;
  font-weight: bold;
  }
  h3 {
  margin: 50px 50px 0;
  font-weight: bold;
  }
  p {
  margin: 10px 50px 0;
  line-height: 1.7em;
  letter-spacing: 0.1em;
  }
  .Lo-spot-image-list{
    display: flex;
    justify-content: space-between;
    .Lo-list-box {
      width: 400px;
      div {
        width: 400px;
        height: 300px;
        object-fit: cover;
        background-color: #838383;
        margin-top: 50px;
        img{
          width: 100%;
          height: 100%;
          object-fit: cover;
        }
      }
      p{
        text-align: center;
        margin-bottom: 50px;
      }
    }
  }    
}  
.Lo-spot-rise{
  margin-top: 100px;
  background-color: #f1ebe0;
  .Lo-rise-item{
    width: 1300px;
    margin: 0 auto;
    .Lo-rise-explanation{
      display: flex;
      .Lo-rise-leftitem{
        width: 45%;
        margin-top: 80px;
        p{
          margin: 30px 0 0 50px;
        }
      }
      .Lo-rise-rightitem{
        width: 55%;
        margin-top: 80px;
        .karisyasinn{
          width: 95%;
          height: 400px;
          margin-left: 5%;
          background-color: #838383;
          img{
            width: 100%;
            height: 100%;
            object-fit: cover;
          }
        }
      }   
    }
    .Lo-rise-imagelist {
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      margin-bottom: 80px;
      .kariminisyasinn{
        margin: 50px 0 80px;
        width: 250px;
        height: 180px;
        background-color: #838383;
        img{
          height: 100%;
          object-fit: cover;
        }
      }
    }
  }
}  

@media screen and (max-width:1400px){
  .Lo-style{
    width: 1000px;
    .Lo-style-title{
      width: 20%;
    }
    .Lo-style-contents {
      width: 80%;
      .Lo-style-img {
        width: calc(100% + (50vw - 500px));
      }  
    }  
  }  
  
  .Lo-map{
    .Lo-map-box{
      width: 1000px;
    }
  }

  .Lo-spot{
    .Lo-spot-explanation{
      margin: 0 auto;
      width: 1000px;
      .Lo-spot-title{
        width: 20%;
      }
      .Lo-spot-text {
        width: 80%;
      }    
    }
  }
  .Lo-spot-shopping, .Lo-spot-Me-Ed, .Lo-spot-Pa-Fi, .Lo-spot-PF-Fi {
    width: 900px;
    margin: 0 auto;
    .Lo-spot-image-list{
      .Lo-list-box {
        width: 280px;
        div {
          width: 280px;
          height: 200px;
        }
      }
    }    
  }  

  .Lo-spot-rise{
    .Lo-rise-item{
      width: 900px;
      .Lo-rise-imagelist {
        .kariminisyasinn{
          margin: 50px 0 80px;
          width: 170px;
          height: 120px;
        }
      }
    }
  }    
}

@media screen and (max-width:1000px){
  .Lo-style{
    width: 700px;
    .Lo-style-title{
      width: 15%;
    }
    .Lo-style-contents {
      width: 85%;
      .Lo-style-img {
        width: calc(100% + (50vw - 350px));
      }  
    }  
  }  
  
  .Lo-map{
    .Lo-map-box{
      width: 700px;
      .Lo-map-contents{
        width: 85%;
      } 
      .Lo-map-title{
        width: 15%;
        position: relative;
      }      
    }
  }

  .Lo-spot{
    .Lo-spot-explanation{
      margin: 0 auto;
      width: 700px;
      .Lo-spot-title{
        width: 15%;
      }
      .Lo-spot-text {
        width: 85%;
      }    
    }
  }
  .Lo-spot-shopping, .Lo-spot-Me-Ed, .Lo-spot-Pa-Fi, .Lo-spot-PF-Fi {
    width: 700px;
    margin: 0 auto;
    .Lo-spot-image-list{
      .Lo-list-box {
        width: 230px;
        div {
          width: 220px;
          height: 150px;
        }
      }
    }    
  }  

  .Lo-spot-rise{
    .Lo-rise-item{
      width: 700px;
      .Lo-rise-explanation{
        .Lo-rise-rightitem{
          .karisyasinn{
            width: 95%;
            height: 500px;
          }
        }   
      }
      .Lo-rise-imagelist {
        .kariminisyasinn{
          width: 130px;
          height: 100px;
        }
      }
    }
  }    
}
@media screen and (max-width:767px){
  .Lo-res-title{
    display: block;
    padding-top: 30px;
    h1{
      color: #f1ebe0;
      font-size: 48px;
    }
    div{
      width: 100vw;
      height: 5px;
      background-color: #f1ebe0;
      margin-top: -10px;
    }
    .Lo-res-map-h1{
      color: #ffffff;
    }
    .Lo-res-map-underbar{
      background-color: #ffffff;
    }
  } 
  .Lo-style{
    width: 100vw;
    display: block;
    .Lo-style-title{
      display: none;
    }
    .Lo-style-contents {
      width: 100%;
      .Lo-style-img {
        width: 100%;
        margin: 80px 0 0;
        height: 150px;
      }  
      h2 {
        margin: 50px 10px 0;
        font-weight: bold;
      }
      p {
        margin: 50px 10px 0 ;
        line-height: 1.7em;
        letter-spacing: 0.1em;
      }   
    } 
  }  
  
  .Lo-map{
    .Lo-map-box{
      width: 100vw;
      display: block;
      .Lo-map-contents{
        width: 100%;
        padding-bottom: 50px;
        .google-map{
          margin: 80px 10px 0;
        }      
      } 
      .Lo-map-title{
        display: none;
      }      
    }
  }

  .Lo-spot{
    .Lo-spot-explanation{
      width: 100vw;
      .Lo-spot-title{
        display: none;
      }
      .Lo-spot-text {
        width: 100%;
        h2 {
          margin: 80px 50px 0;
          font-weight: bold;
        }
        h3 {
          margin: 50px 50px 0;
          font-weight: bold;
        }
        p {
          margin: 20px 50px 0 ;
          line-height: 1.7em;
          letter-spacing: 0.1em;
        }  
      }    
    }
  }
  .Lo-spot-shopping, .Lo-spot-Me-Ed, .Lo-spot-Pa-Fi, .Lo-spot-PF-Fi {
    width: 100vw;
    margin: 0 auto;
    .Lo-spot-image-list{
      display: block;
      .Lo-list-box {
        width: 100vw;
        margin: 40px 0;
        div {
          width: 90vw;
          height: 200px;
          margin: 0 5vw;
        }
      }
    }    
  }  
  .Lo-spot-rise{
    padding-bottom: 50px;
    .Lo-rise-item{
      width: 100vw;
      .Lo-rise-explanation{
        display: block;
        .Lo-rise-leftitem{
          width: 100%;
          img{
            margin: 50px 5% 0;
            width: 90%;
          }
          p{
            margin: 30px 50px;
          }
        }
        .Lo-rise-rightitem{
          width: 100%;
          margin-top: 50px;
          .karisyasinn{
            width: 90%;
            height: 300px;
          }
        }   
      }
      .Lo-rise-imagelist {
        display: none;
      }
    }
  }  
}

.txt h3{
  margin-left: 0;
}
.txt img{
  margin-bottom: 10px;
}

/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

/* 山崎エリア */
.not_link{
  cursor: not-allowed;
}
/* プランのメイン */
.plan_main {
  background-color: #FFFBF7;
  h2 {
    display: flex;
    justify-content: center;
    /* margin: 15%; */
  }
}

.plan_main01,
.plan_aty{
  display: flex;
  justify-content: center;
  margin-bottom: 10%;
  a img {
    display: block;
    transition-duration: .5s;
    margin: 10px auto 30px;
    padding: 0 10px;
    max-width: 400px;
    width: 100%;
  }
  a img:hover {
    transform: scale(1.1);
  }
  a .not_link:hover{
    transform: none;
  }
}

/* Aタイプ */
.plan_atipe {
  background-color: #FFFBF7;
  h1 {
    text-align: center;
    margin: 10% 0 5% 0;
 
  img {
    width: 9%;
    height: auto;
  }}
}
.plan_abox {
  display: flex;
  justify-content: center;
}
.plan_at { 
  margin-right: 3%;
  img {
    max-width: 680px;
    width: 100%;
    height: auto;
    margin: 0 0 0 8%;
  }
  h2 {
    width: 65%;
    height: auto;
    margin: 0 0 12% 18%;
  }
}
.plan_a_01 {
  img {
    width: 20%;
    height: auto;
  }
  
}
.plan_a_02 {
  img {
    width: 80%;
    height: auto;  
  }
}
.plan_a01 {
  /* margin: 10% 0; */
  margin: 10% auto;
  h3 {
    font-weight: 700;
    color: #95260c;
    margin: 3% 0;
  }
  p {
    line-height: 170%;
    margin: 3% 0;
  }
}

@media (max-width:800px) {
  .plan_main {
    h2 {
    font-size:clamp(20px,3.5vw,28px);
  }
  }
  .plan_main01{
    display: block!important;
    text-align: center;
  }

/* aplan */
  .plan_atipe {
    h1 {
      display: flex;
      justify-content: center;
      margin: 10%;
    img {
      width: 20%;
      height: auto;
    }}
  }  
.plan_abox {
  display: flex;
  flex-direction: column;
  margin: 0 0 0 14%;
}
.plan_aty {
  display: flex;
  flex-direction: column;
  text-align: center;
  margin: 10% 0;  
}
.plan_at {
  img {
    width: 98%;
    height: auto;
    margin: 0;
  }
  h2 {
    width: 65%;
    height: auto;
    margin: 0 0 12% 20%;
  }
}
}
  /* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */