@charset "utf-8";

/* スマホ（〜767px） */
@media (max-width: 767px) {
  /* スマホ専用スタイル */
}

/* タブレット（768px〜1024px） */
@media (min-width: 768px) and (max-width: 1024px) {
  /* タブレット専用スタイル */
}

/* PC（1025px〜） */
@media (min-width: 1025px) {
  /* PC専用スタイル */
}



.breadcrumb_list { position: absolute; left: 5vw; }

.shop_top_wrap { margin-bottom: 80px; }
.shop_text_wrap { position: relative; }
.shop_name_wrap { position: absolute; top: -60px; left: 0; z-index: 1; }
.shop_name_wrap .shop_name { width: fit-content; margin-top: -12px; padding: 0 10px 2px; background: #004680; line-height:1.2em; }
.shop_img_wrap { position: relative; width: 100%; height: fit-content; margin: 32px 0 52px; }
.shop_img_wrap .shop_img { position: relative; display: block; width: 100vw; aspect-ratio: 3 / 2; object-fit: cover; margin-left: -5vw; background: #666; z-index: 1;}
.shop_info_wrap { display: flex; flex-direction: column; gap: 8px; }
.shop_info_wrap dl { display: flex; padding-bottom: 8px; border-bottom: 1px solid #DADADA;  }
.shop_info_wrap dl dt { width: 30%; color:#004680; font-weight:bold; }

.shop_map_wrap { width: 100%; height: fit-content; }
.shop_map { width: 100%; height: 400px; border: none; }
.icon_othersite_black { width: 16px; transform: translateY(1px); }

.shop_photo_list { display: flex; flex-direction: column; gap: 24px; }
.shop_photo_list li { width: 100%; aspect-ratio: 3 / 2; }
.shop_photo_list li img { width: 100%; height: 100%; object-fit: cover; }
.shop_photo_panorama { width: 100%; aspect-ratio: 3 / 5; margin-top: 24px; border: none; }

@media (min-width: 768px) {
  .bg_left { position: relative; padding-bottom: calc(80px + min(5.5vw, 80px)); }
  .bg_left::before { content: ''; position: absolute; top: calc(80px + min(15.46vw, 226.8px)); left: calc(min(45vw, 660px) - 50vw); display: inline-block; width: calc(calc(200vw / 3) + min(30vw, 440px)); height: min(calc(9vw + 500px), 700px); border-top-right-radius:  30px; border-bottom-right-radius: 30px; background: #EDF5FD; z-index: -1;  }
  .contents.nopadding.bg_left { padding-top: 80px; }
  .shop_top_wrap { width:90%; max-width:1100px; display: flex; justify-content: space-between; margin:0 auto; }
  .shop_name_wrap { position: relative; top: auto; left: auto; }
  .shop_name { margin-top: 0; }
  .shop_img_wrap { width: 57%; margin: 0; }
  .shop_img_wrap::before { content: ''; position: absolute; bottom: -24px; left: -24px; width: 60%; height: 60%; background: #004680; }
  .shop_img_wrap .shop_img { width: 100%; margin-left: 0; }
  .shop_text_wrap { display: flex; flex-direction: column; justify-content: space-between; width: 38%; }
  .shop_name_wrap .shop_name { font-size: min(2.1vw, 32px); margin-bottom:32px;}
  .shop_info_wrap { gap: min(0.5vw, 8px); }
  .shop_info_wrap dl { padding-bottom: min(0.4vw, 8px); font-size: min(1.5vw, 16px); }

  .shop_map_contents_bg { background: transparent; }
  .shop_map_contents_bg .section_title { margin-bottom: 20px; }
  .shop_map_contents_bg .section_title_en { color: #FFF; opacity: 0.9; }

  .shop_photo_list { flex-direction: row; flex-wrap: wrap; }
  .shop_photo_list li { width: calc(calc(100% / 3) - 16px); }
  .panorama_wrap { width:100%; background:#EDF5FD; padding:80px 0; margin-top:40px; }
  .shop_photo_panorama { width: calc(100% - 160px); margin:0 auto; aspect-ratio: 3 / 2; display:block; }
}

.sns_wrap { width:100%; height:30px; display:flex; align-items:center; margin:10px 0 5px 0; }
.shop_info_wrap dl dd .logo_sns { margin-right:20px; }
.shop_info_wrap dl dd .logo_sns:hover { opacity:0.7; } 
.shop_info_wrap dl dd .logo_sns img { height:25px; }
.shop_info_wrap dl dd .logo_sns img.line { height:35px; margin-top:2px; }
.shop_info_wrap dl dd .logo_sns img.facebook { height:30px; }
.shop_info_wrap dl dd .logo_sns img.instagram { height:30px; margin-top:2px; }
.input_send { margin-top:40px; }
.full-screen.slider span.flag_shop { width:auto; padding:0 10px; white-space: nowrap; }
.contents_bg_excursion { padding-top:80px; }
.slider_wrap { padding-bottom:120px; }

.shop_map_link:hover { text-decoration:underline;}

@media (max-width: 768px) {
  .slider_wrap .button_normal { width:90%;  margin-bottom:0; }
}


@media (min-width: 768px) {
  .contact_form { width:90%; max-width:1000px; margin:0 auto; }
}