*{
    box-sizing: border-box;
}

/* common */
body{
    width: 100%;
    margin: auto;
}

a{
    text-decoration: none;
    color: #ffffff;
}

ul{
    margin: 0;
    padding: 0;
}

li{
    list-style: none;
}

img{
    width: 90%;
    margin: 2% 5%;
}

a img{
    box-shadow: 0px 5px 10px #383c3f;
    margin: 3% 5%;
}

a img:active{
    transform: translateY(5px);
    box-shadow: none;
}

.img{
    width: 30%;
    margin: 3% 35%;
}

.img1{
    width: 50%;
    margin: 5% 25%;
}

h1, h2, h3, h4, p{
    margin: 0;
}


.data{
    color: #ffffff;
    font-size: 1.3rem;
    text-shadow: 3px 3px #000b14;
    text-align: center;
    font-weight: 900;
    background-color: #0023426c;
}


.bg-tsuna h1{
    color: #ffffff;
    font-size: 1.7rem;
    text-shadow: 2px 2px #000b14;
    text-align: center;
    font-weight: 900;
}

iframe{
    margin: 5%;
    width: 90%;
    height: 215px;
}

.bold{
    font-weight: 900;
    font-size: 1.8rem;
}

.right{
    display: inline-block;
    float: right;
    margin-top: 5%;
    width: 50%;
}

.left{
    display: inline-block;
    width: 50%;
    margin-top: 3%;
}


.overflow{
    overflow: hidden;
}

/* font-color */
.red{
    color: #ff0000;
}

.white{
    color: #ffffff;
    text-shadow: 2px 2px 3px #000b14;
}

.blue{
    color: #0071b9;
}

.darkblue{
    color: #003f7a;
}

.wihte{
    color: #ffffff;
}

.center{
    text-align: center;
    padding: 3%;
}

/* bg-image,bg-color */
.bg-tsuna{
    background-image: url("../images/bg-tsuna.png");
    background-repeat: no-repeat;
    background-size: cover;
    margin: auto;
    width: 100%;
    padding: 20px 0px 20px 0px;
}

