body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{margin:0;padding:0;}
address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;}
ul{list-style:none;}
table{border-collapse:collapse;border-spacing:0;}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p,
blockquote, pre,a, abbr, acronym, address, big, cite, code, del, dfn, em,
img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var, b, u, i,
center, dl, dt, dd, ol, ul, li,fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary, time, mark, audio, video, main
{margin: 0;padding: 0;border: 0;outline: 0;font-size: 100%;font-weight: normal;font-style: normal;vertical-align: baseline;background: transparent;box-sizing: border-box;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, main {display: block;margin: 0;}
body {color: #231815;font-family:"ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro",  "游ゴシック体 Medium", "Yu Gothic Medium", YuGothic, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;background: #fff;text-align: left;}
ol, ul {list-style: none;}
a {text-decoration: none;color:#231815;}
p {font-size: 16px;}
hr {height: 0;margin: 0;padding: 0;border: 0;}
img{width: 100%;vertical-align: top; }

@media (min-width: 769px){
  .br-pc { display:block; }
  .br-sp { display:none; }
  }
@media (max-width: 768px){
  .br-pc { display:none; }
  .br-sp { display:block; }
  }
.sp_only{display: none;}
#sp_only{display: none !important;}
@media (max-width: 768px) {
  .pc_only{display:none;}
  .sp_only{display: block;}
  #pc_only{display:none !important;}
  #sp_only{display: block !important;}}
.flex{display: flex;justify-content: space-between;flex-wrap: wrap;}
.flex_start{display: flex;justify-content: start;flex-wrap: wrap;}
.center{text-align: center; margin: 10px auto 0;}
.mincho{font-family: "リュウミン M-KL","Ryumin Medium KL","游明朝", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "Times New Roman", Times, Garamond, Georgia, serif;}
.twoletter{font-family: "リュウミン M-KL","Ryumin Medium KL","ＭＳ Ｐ明朝", "MS PMincho", "Times New Roman", Times, Garamond, Georgia, serif; margin: 0 -1px;}
.Android .mincho{font-family: 'Noto Serif JP', serif;}

#pageTop {position: fixed;bottom: 20px;right: 22px;font-size: 20px;font-weight: bold;z-index: 10;}
#pageTop a {display: block;padding: 10px 16px;text-decoration: none;text-align: center;border-radius: 50px;background: linear-gradient(0deg, rgba(187, 161, 17, 1) 0%, rgba(222, 191, 22, 1));
  color:#fff;transition: all .2s ease;}
#pageTop a:hover {color:#fff;padding: 10px 16px;background: #b03a3e;text-align: center;transition: all .2s ease;}
@media(max-width: 768px){
  #pageTop{bottom: 50px;right: 12px;}
  #pageTop a {padding: 10px 16px;}
  #pageTop a:hover{padding: 10px 16px;}}

#reservation {position: fixed; width: auto; bottom: 90px; right:0; font-size: 15px; font-weight: bold;z-index: 10;}
#reservation a {display: block; width: 100px; height:auto; padding: 10px; text-decoration: none; text-align: center; background: linear-gradient(0deg, rgb(0, 79, 118, 1) 0%, rgba(0, 93, 140, 1));
  color:#fff;}
#reservation a:hover {background: linear-gradient(0deg, rgb(134, 44, 47) 0%, rgba(176, 58, 62, 1)); transition: all .2s ease;}
@media(max-width: 768px){
#reservation {display: flex; position: fixed; width: 100%; bottom: 0; left:0; font-size: 15px; font-weight: bold;z-index: 10;}
#reservation a.mincho:first-child {border-bottom:none;border-right: 1px solid rgba(255,255,255,.5);padding-right: 1px;}
#reservation a {display: block; width: 100%; padding: 10px 0; text-decoration: none; text-align: center; background: linear-gradient(0deg, rgb(0, 79, 118, 1) 0%, rgba(0, 93, 140, 1));
  color:#fff;}
#reservation a:hover {background: linear-gradient(0deg, rgb(134, 44, 47) 0%, rgba(176, 58, 62, 1)); transition: all .2s ease;}}

#top-head {position: fixed; width: 100%; margin: 0 auto; height: 70px; z-index: 10; background-color: #fff; z-index: 999;}
#top-head .nav_bg{color:#fff;}
#top-head a{font-size: 17px; color: #231815;}
.logo{width: 300px;margin-top: 2px;margin-left: 15px;}
#top-head.fixed .nav_bg{color:#231815;}
#top-head.fixed .logo{width: 300px;margin-top: 2px;}
#global-nav ul {list-style: none;position: absolute;top:0;right: 0;display: flex;}
#global-nav ul li {text-align: center;height: 70px;padding-top: 22px;font-weight: bold; padding-left: 20px; padding-right: 20px;}
#top-head.fixed #global-nav ul li {height: 70px;}
#global-nav ul a:hover {color:#005d8c;}
#top-head.fixed #global-nav ul a li:hover {background:linear-gradient(0deg, rgb(0, 79, 118, 1) 0%, rgba(0, 93, 140, 1));}
@media(max-width: 1030px) {
  #top-head {position: fixed;width: 100%;margin: 0 auto;height: 60px;z-index: 999;}
  #top-head.fixed {height:60px;background: rgba(255,255,255,.9);}
  #top-head a{font-size: 14px;}
  #top-head.fixed a{color:#231815;}
  #top-head.fixed .nav_bg{color:#fff;}
  .logo{width: 210px;margin-top: 7px;margin-left: 10px;}
  #top-head.fixed .logo{width: 210px; margin-top: 7px;}
  #global-nav ul {list-style: none;position: absolute;top:0;right: 0;display: flex;}
  #global-nav ul li {text-align: center;height: 50px;padding-top: 15px;font-weight: bold; padding-left: 10px; padding-right: 10px;}
  #top-head.fixed #global-nav ul li {height: 60px;padding-top: 15px;}
  #global-nav ul a:hover {color:#005d8c;}
  #top-head.fixed #global-nav ul a li:hover {background:linear-gradient(0deg, rgb(0, 79, 118, 1) 0%, rgba(0, 93, 140, 1));}}
@media(max-width: 768px) {
  #sp_head{position: fixed;width: 100%;margin: 0 auto; height: 60px; background: #fff; z-index: 999;}
  #sp_head.fixed {height:60px;background: rgba(255,255,255,.9);}
  #sp_head a{font-size:14px; width: 100%;}
  #sp_head .logo{width: 200px;margin-top: 8px;margin-bottom: 5px;z-index: 999; position: relative;}
  .menu-btn {position: fixed; top: 2px; right: 10px; display: flex; height: 60px; width: 60px;
    justify-content: center; align-items: center; z-index: 90;}
  .menu-btn span,.menu-btn span:before,.menu-btn span:after {
    content: ''; position: absolute; display: block; height: 2px; width: 35px; border-radius: 3px; background-color: #231815;}
  .menu-btn span:before {bottom: 10px;}
  .menu-btn span:after {top: 10px;}
  #menu-btn-check{display: none;}
  #menu-btn-check:checked ~ .menu-btn span {background-color: rgba(255, 255, 255, 0);}
  #menu-btn-check:checked ~ .menu-btn span::before {background-color: #231815; bottom: 0; transform: rotate(45deg);}
  #menu-btn-check:checked ~ .menu-btn span::after {background-color: #231815; top: 0; transform: rotate(-45deg);}
  .menu-content {width: 100%; height: auto; position: fixed; top: 0; right: 100%; z-index: 80; background-color: rgba(255, 255, 255, 0.9); transition: all 0.5s;}

  #global-nav ul {position: static; display: block;}
  #global-nav ul li {height: auto;}
  .menu-content ul {padding: 70px 10px 0;}
  .menu-content ul li {border-bottom: solid 1px #aaa; list-style: none; width: 100%;}
  .menu-content ul li:last-child{border-bottom: none;}
  .menu-content ul li a {display: block; position: relative; width: 100%; font-size: 16px; box-sizing: border-box;
    color:#231815; text-decoration: none; padding: 18px 15px 20px 0;}
  .menu-content ul li a:hover{color:#005d8c; font-weight: bold;}
  .menu-content ul li a::before {content: ""; width: 7px; height: 7px;
    border-top: solid 2px #231815; border-right: solid 2px #231815; transform: rotate(45deg); position: absolute; right: 11px; top: 16px;}
  #menu-btn-check:checked ~ .menu-content {right: 0 ;}}

.logo,#top-head .logo,#top-head,#top-head:after,
#contact_btn,#top-head.fixed #contact_btn,#global-nav ul,#top-head.fixed #global-nav ul,#global-nav ul li,#global-nav ul li a,
#top-head.fixed #mobile-head,#mobile-head{
  transition: all 0.2s ease;}

#top{width: 100%; padding-top: 70px;}
#top video{width:100%; height:100%; pointer-events: none;}
@media(min-width: 1300px) {
  #top{text-align: center; background-color: #333;}
  #top video{max-width: 1300px; height: auto; margin-bottom: -6px;}}
@media(max-width: 1030px) {
  #top{padding-top: 60px;}}


/***トップ　リード***/
section#lead{width: 100%; margin: 100px 0 120px; text-align: center;}
.lead_txt{width: 90%; margin: 40px auto;}
#lead .subtittle{font-size: 40px; font-weight:bold; line-height: 50px;}
#lead h1{margin:30px auto; font-size: 55px; font-weight:bold; letter-spacing: 0px;
  background: linear-gradient(0deg, #bba111 0%, #debf16 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;}
#lead .h1_number{position: relative; top: 0px; font-size: 48px; font-weight:bold;
  background: linear-gradient(0deg, #bba111 0%, #debf16 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;}
#lead .h1_year{position: relative; top: -2px; font-size: 38px; font-weight:bold; padding-right: 10px;
  background: linear-gradient(0deg, #bba111 0%, #debf16 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;}
#lead p{font-weight: bold;font-size: 20px;font-weight: bold;line-height: 42px; text-align: center;}
.lead_point{width: 90%; max-width: 1040px; margin: 30px auto 120px;border: solid 1px #c7000b; color:#c7000b;}
.lead_point p{padding: 10px;}
@media (max-width: 1000px){
  section#lead{margin: 50px 0 60px;}
  .lead_txt{width: 90%; margin: 30px auto;}
  #lead .subtittle{font-size: 35px; font-weight:bold; line-height: 50px;}
  #lead h1{margin:30px auto; font-size: 50px; font-weight:bold; letter-spacing: 0px;}
  #lead .h1_number{position: relative; top: 0px; font-size: 45px; font-weight:bold;}
  #lead .h1_year{position: relative; top: -2px; font-size: 32px; font-weight:bold; padding-right: 10px;}
  #lead p{font-weight: bold; font-size: 20px; font-weight: bold; line-height: 37px; text-align: center;}}
@media (max-width: 800px){
  #lead .subtittle{font-size: 30px;font-weight:bold;line-height: 50px;}}
@media (max-width: 700px){
  section#lead{margin: 0px 0;}
  #lead .subtittle{font-size: 20px;font-weight:bold;line-height: 30px;}
  #lead h1{margin:20px auto; font-size: 32px; font-weight:bold; letter-spacing: 0px;}
  #lead .h1_number{position: relative; top: 0px; font-size: 30px; font-weight:bold;}
  #lead .h1_year{position: relative; top: 0px; font-size: 25px; font-weight:bold; padding-right: 10px;}
  #lead p{font-weight: bold; font-size: 16px; font-weight: bold; line-height: 30px; text-align: center;}}
@media (max-width: 450px){
  #lead .subtittle{font-size: 16px;font-weight:bold;line-height: 30px;}
  #lead h1{font-size: 28px;font-weight:bold;}
  #lead .h1_number{position: relative; top: 0px; font-size: 25px; font-weight:bold;}
  #lead .h1_year{position: relative; top: 0px; font-size: 20px; font-weight:bold; padding-right: 10px;}
  #lead p{font-weight: bold;font-size: 14px;font-weight: bold;line-height: 28px; text-align: center;}}


/***日程表***/
section#date{background-color: rgba(254,236,210,.5); width: 100%; padding: 40px 0; text-align: center; border-top: solid 1px #f29500; border-bottom: solid 1px #f29500;}
.date_txt p{font-size: 20px; margin-top: 10px;}
.date_a{display: inline-block; font-family: sans-serif; font-size: 15px; padding: 1px 7px; color:#fff; background-color: #b95061; border-radius: 3px;}
.date_b{display: inline-block; font-family: sans-serif; font-size: 15px; padding: 1px 7px; color:#fff; background-color: #005d8b; border-radius: 3px;}
.date_arrow{display: inline-block; font-size: 18px; color:#005d8c;}
@media (max-width: 768px){
  section#date{padding: 30px 0 40px;}
  .date_txt p{font-size: 16px; margin-top: 7px; font-weight: normal; line-height: 30px;}
  .date_a{display: inline-block; font-family: sans-serif; font-size: 13px; padding: 0px 7px; color:#fff; background-color: #b95061; border-radius: 3px; line-height: 25px;}
  .date_b{display: inline-block; font-family: sans-serif; font-size: 13px; padding: 0px 7px; color:#fff; background-color: #005d8b; border-radius: 3px; line-height: 25px;}
  section#date.sp_only{display: none;}
  section#date.pc_only{display:block !important;}}
@media (max-width: 579px){
  section#date.sp_only{display: block;}
  section#date.pc_only{display:none !important;}}

.date_fb{display: flex; width: 80%; max-width: 1040px; margin: 25px auto 15px; justify-content: space-between;}
.date_fb img{width: calc(100% / 2 - 15px);}
.date_att{text-align: left; font-size: 14px; width: 80%; max-width: 1040px; margin: 15px auto;}
.date_att img{width: auto; height: 18px;}
.icon_tour,.icon_firstport span{padding-left: 48px;}
.icon_tour,.icon_firstport{position: relative;}
.icon_tour img,.icon_firstport img{position: absolute; top: 50%; left: 0px; transform: translateY(-50%);-webkit-transform: translateY(-50%);-ms-transform: translateY(-50%);}
.icon_passage span{padding-left: 48px; display: inline-block;}
.icon_passage{position: relative;}
.icon_passage img{position: absolute; top: 4px; left: 0px;}
@media (max-width: 768px){
  .date_fb{display: block; width:100%; max-width:1040px; margin: 25px auto 10px; justify-content: space-between;}
  .date_fb img{width: 80%;}}

.date_att2{margin: 3px auto 0px; padding-left: 1em; text-align: left; font-size: 14px;}
.date_att2{padding-left: 1em;}
.date_att2:before{content: "※"; margin-left: calc( -1em - 2px ); margin-right: 2px;}
@media (max-width: 768px){
  .date_att2{margin: 3px auto 0px; padding-left: 1em; text-align: left;}
  .date_att2{padding-left: 1em;}
  .date_att2:before{content: "※"; margin-left: calc( -1em - 2px ); margin-right: 2px;}}

/***見どころ***/
#point{width: 90%; max-width: 1040px; margin: 120px auto; padding: 50px 25px; }
#point h2{margin-bottom: 20px; font-size: 28px; font-weight: bold; color: #231815;}
.point_fb{display: flex; gap:20px}
.point_fb_title{position: relative; margin-top: 20px; font-size: 24px; line-height: 35px; color: #231815; border-left: 5px solid #c7000b; padding-left: 10px;}
.point_fb_title::before{content: ""; position: absolute; bottom: 0; right: 0; width: 45px; height: 2px; border-radius: 9999px; background-color: #005d8b; transform-origin: calc(100% - 2px) 50%;}
.point_fb_title::after{content: ""; position: absolute; bottom: 2px; right: 0; width: 25px; height: 2px; border-radius: 9999px; background-color: #005d8b; transform: rotate(45deg); transform-origin: calc(100% - 2px) 50%;}
@media (max-width: 950px) {
  #point{width: 90%; max-width: 1040px; margin: 80px auto; padding: 30px 25px;}
  #point h2{margin-bottom: 20px; font-size: 28px; font-weight: bold; color: #231815;}
  .point_fb{display: flex; gap:20px}
  .point_fb_title{position: relative; margin-top: 20px; font-size: 20px; line-height: 30px; color: #231815; border-left: 5px solid #c7000b; padding-left: 10px;}}
@media (max-width: 820px) {
  .point_fb_title{position: relative; margin-top: 20px; font-size: 18px; line-height: 30px; color: #231815; border-left: 5px solid #c7000b; padding-left: 10px;}}
@media (max-width: 768px) {
  #point{width: 90%; max-width: 1040px; margin: 80px auto; padding: 20px 25px;}
  #point h2{margin-bottom: 20px; font-size: 24px; font-weight: bold; color: #231815;}
  .point_fb{display: block; text-align: center;}
  .point_fb-inner{margin: 30px auto 60px; width: 380px;}
  .point_fb_title{position: relative; margin-top: 20px; font-size: 20px; line-height: 30px; color: #231815; border-left: 5px solid #c7000b; padding-left: 10px; text-align: left;}}
@media (max-width: 450px) {
  .point_fb-inner{margin: 30px auto 60px; width: 90%;}}

#point.modal_check {display: none;}
#point.modalWrap {opacity: 0; visibility: hidden; transition: 0.4s;}
#point.modal{width:90%; max-width: 1040px; margin:30px auto 90px;}
#point label{cursor: pointer; display: block;cursor: pointer;width: 100% ;margin-bottom: 25px;}
.point_fb-inner .modal_img{margin: 0;}
.point_fb-inner:hover > .modal_img{transform: scale(1.02);transition-duration: 0.3s;}
.point_fb-inner:hover > .point_fb_title{opacity: .5;transition-duration: 0.3s;}
#modal13:checked ~ .modal_contents #modal13_ctn,
#modal14:checked ~ .modal_contents #modal14_ctn,
#modal15:checked ~ .modal_contents #modal15_ctn{
  opacity: 1; visibility: visible;}
#point .modal_ctn{position: absolute;top: 50%; transform: translateY(-50%);left: 0;right: 0;width: 90%;max-width: 940px;height: auto;max-height: 75%;margin: auto;z-index: 2000;box-sizing: border-box;}
#modal13_ctn .modal_inner,#modal14_ctn .modal_inner,#modal15_ctn .modal_inner{
  box-sizing: border-box; overflow: auto; -webkit-overflow-scrolling: touch; position: relative; height: 100%; padding: 30px 45px;
  cursor: default; background-color: #fff; border: 2px solid #231815; border-radius: 20px;}
#modal13_ctn .modal_inner_img,#modal14_ctn .modal_inner_img{width: 33%;text-align: left;position: relative;}
#modal15_ctn .modal_inner_img{width: 48%;text-align: left;position: relative;}
#point .modal_inner_img p{position:absolute; bottom:5px; right:5px; font-size: 14px;margin-top: 5px; color: #fff; text-shadow: 0px 0px 3px #000;}
@media (max-width: 768px) {
  #point.modal{width:90%; max-width: 1040px; margin:30px auto 60px;}
  #point.modal label{display: block;cursor: pointer;width: 100% ;margin-bottom: 25px;}
  #point .modal_ctn{position: absolute;top: 50%; transform: translateY(-50%);left: 0;right: 0;width: 90%;max-width: 940px;height: auto;max-height: 75%;margin: auto;z-index: 2000;box-sizing: border-box;}
  #modal13_ctn .flex,#modal14_ctn .flex,#modal15_ctn .flex{width: 100%;text-align: center; gap:10px;}
  #modal13_ctn .modal_inner,#modal14_ctn .modal_inner,#modal15_ctn .modal_inner{
    box-sizing: border-box; overflow: auto; -webkit-overflow-scrolling: touch; position: relative; height: 100%; padding: 10px 15px;
   cursor: default; background-color: #fff; border: 2px solid #231815; border-radius: 20px;}
  #modal13_ctn .modal_inner_img,#modal14_ctn .modal_inner_img{width: 48%;text-align: left;position: relative;}
  #modal15_ctn .modal_inner_img{width: 60%;text-align: center;position: relative;margin: 0 auto;}
  #point .modal_inner_img p{position:absolute; bottom:5px; right:5px; font-size: 14px;margin-top: 5px; color: #fff; text-shadow: 0px 0px 3px #000;}}
@media (max-width: 450px) {
  #modal13_ctn .modal_inner,#modal14_ctn .modal_inner,#modal15_ctn .modal_inner{
  border-radius: 10px;}
  .modal_inner_ctn h3{font-size: 18px;}
  .modal_inner_ctn .point_lead{margin: 10px auto; font-size: 14px;}
  #modal13_ctn .close,#modal14_ctn .close,#modal15_ctn .close{
    top:-8px; right:8px;}}
.heritage::after{content: ""; display: inline-block; position: absolute; top:3px; right: 3px; width: 70px; height: 32px; background-image: url("./images/icon_heritage.png"); background-size: contain; background-repeat: no-repeat;}
@media (max-width: 450px) {.heritage::after{content: ""; display: inline-block; position: absolute; top:3px; right: 3px; width: 50px; height: 32px; background-image: url("./images/icon_heritage.png"); background-size: contain; background-repeat: no-repeat;}}



/***メイン-マップ***/
section#map{width: 100%; margin: 120px auto; padding: 0px; background: url(./images/main_bg2.png) no-repeat bottom right; background-size: cover;}
#map_pc{width: 90%; max-width: 1040px; margin:0 auto; padding: 50px 25px; text-align: center !important;}
#map_pc img{max-width: 1040px; margin:0 auto;}
.map_pc_box{position: relative; display: inline-block; width: 100%; max-width: 800px;}
.map_pc_box img.map{width: 100%; height: auto; border-radius: 8px; display: block;}
#map_sp{display: none;}
@media (min-width: 1500px) {
  section#map{width: 100%; margin: 120px auto; padding: 0px; background: url(./images/main_bg.png) no-repeat bottom right; background-size: cover;}}
@media (max-width: 768px) {
  section#map{width: 100%; margin: 80px auto; padding: 0px; background: url(./images/main_bg2.png) no-repeat bottom right; background-size: cover;}
  #map_pc{width: 90%; max-width: 1040px; margin:0 auto; padding: 50px 25px; text-align: center !important;}
  #map_pc img{max-width: 1040px; margin:0 auto;}
  .map_pc_box{position: relative; display: inline-block; width: 100%; max-width: 800px;}
  .map_pc_box img.map{width: 100%; height: auto; border-radius: 8px; display: block;}}
/* スライド */
.info-slideB{display: none;}
.info-text{text-align: left; margin-top: 8px;}
.info-text h3{margin: 0 0 5px 0; color: #005d8c; font-size: 18px;}
.info-text p{font-size: 14px;}
.info-text p span{font-size: 12px;}
@media (min-width: 1500px) {
.info-slideB{display: block;}
  .info-slideB{position: absolute; bottom: 50px; right: 0; width: 41%; text-align: center; background: rgba(255,255,255,0.85); border-radius: 8px; padding: 10px; box-shadow: 0 2px 10px rgba(0,0,0,0.2); z-index: 5;}
  .info-slideB img{width: 100%; margin: 0 auto 10px; height: auto; border-radius: 8px; object-fit: cover;}
  #slideB1{top: -10px; bottom:auto; left: 180px;}
  #slideB2{top: 220px; bottom:auto; left: -180px;}
  #slideB3{top: 10px; bottom:auto; right: -220px;}}
  @media (max-width: 1499px) {
.info-slideB{display: block;}
  .info-slideB{position: absolute; bottom: 50px; right: 0; width: 41%; text-align: center; background: rgba(255,255,255,0.85); border-radius: 8px; padding: 10px; box-shadow: 0 2px 10px rgba(0,0,0,0.2); z-index: 5;}
  .info-slideB img{width: 80%; margin: 0 auto 10px; height: auto; border-radius: 8px; object-fit: cover;}
  #slideB1{top: -10px; bottom:auto; left: 180px;}
  #slideB2{top: 220px; bottom:auto; left: -190px;}
  #slideB3{top: 10px; bottom:auto; right: -220px;}}
  @media (max-width: 1300px) {
.info-slideB{display: block;}
  .info-slideB{position: absolute; bottom: 50px; right: 0; width: 35%; text-align: center; background: rgba(255,255,255,0.85); border-radius: 8px; padding: 10px; box-shadow: 0 2px 10px rgba(0,0,0,0.2); z-index: 5;}
  .info-slideB img{width: 80%; margin: 0 auto 10px; height: auto; border-radius: 8px; object-fit: cover;}
  #slideB1{top: -10px; bottom:auto; left: 180px;}
  #slideB2{top: 220px; bottom:auto; left: -120px;}
  #slideB3{top: 90px; bottom:auto; right: -140px;}}
  @media (max-width: 1080px) {
.info-slideB{display: none; z-index: 0 !important;}}
@media (max-width: 825px) {
  .info-text h3 { margin: 0 0 0; font-weight: bold; font-size: 16px;}}
@media (max-width: 768px) {
  .info-slideB{display: none !important;}
  .info-text h3{margin: 0 0 0; color: #005d8c; font-size: 16px;}}
@media (max-width: 480px) {
  #map{width: 100%; max-width: 1040px; margin:0 auto; padding: 50px 5px; text-align: center !important;}
  #map_pc{display: none;}
  .info-slideB { z-index:0 !important; }
  #map_sp { display: block; text-align: center; padding: 20px 5px;}
  .map_sp_box a img { width: 100%; max-width: 400px; margin: 10px auto;padding: 20px 0 0; cursor: pointer; }#map_sp .map_sp_box img.map_sp_open { width: 100%; max-width: 400px; cursor: pointer;}}

.lightbox {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.85);
  z-index: 9999;
  justify-content: center;
  align-items: center;}
.zoom-container {
  width: 90%;
  height: 90%;
  overflow: hidden;
  touch-action: none;
  display: flex;
  justify-content: center;
  align-items: center;}
.zoom-container img {
  max-width: none;
  height: auto;
  transform-origin: 0 0;
  touch-action: none;}
.map_sp_close {
  position: absolute;
  top: 20px;
  right: 20px;
  font-size: 2rem;
  color: #fff;
  cursor: pointer;
  z-index: 10000;}
  
/***VIEW POINT***/
#viewpoint{width: 90%; max-width: 1040px; margin: 120px auto; padding: 50px 25px;}
#viewpoint h2{margin-bottom: 20px; font-size: 28px; font-weight: bold; color: #231815; border-left: 5px solid #c7000b; padding-left: 10px;}
.point_lead{margin: 20px auto;}
.gallery{list-style: none; display: flex; flex-wrap: wrap; gap: 20px;}
.gallery li{width: calc(50% - 10px);}
.vp_gallery p{padding: 1px 5px; background-color: #005d8c; color: #fff;}
@media (max-width: 850px) {
  .gallery{list-style: none; display: flex; flex-wrap: wrap; gap: 10px;}
  .gallery li{width: calc(50% - 5px);}
  .vp_gallery p{padding: 1px 5px; background-color: #005d8c; color: #fff; font-size: 14px;}}
@media (max-width: 768px) {
  #viewpoint{width: 90%; max-width: 1040px; margin: 80px auto; padding: 20px 25px;}
  #viewpoint h2{margin-bottom: 20px; font-size: 24px; font-weight: bold; color: #231815;}
  .point_lead{margin: 20px auto;}
  .gallery{list-style: none; display: block; text-align: center;}
  .gallery li{width: 100%; margin: 20px auto;}
  .vp_gallery p{padding: 1px 5px; background-color: #005d8c; color: #fff; text-align: left; font-size: 14px;}}

/***寄港地***/
section#destination{
  width: 100%;
  margin: 120px auto;
  padding: 40px 0 0;
  background: url(./images/cl_background.png) no-repeat center;
  background-size: cover;}
.destination_inner{
  width: 90%;
  max-width: 1040px;
  margin:0 auto;
  padding: 25px 25px;
  text-align: left;}
.point_title{
  text-align: left;
  font-size: 28px;
  padding-left: 20px;
  border-left: solid 5px #b03a3e;}
.point_lead{
  margin: 20px auto;}

@media (max-width: 768px){
section#destination{
  width: 100%;
  margin: 80px auto;
  padding: 30px 0 0;
  background: url(./images/cl_background.png) no-repeat center;
  background-size: cover;}
.destination_inner{
  width: 90%;
  max-width: 1040px;
  margin:0 auto;
  padding: 30px 10px;}
.point_title{
  font-size: 24px;
  padding-left: 10px;
  border-left: solid 5px #b03a3e;}
.point_lead{
  margin: 20px auto;}}
@media (max-width: 350px){
.point_title{
  font-size: 20px;
  padding-left: 15px;
  border-left: solid 5px #b03a3e;}}

/******/
.destination_inner .modal_flex{
  display: flex;
  flex-wrap:wrap;
  gap:10px;}
.modal_flex label{
  cursor: pointer;
  width:calc(33.3% - 10px);
  overflow: hidden;
  height: 100%;}
.name{
  padding: 5px 8px;
  text-align: left;
  color:#005d8c;
  background-color:rgba(255,255,255,0.9);}
@media (max-width: 620px){
  .destination_inner .modal_flex{
    display: flex;
    flex-wrap:wrap;
    gap:10px;}
  .modal_flex label{
    width:calc(50% - 10px);
    overflow: hidden;
    height: 100%;}
  .name{
    padding: 0px 5px;
    text-align: left;
    color:#005d8c;
    background-color:rgba(255,255,255,0.9);}
  .name p{font-size: 14px;}}

.modal_check {display: none;}
.ajust{width:100%}
.modal{width:90%; max-width: 1040px; margin:30px auto 90px; }
.modal label{display: block;cursor: pointer;width: 100% ;margin-bottom: 25px;}
.to_modal_box{width: 100%; height:0;padding-top: 64.5%; background: #fff; overflow: hidden;position: relative;}
.to_modal_box .caption{position: absolute; bottom:5px; right: 3px;font-size: 12px; color: #fff;}
.to_modal_inner{width: 100%;height: 0%;color:#fff;}
.modal_img{margin-top: -65%;transition-duration: 0.3s; }
.to_modal_box:hover > .modal_img{transform: scale(1.1);transition-duration: 0.3s;}
@media (max-width: 768px){
  .to_modal_box{width: 100%; height:0;padding-top: 64.5%; background: #fff; overflow: hidden;}
  .to_modal_inner{position:relative;width: 100%;height: 0%;color:#fff;}}
@media (max-width: 620px){
  section#destination .headline p{width: 90%;text-align: center; font-size: 16px; font-weight: normal; margin: 25px auto;}
  .explain{background: #edfafc;max-width:760px;width: 90%;margin: 40px auto 20px;padding: 5px;font-size: 12px;}
  .modal_flex{display: flex; flex-wrap:wrap; gap:10px;}
  .modal_flex label{width:calc(50% - 10px); overflow: hidden;}}

.modalWrap{position: fixed;top: 0;left: 0;width: 100%;height: 100%;margin: 0;z-index: 10;}
.modalWrap{opacity: 0;visibility: hidden;transition: 0.5s;-webkit-transition-property: opacity;transition-property: opacity;will-change: opacity;}
.modal_ctn{position: absolute;top: 50%; transform: translateY(-50%);left: 0;right: 0;width: 90%;max-width: 940px;height: auto;max-height: 75%;margin: auto;z-index: 2000;box-sizing: border-box;}
#modal01_ctn .modal_inner,#modal02_ctn .modal_inner,#modal03_ctn .modal_inner,#modal04_ctn .modal_inner,#modal05_ctn .modal_inner,#modal06_ctn .modal_inner,
#modal07_ctn .modal_inner,#modal08_ctn .modal_inner,#modal09_ctn .modal_inner,#modal10_ctn .modal_inner,#modal11_ctn .modal_inner,#modal12_ctn .modal_inner{
  box-sizing: border-box; overflow: auto; -webkit-overflow-scrolling: touch; position: relative; height: 100%; padding: 30px 45px;
  cursor: default; background-color: #fff; border: 5px solid #005d8c; border-radius: 20px;}
.modal_ttl{display: flex;justify-content: left;}
.modal_ttl h3{font-weight: bold;font-size: 28px; color: #005d8c;}
.modal_inner_img{width: 52%;text-align: left;position: relative;}
.modal_inner_img p{position:absolute; bottom:5px; right:5px; font-size: 14px;margin-top: 5px; color: #fff; text-shadow: 0px 0px 3px #000;}
.modal_inner_img .icon_gray{font-size: 12px; margin-left: 3px; padding: 3px 5px; background-color: #898989; color: #fff;}
.modal_inner_txt{width: 44%;text-align: left;}
.modal_inner_txt table{margin-top: 10px;margin-bottom: 10px;}
.modal_icon td{padding-right: 10px;}
.modal_icon td img{height: 20px; width: auto;}
.modal_bus td{padding-right: 10px;}
.modal_bus td img{height: 20px; width: auto;}
@media(max-width:768px){
  .modal_ctn {top: 50%; transform: translateY(-50%); max-height: 76%;height: 76%;}
  #modal01_ctn .modal_inner,#modal02_ctn .modal_inner,#modal03_ctn .modal_inner,#modal04_ctn .modal_inner,#modal05_ctn .modal_inner,#modal06_ctn .modal_inner,
  #modal07_ctn .modal_inner,#modal08_ctn .modal_inner,#modal09_ctn .modal_inner,#modal10_ctn .modal_inner,#modal11_ctn .modal_inner,#modal12_ctn .modal_inner{
    padding: 30px; border-radius: 13px;height: 100%;}
  .modal_ttl{display: flex;justify-content: left;}
  .modal_ttl h3{font-weight: bold; font-size: 26px; line-height: 30px;}
  .modal_ttl h3 span{font-size: 20px; margin-bottom: 10px;}
  .modal_ttl p{font-size: 16px;line-height: 2.1;margin-left: 8px;margin-bottom: 0px;}
  .modal_detail{margin-top: 20px;}
  .modal_inner_img{width: 100%;}
  .modal_inner_img p{font-size: 12px;margin-top: 3px;}
  .modal_inner_txt{width: 100%;text-align: left;margin-top: 20px;}
  .modal_inner_txt table{margin-top: 10px;}
  table{font-size: 14px;}
  table.kanko{margin-top: 20px;}
  table.isan th{width: 5em; font-weight: bold;}
  table.jfk th{font-weight: bold;padding: 4px 0 2px 6px;width: 7em;}
  table.jfk td{font-weight: bold;padding: 4px 0 2px;}
  .new_icon{position:absolute;width: 65px;top:5px;right:5px;}}
  @media(max-width:450px){
    .modal_ctn {top: 55%; transform: translateY(-50%); max-height: 86%;height: 86%;}
    #modal01_ctn .modal_inner,#modal02_ctn .modal_inner,#modal03_ctn .modal_inner,#modal04_ctn .modal_inner,#modal05_ctn .modal_inner,#modal06_ctn .modal_inner,
    #modal07_ctn .modal_inner,#modal08_ctn .modal_inner,#modal09_ctn .modal_inner,#modal10_ctn .modal_inner,#modal11_ctn .modal_inner,#modal12_ctn .modal_inner{
      padding: 50px 18px 18px; border-radius: 12px;height: auto;}
    .modal_ttl{display: block;}
    .modal_ttl h3{font-weight: bold; font-size: 22px; line-height: 15px;}
    .modal_ttl h3 span{font-size: 15px; margin-bottom: 0px; display: inline-block;}
    .modal_ttl p{font-size: 16px;line-height: 1.4;margin-left: 8px;margin-bottom: 0px;}
    .modal_detail{margin-top: 5px;}
    .modal_inner_img{width: 100%;}
    .modal_inner_img p{font-size: 12px;margin-top: 3px;}
    .modal_inner_txt{width: 100%;text-align: left;margin-top: 12px;}
    .modal_inner_txt table{margin-top: 10px;}
    table{font-size: 14px;}
    table.kanko{margin-top: 12px;}
    table.isan{margin-top: 5px;}
    table.isan th{width: 5em; font-weight: bold;}
    table.jfk th{font-weight: bold;padding: 4px 0 2px 6px;width: 7em;}
    table.jfk td{font-weight: bold;padding: 4px 0 2px;}
    .new_icon{position:absolute;width: 65px;top:5px;right:5px;}}

.modal_check:not(:checked) ~ .modal_contents > *:not(.modalWrap) {-webkit-filter: blur(0px);filter: blur(0px);}
.modal_check:not(:checked) ~ .modal_contents .modalWrap {opacity: 0;visibility: hidden;}
.modal_check:checked ~ .modal_contents > *:not(.modalWrap) {-webkit-filter: blur(3px);filter: blur(3px);}
#modal01:checked ~ .modal_contents #modal01_ctn,
#modal02:checked ~ .modal_contents #modal02_ctn,
#modal03:checked ~ .modal_contents #modal03_ctn,
#modal04:checked ~ .modal_contents #modal04_ctn,
#modal05:checked ~ .modal_contents #modal05_ctn,
#modal06:checked ~ .modal_contents #modal06_ctn,
#modal07:checked ~ .modal_contents #modal07_ctn,
#modal08:checked ~ .modal_contents #modal08_ctn,
#modal09:checked ~ .modal_contents #modal09_ctn,
#modal10:checked ~ .modal_contents #modal10_ctn,
#modal11:checked ~ .modal_contents #modal11_ctn,
#modal12:checked ~ .modal_contents #modal12_ctn{opacity: 1;visibility: visible;}
.modalBg {position: fixed;top: 0;left: 0;width: 100%;height: 100%;cursor: pointer; background: rgba( 0, 0, 0, .75);z-index:100;}
.modalBg label {position: absolute;top: 0;left: 0;right: 0;bottom: 0;display: block;}
.close {position: absolute;top: 5px;right: 20px;}
.close label {display: inline-block;padding: 0;color: #c9c9c9;font-size: 2.5em;cursor: pointer;}
.prev {position: absolute;top: 50%;left:0;margin-left: -70px;margin-top: -24px;}
.prev label {display: inline-block;padding: 0;color: #fff;font-size: 48px;cursor: pointer;}
.prev label:hover {color:#c9a059;transition: .3s}
.next {position: absolute;top: 50%;right:0;margin-right: -70px;margin-top: -24px;}
.next label {display: inline-block;padding: 0;color: #fff;font-size: 48px;cursor: pointer;}
.next label:hover {color:#c9a059;transition: .3s}
.prev_sp {display: none;}
.next_sp {display: none;}
.invisible{visibility:hidden;}
@media(max-width:768px){
  .close{right: 20px;}
  .prev {display: none;}
  .next {display: none;}
  .sp_cont{width: 90%;margin:30px auto 20px;}
  .prev_sp {display: inline-block;}
  .prev_sp label {display: inline-block;padding: 0;color: #231815;font-size: 14px;cursor: pointer;}
  .next_sp {display: inline-block;}
  .next_sp label {display: inline-block;padding: 0;color: #231815;font-size: 14px;cursor: pointer;}
  .prev_sp label:hover,.next_sp label:hover {color:#c9a059;transition: .3s}}
@media(max-width:450px){
  .sp_cont{width: 90%;margin:15px auto 0px;}}

.destination_att{margin-top:20px;}

.cl_wave{
  position:relative;
  height:100px;}
canvas{
  position: absolute;
  bottom: 0;
  left:0;
  width: 100%;}

.cl_destination{
  padding: 40px 0;
  background-color: rgba( 0, 150, 244, .45);}
.cl_destination_inner{
  width: 90%;
  max-width: 1040px;
  margin:0 auto;
  padding: 25px 25px;
  border:double 4px rgba(255,255,255,.7);
  background-color: rgba(255,255,255,.5)}
.destination_lead{margin: 20px 0;} 
.cl_destination_flex{
  display: flex;
  margin-bottom: 20px;
  gap: 20px;
  text-align: center;}
.cl_destination_flex .inner01,
.cl_destination_flex .inner02,
.cl_destination_flex .inner03{
  width: 33%;}
.cl_title{
  margin: 10px 0;
  font-size: 18px;
  text-align: left;}
.cl_destination_flex .cl_caption{
  position: relative;}
.cl_destination_flex .cl_caption p{
  position: absolute;
  padding: 5px;
  bottom: 0px;
  right: 0;
  z-index: 10;
  color: #fff;}
.a3e{
  background-color: #005d8c;
  margin-right: 5px;
  padding: 3px 5px;
  font-size: 14px;
  color: #fff;}
.cl_text{
  text-align: left;}

@media (max-width: 768px) {
  .cl_destination_flex{display: block;}
  .cl_destination_flex .inner01,.cl_destination_flex .inner02,.cl_destination_flex .inner03{
    margin: 20px 0; width: 100%;}}

.br-sp02{display: none;}
@media (max-width: 450px) {
  .br-sp02{display: block;}}

/**クルーズライフ***/
#cruiselife{width: 90%; max-width: 1040px; margin: 120px auto; padding: 50px 25px;}
.cruiselife_laed{
  margin: 0px calc(50% - 50vw) 40px; padding: 20px calc(50vw - 50%) 30px;
  background-image: url(./images/cl_titlebg.png);background-repeat: no-repeat;background-size: cover;}
#cruiselife h2{margin-bottom: 20px; font-size: 32px; font-weight: bold; color: #231815; line-height: 1.2;text-shadow: 0px 0px 10px rgba(255, 255, 255, 1);}
#cruiselife h2 span{font-size: 25px; font-weight: normal;}
.cruiselife_laed p{text-shadow: 0px 0px 2px rgba(255, 255, 255, 1);}
.cruiselife_box{margin: 40px auto;}
.cruiselife_box_text{margin: 20px 0;}
.cl_flexbox{display: flex; gap: 20px;}
.cl_special_flexbox{display: flex; gap: 0px;}
.cl_special_flexbox div{width: 50%;}
.cl_special_flexboxB{display: block; width: 80%; margin:0 auto;}
#cruiselife .caption{font-size: 14px;}

@media (max-width: 768px) {
#cruiselife{width: 90%; max-width: 1040px; margin:80px auto; padding: 50px 25px;}
.cruiselife_laed{
  margin: 0px calc(50% - 50vw) 30px;
  padding: 20px calc(50vw - 50%) 30px;
  background-color: #005d8c;}
#cruiselife h2{margin-bottom: 20px; font-size: 28px; font-weight: bold; color: #231815; line-height: 1.2;}
#cruiselife h2 span{font-size: 20px; font-weight: normal;}
.cruiselife_box{margin: 30px auto;}
.cruiselife_box_text{margin: 20px 0;}
.cl_flexbox{display: block; margin: 20px auto 40px;}
.cl_special_flexbox{display: block; margin: 20px auto;}
.cl_special_flexbox div{width: 100%;}
.cl_flexbox,.cl_special_flexboxB{display: block; width: 100%;}
.cl_flexbox div,.cl_special_flexbox div{margin: 20px auto;}}

.cl_special{margin: 30px auto; padding: 30px; border: double 3px #f29500; background-image: url(./images/special_bg.png);background-repeat: no-repeat;background-size: cover;}
.cl_special h4{margin: 0px auto 20px; text-align: center; font-size: 24px;}
.cl_special_flexbox{text-align: center;}
.cl_special_flexbox img{width: 100%; margin: 0 auto;}
.cl_name{margin: 10px 0 15px; padding: 0 16px; text-align: center; font-size: 20px;}
.cl_profile{text-align: left; padding: 0 16px;}

.cl_splayout{
  display: grid;
  grid-template-columns: 2fr 4fr 4fr; /* 横幅を2:4:4に指定 */
  grid-auto-rows: auto;
  gap: 16px;
  align-items: start;}
.box3{grid-row: span 2;}
.box4{grid-column: 1 / span 2;}
.cl_splayout_box img{width: 100%; height: auto; object-fit: cover; display: block;}
@media (max-width: 768px) {
  .cl_splayout{grid-template-columns: 1fr;}
  .cl_splayout_box{width: 90%; margin: auto; height: auto;}
  .box3{grid-row: span 1;}
  .box4{grid-column: 1;}
  .cl_splayout_box img{width: 100%;height: auto;}}
@media (max-width: 450px) {
  .cl_name{font-size: 18px;}}

/***会員特典***/
section#macprice{
  width:100%;
  margin:120px 0;
  background-color: #feecd2;}
.macprice_inner{
  width: 90%;
  max-width: 1040px;
  margin:0 auto;
  padding: 45px 25px;}
.macprice_inner .lead_point{
  width: 100%;
  margin: 20px auto 40px;
  text-align: center;}
.macprice_inner .lead_point p{
  font-size: 20px;}
.special_area{
  margin: 20px auto 30px;
  border: solid 1px #c7000b;
  background-color: #fff;
  box-shadow:6px 6px #f29500;}
.special_area_inner{
  padding: 0px 30px 20px;}
.special_area h3{
  margin-bottom: 30px;
  padding: 5px 30px;
  font-size: 28px;
  color: #fff;
  background-color: #c7000b;}
.special_area h3 span{
  font-size: 20px;}
.special_area h4{
  font-size: 24px;
  margin: 20px 0 5px;
  color: #c7000b;
  font-weight: bold;}
.special_area_inner p{
  font-size: 18px;}
.special_att_area{
  padding: 0px 30px 30px;}

@media (max-width: 768px){
section#macprice{
  width: 100%;
  margin: 80px auto;}
.macprice_inner{
  width: 90%;
  max-width: 1040px;
  margin:0 auto;
  padding: 40px 0px;}
.macprice_inner .lead_point{
  width: 100%;
  margin: 20px auto;
  text-align: center;}
.macprice_inner .lead_point p{
  font-size: 20px;}
.special_area{
  margin: 20px auto 30px;
  border: solid 1px #c7000b;
  background-color: #fff;
  box-shadow:6px 6px #f29500;}
.special_area_inner{
  padding: 0px 20px 15px;}
.special_area h3{
  padding: 5px 15px 5px 15px;
  font-size: 24px;
  color: #fff;
  background-color: #c7000b;}
.special_area h3 span{
  font-size: 18px;}
.special_area h4{
  font-size: 20px;
  margin: 15px 0 5px;
  color: #c7000b;
  font-weight: bold;}
.special_area_inner p{
  font-size: 16px;}
.special_att_area{
  padding: 0px 30px 30px;}}
@media (max-width: 400px){
.special_area_inner{
  padding: 0px 20px 20px;}
.special_area h3{
  padding: 5px 15px 5px 15px;
  font-size: 20px;
  color: #fff;
  background-color: #c7000b;}
.special_area h3 span{
  font-size: 16px;}
.special_area h4{
  font-size: 18px;
  margin: 20px 0 5px;
  color: #c7000b;
  font-weight: bold;}}

/***料金***/
.macprice_table_area{
  margin: 40px auto 0px;
  padding: 20px;
  border-radius: 5px;
  background-color: #fff;
  text-align: center;}
.macprice_table_area_inner{
  text-align: left;
  margin: 0 auto;}
.macprice_table_area h3{
  width: 100%;
  font-size: 24px;
  color: #c7000b;
  text-align: left;}
.price_text_normal,.price_text_special{
  margin: 10px auto;}
.price_text_normal h4{
  font-size: 18px;}
.price_text_normal span{
  padding-right: 3px;
  font-size: 16px;}
.price_text_normal p span{
  font-size: 22px;}
.price_text_special h4{
  margin-top: 10px;
  color: #005d8b;
  font-size: 18px;}
.price_text_special span{
  padding-right: 3px;
  font-size: 16px;}
.price_text_special p span{
  font-size: 22px;}
@media (max-width: 768px){
.macprice_table_area{
  margin: 40px auto 0px;
  padding: 20px;
  border-radius: 15px;
  background-color: #fff;
  text-align: center;}
.macprice_table_area_inner{
  margin: 0 auto;}
.macprice_table_area h3{
  width: 100%;
  font-size: 20px;
  color: #c7000b;
  text-align: left;}
.macprice_inner .link_btn{
  margin-top: 30px;}}
@media (max-width: 595px){
.macprice_table_area{
  margin: 30px auto 0px;
  padding: 10px;
  border-radius: 10px;
  background-color: #fff;
  text-align: center;}
.macprice_table_area_inner{
  margin: 0 auto;}
.macprice_table_area h3{
  width: 100%;
  font-size: 18px;
  color: #c7000b;
  text-align: left;}
.macprice_inner .link_btn{
  margin-top: 20px;}}
@media (max-width: 370px){
.macprice_inner .link_btn{
  margin-top: 20px;}}

/***MyAsukaClub***/
section#member{width: 90%; max-width: 1040px; margin:120px auto;}
#member .club{background: url(./images/clubBg.png) center no-repeat; background-size: cover; margin-bottom: 5em; padding: 60px 0;}
#member .club_title{margin: 0 auto 1.5em; width: 85%;}
.link_btn_member{margin: 0 auto; max-width: 660px; font-size: 20px; text-align: center;}
.link_btn_member a{display: flex; height: 80px; color: #fff; text-decoration: none; border: solid 1px #fff; justify-content: center; align-items: center; position: relative;}
.link_btn_member a:hover{opacity: .8;}

@media (max-width: 768px){
  section#member{margin:90px auto;}
  .link_btn_member{margin: 0 auto; max-width: 300px; font-size: 18px; text-align: center;}
  .link_btn_member a{display: flex; height: 50px; color: #fff; text-decoration: none; border: solid 1px #fff; justify-content: center; align-items: center; position: relative;}}

/***問い合わせ関連***/
section#link{width: 90%; max-width: 1040px; margin:60px auto;}
.link_btn{margin:90px 0 0; position: relative;}
.link_box{position: relative; width: calc(100% / 2 - 30px); height: 0; padding-bottom: 40.5%; overflow: hidden; border:solid 1px #333; background: #333;}
.link_img{transition-duration: 0.3s; opacity: 0.7; width: 100%;}
.link_box:hover > .link_img{transition-duration: 0.3s; opacity: 0.3; width: 100%;}
.link_txt{position: absolute; z-index: 5; width: 100%; text-align: center; color: #fff; padding: 25px; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%);}
.link_txt h3{font-family: 'Crimson Text', serif; font-size: 36px; letter-spacing: 0.1rem;}
.link_txt p{font-weight :bold; font-size: 20px; line-height: 25px;}
.detail_btn{width: 100%; border-top: 1px solid #fff; padding: 8px 0; margin: 0 auto; position: absolute; bottom: 0; left: 0; color: #fff; font-weight: bold; z-index: 10; text-align: center;}
.link_btn a{margin: 0 auto ; position: relative; overflow: hidden; text-align: center; width: 50%; border: solid 1px #333; color: #333; padding: 15px 0; font-size: 18px; display: block; margin-bottom: 25px; transition: ease .2s;}
.link_btn .flex a{width: 49%;}
.link_btn a::before{content: ""; position: absolute; width: 8px; height: 0; background: #ab951d; left: 0; top: 0; transition: ease .5s;}
.link_btn a:hover::before{height: 100%;}
.link_btn .span{position: relative; z-index: 3; color: #333;}
.link_btn a div{position: absolute; font-size: 28px; font-weight: bold; top: 7px; right: 25px; transition: .2s;}
.link_btn a:hover div{right: 20px; transition: .2s;}

section#tel{width:100%; padding:60px 0;}
.tel_area{width: 90%; max-width: 1040px; margin:0 auto; text-align: center;}
.tel_area h3{font-size: 20px; position: relative;}
.tel_area h3:after{content: ""; display: block; width: 400px; height: 1px; background-color: #231815; position: absolute; bottom: -3px; left: 50%; margin-left: -205px;}
.tel_for{font-size: 26px; font-weight: bold; margin-top: 20px;}
.tel_num{font-size: 52px; font-weight: bold; margin-top: 10px; margin-bottom: 10px;}
.tel_num a{color:#231815;}
.tel_num span{margin-right: 20px; color: #fff; font-size: 1.2rem; line-height: 1.2; display: inline-block; padding: 0.6rem; vertical-align: 0.6rem; letter-spacing: 0; border-radius: 20px; background: #005d8c; margin-left: 20px;}
@media(max-width:1060px){
  .link_btn{margin:30px 0 30px;}
  .link_btn a{width: 60%;}
  .link_txt h3{font-size: 32px; line-height: 34px; margin-bottom: 5px;}
  .link_txt p{font-size: 16px;}}
@media(max-width:870px){
  .link_btn a{width: 70%;}}
@media (max-width: 768px){
  section#link{width:100%; margin:40px 0;}
  section#tel{width:100%; padding:60px 0;}
  .link_box{position: relative; width: 90%; height: 0; padding-bottom: 75.5%; margin:0 auto 20px;}
  .link_txt{position:absolute; z-index: 5; width: 100%; height: 100%; text-align: center; color: #fff; padding: 80px 0 0;}
  .link_txt h3{font-size: 28px; line-height: 55px;}
  .link_txt p{font-size: 18px; line-height: 24px;}
  .detail_btn{width: 100%; padding: 10px 0; bottom:0; font-size: 16px;}
  .link_btn a{width: 91%; padding: 15px 0; font-size: 14px; margin-bottom: 20px;}
  .link_btn .flex a{width: 91%;}
  .link_btn a div{display: none;}
  .link_btn a:hover div{right: 20px; transition: .2s;}
  .tel_area{text-align: center;}
  .tel_area h3{font-size: 16px; position: relative;}
  .tel_area h3:after{width: 90%; height: 1px; bottom: -10px; left: 5%; margin-left: 0}
  .tel_for{font-size: 16px; font-weight: bold; margin-top: 25px;}
  .tel_num{font-size: 29px; font-weight: bold; margin-top: 10px; margin-bottom: 10px; letter-spacing: 0.05rem;}
  .tel_num a{color:#231815;}
  .tel_num span{margin-right: 0px; font-size: 1rem; margin-left:0px;}}
@media (max-width: 380px){
  .link_txt{position:absolute; z-index: 5; width: 100%; height: 100%; text-align: center; color: #fff; padding: 45px 0 0;}
  .link_txt h3{font-size: 28px; line-height: 40px;}
  .link_txt p{font-size: 16px; line-height: 24px;}}

/***フッター***/
footer{padding: 60px 20px 40px; background: #005d8c; width: 100%; text-align: center; color: #fff;}
footer p{font-size: 15px; margin: 10px auto;}
footer a{font-size:15px;color:#fff;}
footer .att{font-size: 14px;}
.footer_link{margin-top: 20px;}
.footer_link a{font-weight: bold;}
#copyright{margin-top: 30px; font-size: 14px; letter-spacing: 0.02rem;}
@media (max-width: 768px) {
  #footer_front p{font-size: 12px;}
  footer{padding: 40px 20px 60px;}
  footer p{font-size: 12px; width: 90%; margin: 0 auto;}
  footer a{font-size:13px; width: 90%; margin: 0 auto;}
  .footer_link{margin-top: 20px;}
  .footer_link a{font-weight: bold;}
  #copyright{margin-top: 30px; font-size: 12px; letter-spacing: 0.02rem;}}

.snsBtnBox{margin: 25px auto;}
.snsBtnBox p{margin-bottom: 15px;}
.snsBtnBox a{padding: 0 15px;transition:0.6s;}
.snsBtnBox a:hover{opacity: 0.45;}
.snsBtnBox a i{font-size: 2.2rem;}
@media (max-width: 768px){
  .snsBtnBox a{padding: 0 8px; transition:0.6s;}
  .snsBtnBox a{font-size: 2rem;}}

/***フェードアップ***/
.fadeUpTrigger {opacity: 0; transform: translateY(40px); transition: 0.6s ease-out;}
.fadeUp {opacity: 1;transform: translateY(0);}x
.fadeLeftTrigger {opacity: 0; transform: translateX(-50px); transition: 0.6s ease-out;}
.fadeLeft {opacity: 1; transform: translateX(0);}
.fadeRightTrigger {opacity: 0; transform: translateX(50px); transition: 0.6s ease-out;}
.fadeRight {opacity: 1; transform: translateX(0);}

.delay1{transition-delay: 0s;}
.delay2{transition-delay: 0.3s;}
.delay3{transition-delay: 0.6s;}
.delay4{transition-delay: 0.9s;}
@media (max-width: 768px){
  .delay2{transition-delay: 0.0s;}
  .delay3{transition-delay: 0.0s;}
  .delay4{transition-delay: 0.0s;}}