.bg-tsuna2{
    background-image: url("../images/bg-tsuna2.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    margin: auto;
    width: 100%;
}

.bg-tsuna2 p:nth-child(1), .bg-tsuna2 p:nth-child(4), .bg-tsuna2 p:nth-child(10){
    color: #ffffff;
    font-size: 1.2rem;
    font-weight: 900;
    text-shadow: 2px 2px 3px #000b14;
}

.bg-tsuna2 p:nth-child(2){
    color: #ffffff;
    font-size: 1.6rem;
    font-weight: 900;
    margin: 3% auto auto auto;
    text-shadow: 2px 2px 3px #000b14;
}

.bg-tsuna2 p:nth-child(5), .bg-tsuna2 p:nth-child(7), .bg-tsuna2 p:nth-child(9){
    background-color: #003f7a;
    border: 2px solid #ffffff;
    border-radius: 8px;
    font-size: 1.6rem;
    font-weight: 900;
    color: #ffffff;
    margin: 2% 10%;
    width: 80%;
}

.bg-tsuna2 .fa-plus{
    color: #ffffff;
    text-shadow: 2px 2px 3px #000b14;
}

.bg-grid{
    background-image: url("../images/bg-grid.png");
    /* background-size: cover; */
    background-repeat: repeat;
    margin: auto;
    width: 100%;
    padding-top: 5%;
    padding-bottom: 5%;
}


.bg-darkblue-img{
    background-image: url("../images/bg-darkblue-img.png");
    background-repeat: no-repeat;
    background-size: cover;
    margin: auto;
    width: 100%;
    color: #ffffff;
}

.bg-slush-light{
    background-image: url("../images/bg-slush-light.png");
    /* background-repeat: no-repeat; */
    background-size: cover;
    margin: auto;
    width: 100%;
    padding-bottom: 6%;
}

.bg-slush-dark{
    background-image: url("../images/bg-slush-dark.png");
    /* background-repeat: no-repeat; */
    background-size: cover;
    margin: auto;
    width: 100%;
    padding-top: 4%;
    padding-bottom: 6%;
}

.bg-slush-dark .center{
    font-size: 1.8rem;
    line-height: 2rem;
    color: #0071b9;
}

.bg-dots{
    background-image: url("../images/bg-dots.png");
    background-size: cover;
    margin: auto;
    width: 100%;
    padding: 10% 0;;
}

.bg-book{
    background-image: url("../images/bg-book.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    margin: auto;
    width: 100%;
    padding-bottom: 2%;
}

.bg-book p{
    font-size: 1.3rem;
    font-weight: 900;
    text-align: center;
    color: #ffffff;
    text-shadow: 2px 2px 3px #000b14;
    padding-top: 4%;
    padding-bottom: 1%;
}


.bg-border{
    background-image: url("../images/bg-border.png");
    background-repeat: repeat;
    margin: auto;
    width: 100%;
    padding: 5%
}

.bg-card{
    background-image: url("../images/bg-card.png");
    background-repeat: no-repeat;
    background-size: cover;
    margin: 5% auto auto auto;
    width: 90%;
    padding: 3% 5%;
    box-shadow: 1px 3px 6px#000b14
}

.bg-card p{
    padding: 0.5% 4%;

}

.bg-grad{
    background-image: url("../images/bg-grad.png");
    background-repeat: no-repeat;
    background-size: cover;
    margin: 5% auto 0 auto;;
    width: 90%;
    text-align: center;
    color: #ffffff;
    font-size: 1.2rem;
    font-weight: 900;
    padding: 3% 0;
    border-right: 2px solid #ffffff;
}

.bg-side{
    background-image: url("../images/bg-side.png");
    background-repeat: no-repeat;
    background-size: cover;
    margin: 3% 2% 5% 2%;
    width: 96%;
}

.bg-side p{
    color: #ffffff;
    text-align: center;
    font-size: 1.3rem;
    font-weight: 900;
}

.bg-side-blue{
    background-image: url("../images/bg-side-blue.png");
    background-repeat: no-repeat;
    background-size: cover;
    margin: 5% 2%;
    width: 96%;
}



.bg-side-blue p:not(:nth-child(2)){
    color: #003f7a;
    text-align: center;
    font-size: 1.3rem;
    font-weight: 900;
}

.bg-side-blue p:nth-child(2){
    color: #003f7a;
    text-align: center;
    font-size: 2rem;
    font-weight: 900;
    line-height: 2.35rem;
}

.bg-side-lightblue{
    background-image: url("../images/bg-side-lightblue.png");
    background-repeat: no-repeat;
    background-size: cover;
    margin: 5% 2%;
    width: 96%;
}

.bg-blue{
    background-color: #0071b9;
    padding-top: 7%;
    padding-bottom: 12%;
}

.bg-blue h2{
    text-align: center;
    color: white;
}


.bg-darkblue{
    background-color: #003f7a;
    padding-bottom: 1%;
}


.bg-lightblue{
    padding: 0.5em 1em;
    margin: 1em 0;
    background: #eaf3f8;
    border-left: solid 25px #b6def3;
    box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.33);
}

.bg-lightblue p{
    margin: 0;
    padding: 0;
}

.bg-lightblue h2{
    text-align: center;
    padding: 3% auto;
    font-weight: normal;
}


/* cont,wrap */
.cont{
    padding-top: 5%;
    padding-bottom: 5%;
}

.cont h2{
    text-align: center;
    font-size: 1.8rem;
}

.border{
    border-bottom: 3px solid #ffffff;
    width: 20%;
    margin: auto;
}

.cont p{
    width: 90%;
    margin: 3% auto 0 auto;
}


.cont-white{
    margin: 5%;
    padding: 5%;
    background-color: #ffffff;
}

.cont-white h3{
    font-size: 1.1rem;
    border-bottom: 1.2px solid #000b14;
}

.cont-white h3::before{
    content: "■";
}

.cont-white p, .cont-white ul{
    margin: 3% auto;
}

.wrap{
    margin-bottom: 5%;
    padding: auto;
}

.wrap-96{
    margin: auto;
    width: 96%;
}

.wrap-90{
    margin: auto;
    width: 90%;
    padding-top: 5%;
}


.wrap-90 p{
    margin: 5% auto;
}

.wrap-border{
    background-image: url("../images/bg-border.png");
    background-repeat: no-repeat;
    background-size: cover;
    margin: 5% auto;
    width: 90%;
    box-shadow: 1px 2px 3px #000b14;
}

.wrap-border h2{
    text-align: center;
    color: #dd0000;
    font-weight: 900;
    font-size: 1.2rem;
    padding-top: 10px;
    padding-bottom: 10px;
}

.wrap-border ul{
    width: 90%;
    margin: auto;
    padding: 0;
    font-weight: 600;
}

.wrap-border li::before{
    content:"・"
}

.wrap-darkblue{
    background-color: #003f7a;
    color: #ffffff;
    text-align: center;
    margin:  0 auto;
    width: 90%;
    padding-bottom: 5%;
}

.wrap-darkblue p:not(.rsv-btn):not(:first-child):not(:nth-child(2n+3)){
    font-size: 1.8rem;
    font-weight: 900;
    color: #003f7a;
    background-color: #ffffff;
    width: 90%;
    margin: 6px auto;
    border-radius: 8px;
}

.wrap-darkblue p:first-child{
    font-size: 2.2rem;
    font-weight: 900;
    padding-top: 4%;
}

.wrap-darkblue p:nth-child(7){
    font-size: 1.4rem;
    font-weight: 600;
    padding-top: 3%;
}

.wrap-lightblue{
    border: 3px solid #003f7a;
    border-radius: 8px;
    background-color: #f0f6fa;
    margin: 5%;
}

.wrap-blue{
    background-color: #0071b9;
    color: #ffffff;
    text-align: center;
    margin:  0 auto;
    width: 100%;
    padding-bottom: 5%;
    padding-top: 5%;
}

.wrap-white{
    border: 3px solid #0071b9;
    /* border-radius: 8px; */
    background-color: #ffffff;
    margin: 5%;
}

.wrap-white .wrap-blue img{
    margin: 0 auto;
}

.wrap-lightblue .wrap-darkblue, .wrap-white .wrap-darkblue{
    margin: 0;
    padding: 4% 0;
    width: 100%;
    font-size: 1.3rem;
    font-weight: 900;
}

.wrap-lightblue .wrap-darkblue span, .wrap-white .wrap-darkblue span{
    font-size: 1.8rem;
    line-height: 2.3rem;
    padding: 0;
}

.wrap-lightblue p:not(.wrap-darkblue), .wrap-white p:not(.wrap-darkblue){
    margin: 5% auto;
    width: 90%;
}

.wrap-red{
    margin:  0 auto;
    width: 90%;
    padding: 3%;
    color: #ffffff;
    text-align: center;
    background-color: #ff0000;
    font-size: 1.9rem;
    font-weight: 900;
    line-height: 2.2rem;
}

.wrap-grid{
    background-image: url("../images/bg-grid.png");
    width: 90%;
    margin: auto;
    padding-bottom: 5%;
    text-align: center;
}

.wrap-grid p:first-child{
    font-size: 1.1rem;
    font-weight: 900;
    padding: 5% 0 3% 0;
}

.wrap-grid p:nth-child(2){
    font-size: 1.4rem;
    color: #003f7a;
    font-weight: 900;
}

.wrap-grid p:nth-child(4){
    font-size: 1.2rem;
    font-weight: 900;
}

.wrap-grid p:last-child{
    font-size: 1.4rem;
    font-weight: 900;
}

.wrap-step p{
    font-size: 1.4rem;
    color: #ffffff;
    text-align: center;
    font-weight: 900;
    padding-top: 9%;
    line-height: 1.8rem;
}

.wrap-grad{
    background: linear-gradient(90deg, #e20027, #003f7a);
    color: #ffffff;
    text-align: center;
    padding: 8% 3%;
    font-size: 1.3rem;
    font-weight: 900;
}

.wrap-grad-border{
    border: 2px solid linear-gradient(90deg, #e20027, #003f7a);
    width: 80%;
    margin : auto;
}


.wrap-grad-border {
    border-left:3px solid #e20027;
    border-right:3px solid #003f7a;
    }

    .wrap-grad-border:before,
    .wrap-grad-border:after {
    content:"";
    display:block;
    height:3px;
        background:-webkit-gradient(linear, left top, right bottom, from(#e20027), to(#003f7a));
        background:-moz-linear-gradient(left, #e20027, #003f7a);
        background:linear-gradient(left, #e20027, #003f7a);
    }

.wrap-grad-border h4{
    margin: 3% 5%;
}

.wrap-grad-border h4::before{
    content: "●";
}

.wrap-rsv p:not(.bg-lightblue){
    width: 90%;
    margin: 3% auto;
}

/* accessory */
.rsv-btn {
    background-color: #e50027;
    color: #ffffff;
    margin : 2% auto 8% auto !important;
    width: 90%;
    font-size: 5.4vw;
    font-weight: 900;
    border-radius: 3px;
    box-shadow: 0px 4px #000b14;
    text-align: center;
    padding-top: 4%;
    padding-bottom: 4%;
}

.rsv-btn:active{
    transform: translateY(4px);
    box-shadow: none;
}

.rsv-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0px 5px #000b14;
}



.bg-darkblue p{
    text-align: center;
    font-size: 1.1rem;
    color: #ffffff;
    font-weight: 900;
    padding-top: 5%;
}


.call-btn{
    background-color: #00ad4b;
    color: #ffffff;
    margin: 5% auto 0 auto;
    width: 60%;
    font-size: 1.4rem;
    font-weight: 900;
    border-radius: 3px;
    box-shadow: 0px 4px #000b14;
}

.call-btn:active{
    transform: translateY(4px);
    box-shadow: none;
}


.fa-plus{
    font-size: 1.5rem;
    margin: auto 48%;
}

.fa-caret-down{
    font-size: 5rem;
}


.steps{
    padding: 0;
}

.steps li{
    background-color: #ffffff;
    margin: 3% 5%;
    width: 90%;
    font-weight: 700;
}

.step {
    display: inline-block;
    position: relative;
    height: 60px;
    line-height: 60px;
    vertical-align: middle;
    text-align: center;
    padding: 0 18px 0 10px;/*文字の左右の余白*/
    font-size: 1.1rem;/*文字サイズ*/
    background: #003f7a;/*背景色*/
    color: #FFF;/*文字色*/
    box-sizing: border-box;
}

.step:after {
    position: absolute;
    content: '';
    width: 0px;
    height: 0px;
    z-index: 1;
}

.step:after {
    top: 0;
    right: 0;
    border-width: 30px 15px 30px 0px;
    border-color: transparent #ffffff transparent transparent;
    border-style: solid;
}

.bal-blue {
    position: relative;
    display: inline-block;
    padding: 7px 10px;
   /* min-width: 120px; */
    width: 90%;
    margin: 1.5em 5%;
    color: #ffffff;
    font-size: 16px;
    background: #0071b9;
    text-align: center;
    font-size: 1rem;
    font-weight: 900;
    border-radius: 8px;
}

.bal-blue:before{
   content: "";
   position: absolute;
   top: 100%;
   left: 50%;
    margin-left: -15px;
   border: 15px solid transparent;
   border-top: 15px solid #0071b9;
}

.bal-blue p{
   margin: 0;
   padding: 0;
}

.bal-red {
    position: relative;
    display: inline-block;
    padding: 7px 10px;
   /* min-width: 120px; */
    width: 96%;
    margin: 1.5em 2%;
    color: #ffffff;
    font-size: 16px;
    background: #ff0000;
    text-align: center;
    font-size: 1rem;
    font-weight: 900;
    border-radius: 8px;
}

.bal-red:before{
   content: "";
   position: absolute;
   top: 100%;
   left: 50%;
    margin-left: -15px;
   border: 15px solid transparent;
   border-top: 15px solid #ff0000;
}

.bal-red p{
   margin: 0;
   padding: 0;
}

.textbox{
    width: 80%;
    margin: auto;
    padding-bottom: 8%;
}

.textbox h3{
    margin-top: 5%;
}

.comment{
    text-align: center;
    font-size: 1.1rem;
    font-weight: 900;
}

.info{
    padding: 10% 0;
}

.info p:not(:nth-child(4)){
    color: #ffffff;
    font-size: 1rem;
    text-align: center;
    font-weight: 900;
}

.info p:nth-child(4){
    color: #ffffff;
    font-size: 2.5rem;
    text-align: center;
    font-weight: 900;
    text-shadow: 0px 5px 3px #000b14;
    line-height: 3rem;
    margin: 1.3rem auto;
}

.info2{
    padding-bottom: 5%;
}

.info2 p:not(:nth-child(2)){
    font-size: 1rem;
    text-align: center;
    font-weight: 900;
}

.info2 p:nth-child(2){
    font-size: 2.5rem;
    text-align: center;
    font-weight: 900;
    text-shadow: 0px 5px 3px #000b14;
}

.cont-title{
    border-top: 2px solid #003f7a;
    border-bottom: 2px solid #003f7a;
}


.cont-title h2{
    text-align: center;
    border-bottom: 3px solid #003f7a;
    font-size: 1.3rem;
    width: 10%;
    margin: auto;
    color: #003f7a;
}

.cont-title h3{
    text-align: center;
    font-size: 1.15rem;
    color: #003f7a;
    padding: 3% 0;
}

.cont-title-r{
    border-top: 2px solid #1c334b;
    border-bottom: 2px solid #1c334b;
}


.cont-title-r h2{
    text-align: center;
    border-bottom: 3px solid #1c334b;
    font-size: 1.3rem;
    width: 30%;
    margin: auto;
    color: #000d1a;
}

.cont-title-r h3{
    text-align: center;
    font-size: 1.15rem;
    color: #1c334b;
    padding: 3% 0;
}


.imp{
    text-align: center;
    font-size: 1.4rem;
    font-weight: 900;
    color: #003f7a;
    padding-top: 5%;
}

.reserv-ex{
    font-size: 1.2rem;
    letter-spacing: 0.2;
    text-align: left;
    margin: 0% 5% 0 5%;
  }

  .reserv-form{
    font-size: 1.2rem;
    text-align: left;
    background-color:#d7ebf6;
    padding: 1% 27%;
    margin: 0;
  }

  .reserv-form span{
    font-size: 1.15rem;
    font-weight: bold;
    padding-left: 1.2rem;
  }

  .label{
    display: block;
    text-align: left;
    margin: 0% 0% 0% 8%;
    font-size: 1.2rem;
    padding: 1% 0;
  }

  textarea {
    border:gray solid 2px;
    width: 90%;
    height: 10rem;
    font-size: 1rem;
    padding-top: 1%;
    margin: 3% 5%;
    padding: 1.5% 3%;
  }

  input, select{
    border:gray solid 2px;
    width: 90%;
    font-size: 1rem;
    font-weight: 100;
    padding: 1% 0 1% 2%;
    margin: 3% 5%;
  }

  .input{
    margin-bottom: 0;
  }


  .send {
    background-color:#0074c0;
    margin: 2% 30% 4% 30% !important;
    width: 40% !important;
    padding: 2% 0;
    color:white;
    font-weight: bold;
    font-size:1.6rem;
  }

  .send-form{
    background-color:#0074c0;
    margin: 2% 20% 4% 20% !important;
    width: 60% !important;
    padding: 2% 0;
    color:white;
    font-weight: bold;
    font-size:1.2rem;
  }

  .send-form#back {
      background-color: #e5e5e5;
      color: #333;
  }

.checkplicy{
   border-bottom: 1.5px solid #474545;
   color: #474545;
   font-size:1rem;
  }

  .consent{
    display: block;
    font-size:1rem;
    font-weight: 100;
    margin-top: 0;
    text-align: center;
  }

  .rights{
    font-size: 0.8rem;
    padding-bottom: 2%;
    margin-bottom: 0;
    font-weight: lighter;
  }

  .policy{
    font-size: 0.9em;
  }

  footer, footer{
    background-color: #0074c0;
    color:white;
    text-align: center;
    font-size:1.1rem;
  }

footer{
    padding-bottom: 70px;
}

  footer ul{
    padding-top: 0;
  }

  footer li{
    text-align: center;
    padding: 1% 0;
  }

  #rsv-btn a{
    text-decoration: none;
    text-align: center;
  }


.mobile-menu a {
    text-decoration: none;
    display: block;
    box-sizing: border-box;
}

.footer-hidden {
    position: fixed;
    width: 100%;
    z-index: 1000000;
    background: rgba(175,175,175,0.6);
    height: 80px;
}

/*橋本追加*/

.wrap-90 p.top-catch,p.top-catch {
    margin: 10px auto;
    padding: 0;
    font-size: 5.4vw;
    font-weight: bold;
}