/* Your custom styles */
html,
body,
.view.jarallax {

}
header{
height: 100%;
min-height: auto;
}
.headernotop header{

}

/* 必須マーク */
.must{
	color: #fff;
	margin-right: 10px;
	padding: 6px 5px;
	background: #fda085;
	border-radius: 20px;
  font-size:0.7em;
  font-weight:bold;
}

/* 任意マーク */
.free {
	color: #fff;
	margin-right: 10px;
	padding: 6px 10px;
	background: #424242;
	border-radius: 20px;
}

/* 項目名を太字にする */
form p {
	font-weight:600;
}

/* 入力項目を見やすくする */
input.wpcf7-form-control.wpcf7-text,
textarea.wpcf7-form-control.wpcf7-textarea,
select,
input[type=date] {
	width: 100%;
	padding: 8px 15px;
	margin-right: 10px;
	margin-top: 10px;
	border: 1px solid #d0d5d8;
	border-radius: 3px;
}
textarea.wpcf7-form-control.wpcf7-textarea {
	height: 200px;
}

/* 必須項目の入力欄を黄色にする */
input.wpcf7-form-control.wpcf7-text.wpcf7-validates-as-required {
	background: rgba(255, 255, 142, 0.46);
}

/* 送信ボタンを見やすくする */
input.wpcf7-submit {
	width: 40%;
	height: 60px;
	background: linear-gradient(40deg,#45cafc, #303f9f) !important;
	color: #fff;
	font-size: 20px;
	font-weight: 600;
  border:none;
  border-radius: 10em;
  box-shadow: 0 2px 5px 0 rgb(0 0 0 / 16%), 0 2px 10px 0 rgb(0 0 0 / 12%);
}

/* エラーメッセージを見やすくする */
span.wpcf7-not-valid-tip,
.wpcf7-response-output.wpcf7-validation-errors {
	color: red;
	font-weight: 600;
}

.media-body{
	padding-left: 10px;
}
.contenteye img{
    height: auto;
    width: 100%!important;
    margin-bottom: 1rem;
}
h1{
    font-size: 2rem;
}
h2{
    font-size: 1.8rem;
    text-align: center;
}
h3{
    font-size: 1.5rem;
    font-weight:bold;
}
h4{
    font-size: 1.3rem;
}
@media (max-width: 767.98px) {
  h1 {
  font-size: 1.6rem;
  }
}
@media (max-width: 767px) {
  h2 {
  font-size: 1.4rem;
  }
}
@media (max-width: 767px) {
  h3 {
  font-size: 1.2rem;
  }
}
@media (max-width: 767px) {
  h4 {
  font-size: 1.1rem;
  }
}
.streak{
  font-size:1.2rem;
}
@media (max-width: 767px) {
  .streak{
  font-size: 1rem;
  }
}

/* topフロー装飾 */
      .timeline {
        position: relative;
        list-style: none;
        padding: 1rem 0;
        margin: 0;
      }

      .timeline::before {
        content: '';
        position: absolute;
        left: 50%;
        top: 0;
        bottom: 0;
        width: 2px;
        margin-left: -1px;
        background-color: #50a1ff;
      }

      .timeline-element {
        position: relative;
        width: 50%;
        padding: 1rem 0;
        padding-right: 2.5rem;
        text-align: right;
      }

      .timeline-element::before {
        content: '';
        position: absolute;
        right: -8px;
        top: 1.35rem;
        display: inline-block;
        width: 16px;
        height: 16px;
        border-radius: 50%;
        border: 2px solid #50a1ff;
        background-color: #fff;
      }

      .timeline-element:nth-child(even)::before {
        right: auto;
        left: -8px;
      }

      .timeline-element:nth-child(even) {
        margin-left: 50%;
        padding-left: 2.5rem;
        padding-right: 0;
        text-align: left;
      }

      @media (max-width: 767.98px) {
        .timeline::before {
          left: 8px;
        }
      }

      @media (max-width: 767.98px) {
        .timeline-element {
          width: 100%;
          text-align: left;
          padding-left: 2.5rem;
          padding-right: 0;
        }
      }

      @media (max-width: 767.98px) {
        .timeline-element::before {
          top: 1.25rem;
          left: 1px;
        }
      }

      @media (max-width: 767.98px) {
        .timeline-element:nth-child(even) {
          margin-left: 0rem;
        }
      }

      @media (max-width: 767.98px) {
        .timeline-element {
          width: 100%;
          text-align: left;
          padding-left: 2.5rem;
          padding-right: 0;
        }
      }

      @media (max-width: 767.98px) {
        .timeline-element:nth-child(even)::before {
          left: 1px;
        }
      }

      @media (max-width: 767.98px) {
        .timeline-element::before {
          top: 1.25rem;
        }
      }
/* lp-set */
.lp-top{
  background: radial-gradient(transparent, rgba(255,255,255,0.5)) fixed, url(https://cocovo.jp/wp-content/themes/bsco/img/lp/dsc7261-w.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  padding:20px 10px;
  color: #fff;
  font-weight: bold;
  font-size:1.7rem;
  text-shadow    :
       1px  1px 2px #000,
      -1px  1px 2px #000,
       1px -1px 2px #000,
      -1px -1px 2px #000,
       1px  0px 2px #000,
       0px  1px 2px #000,
      -1px  0px 2px #000,
       0px -1px 2px #000;
}
@media (max-width: 767.98px) {
	.lp-top{
	  background: radial-gradient(transparent, rgba(255,255,255,0.5)) fixed, url(https://cocovo.jp/wp-content/themes/bsco/img/lp/dsc7261.jpg);
	  font-weight:normal;
	  font-size:1rem;
	  background-size: cover;
	  background-position: center;
	}
}
/* lp-trouble */
.lp-trouble{
  background: radial-gradient(transparent, rgba(0,0,0,0.5)) fixed, url(https://cocovo.jp/wp-content/themes/bsco/img/lp/dsc7632.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  padding:20px 10px;
  color: #fff;
  font-weight: bold;
  font-size:1.7rem;
  text-shadow    :
       1px  1px 2px #000,
      -1px  1px 2px #000,
       1px -1px 2px #000,
      -1px -1px 2px #000,
       1px  0px 2px #000,
       0px  1px 2px #000,
      -1px  0px 2px #000,
       0px -1px 2px #000;
}
@media (max-width: 767.98px) {
	.lp-trouble{
	  background: radial-gradient(transparent, rgba(0,0,0,0.5)) fixed, url(https://cocovo.jp/wp-content/themes/bsco/img/lp/dsc7632.jpg);
	  font-weight:normal;
	  font-size:1rem;
	  background-size: cover;
	  background-position: center;
	}
}
/* lp-with */
.lp-with{
  background: radial-gradient(transparent, rgba(0,0,0,0.5)) fixed, url(https://cocovo.jp/wp-content/themes/bsco/img/lp/dsc6965.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  padding:20px 10px;
  color: #fff;
  font-weight: bold;
  font-size:1.5rem;
  text-shadow    :
       1px  1px 2px #000,
      -1px  1px 2px #000,
       1px -1px 2px #000,
      -1px -1px 2px #000,
       1px  0px 2px #000,
       0px  1px 2px #000,
      -1px  0px 2px #000,
       0px -1px 2px #000;
}
@media (max-width: 767.98px) {
	.lp-with{
	  background: radial-gradient(transparent, rgba(0,0,0,0.5)) fixed, url(https://cocovo.jp/wp-content/themes/bsco/img/lp/dsc6965.jpg);
	  font-weight:normal;
	  font-size:1rem;
	  background-size: cover;
	  background-position: center;
	}
}
/* lp-etc */
.lp-top-text{
  padding-top:400px;
}
@media (max-width: 767.98px) {
	.lp-top-text{
	  padding-top:100px;
	}
}
.lp-trouble-text{
  padding-top:0;
}
@media (max-width: 767.98px) {
	.lp-trouble-text{
	  padding-top:0;
	}
}
.lp-with-text{
  padding-top:0;
}
@media (max-width: 767.98px) {
	.lp-with-text{
	  padding-top:0;
	}
}
.point-orange {
  font-size:1.7rem;
  color: #ffbb33;
  font-weight: bold;
}
.point-orange-black {
  font-size:1.7rem;
  color: #ffbb33;
  font-weight: bold;
  background: #000;
  padding:5px;
  text-shadow: none;
}
@media (max-width: 767.98px) {
	.point-orange-black {
	  font-weight:normal;
	  font-size:1.2rem;
	  padding:3px;
	}
}
.h1-img{
	vertical-align:bottom;
}
@media (max-width: 767.98px) {
	.h1-img{
		max-width: 50px;
	}
}
.lp-img{
	vertical-align:bottom;
	max-width: 600px;
}
@media (max-width: 767.98px) {
	.lp-img{
		max-width: 300px;
	}
}
.textsmall{
	font-size:0.7rem;
	color:#555;
    word-wrap: break-word;
}
.text-orange {
  color: #ffbb33;
  font-size:1.6em;
}
.text-large1 {
  font-size:1.4em;
}
.webfont1{
font-family: 'Kaushan Script', cursive;
line-height: 1.5;
}
.lp-plantable{
  padding:10px 100px;
  text-align:center;
}
@media (max-width: 767.98px) {
  .lp-plantable{
  padding:10px;
  }
}
main .container {
    padding:10px 15px;
  }
.mainsingle img{
  max-width: 100%;
  height: auto;
}
.mainsingle h2{
  color:#333333;
  padding:15px;
  font-size:1.8rem;
  background:#f5f5f5;
  margin-top: 20px;
  margin-bottom: 20px;
  font-weight: bold;
}
@media (max-width: 767.98px) {
  .mainsingle h2{
  font-size:1.4rem;
  margin-top: 10px;
  margin-bottom: 10px;
  }
}
.mainsingle h3{
  color:#333333;
  padding:10px;
  font-size:1.6rem;
  border-bottom: solid #f5f5f5 7px;
  font-weight: bold;
}
@media (max-width: 767.98px) {
  .mainsingle h3{
  font-size:1.2rem;
  }
}
.mainsingle p{
  font-size:1.1rem;
}
@media (max-width: 767.98px) {
    .mainsingle p{
      font-size:1rem;
    }
}
.pricing-card .price .version{
  border-radius:0;
  box-shadow: none;
}
.imgtoplogo{
  max-width: 180px;
  height: auto;
  margin: 0 auto;
}
@media (max-width: 767.98px) {
  .imgtoplogo{
    max-width: 100px;
    height: auto;
  }
}
.gmap {
height: 0;
overflow: hidden;
padding-bottom: 56.25%;
position: relative;
}
.gmap iframe {
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
}
.copyrightbg{
  background-color:#F8F6F5;
  margin:1em auto;
}
.copyrightbg a{
  color: #23242a;
}

.wrapcontent{
  padding: 0;
}

/*------------------------------------
  Go To
------------------------------------*/
.go-to {
  display: -ms-inline-flexbox;
  display: inline-flex;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  -ms-flex-pack: center;
      justify-content: center;
  -ms-flex-align: center;
      align-items: center;
  z-index: 9999;
  width: 3.5rem;
  height: 3.5rem;
  background-color: rgba(235,242,255,0.8);
  color: #677788;
  font-size: 0.8125rem;
  opacity: 0.5;
  border-radius: 50%;
  transition: 0.3s ease-out;
}

.go-to:hover, .go-to:focus:hover {
  color: #fff;
  background-color: #377dff;
  opacity: 0.4;
}

/*------------------------------------
  File for your custom SCSS style
------------------------------------*/
.opacity90{
  opacity: 0.9;
}
/* bottom */

#flyin {
z-index:100;
border-radius:10px 0 0;
width: 330px;
position:fixed;
bottom:20px;
right:110px;
padding:0.5em;
transition: 0.3s ease-in-out;
background:linear-gradient(40deg, #45cafc, #303f9f);
}
@media (max-width: 768px) {
  #flyin {
  width: 250px;
  bottom:10px;
  }
  #flyin p,#flyin a{
  font-size:80%;
  margin-bottom: 0;
  }
  #flyin .btn{
  padding:0.3em;
  }
}

#flyin .flyinclose {
-webkit-transition:0 .5s ease .2s,opacity .5s ease,top .5s ease .2s;
transition:transform .5s ease .2s,opacity .5s ease,top .5s ease .2s;
content:'';
display:block;
z-index:2;
box-shadow:0 0 10px rgba(0,0,0,.2);
cursor:pointer;
width:30px;
height:30px;
border-radius:30px;
background:#fff url(../img/header/icon_close.png) no-repeat center center;
background-size: 100% 100%;
position:absolute;
top:-10px;
left:-5px;
margin:0;
padding:0;
}

.hide {
opacity:0;
-webkit-transition:opacity 1s ease;
transition:opacity 1s ease;
}

.hide div {
top:60%!important;
-webkit-transition:top 1s ease;
transition:top 1s ease;
}

.target.is-hidden {
  padding-top: 0;
  padding-bottom: 0;
  line-height: 0;
  pointer-events: none;
  display:none;
}

div#flyin:hover {
    transform: translateY(-5px);
    transition: all .5s;
}
.blogctabtn {
  border-radius:10px;
  padding:0.5em;
  background:linear-gradient(40deg, #45cafc, #303f9f);
}
.set3{
  margin-bottom: 1em;
}
.btn-light {
    display: inline-block;
    font-weight: 600;
    text-align: center;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-color: #f7faff;
    border-color: #f7faff;
    padding: 0.75rem 1rem;
    font-size: 1rem;
    line-height: 1.6;
    border-radius: 0.3125rem;
    transition: all 0.2s ease-in-out;
}
.footer-copyright{
  padding-top:1em;
  padding-bottom:120px;
}

.badge {
  padding: 0.5em 0.7em!important;
  font-size: 100%!important;
}
.font120 {
  font-size: 120%;
}

/*-- PC版表示CSS  --*/
.pc_area{
  display:block;
}
.phone_area{
  display:none;
}
/*-- スマホ版表示CSS  --*/
@media screen and (max-width: 768px){
  .pc_area{
    display:none;
  }
  .phone_area{
    display:block;
  }
}
.card-img-top{
  width: 100%;
  height: 150px;
  object-fit: cover;
}
.keymain{
  position: absolute;
  bottom: 50px;
  right: 60px;
}
@media screen and (min-width: 576px){
  .jarallax {
    height: 650px;
  }
}
@media screen and (min-width: 768px){
  .jarallax {
    height: 480px;
  }
}
@media screen and (min-width: 992px){
  .jarallax {
    height: 620px;
  }
}
@media screen and (min-width: 1200px){
  .jarallax {
    height: 700px;
  }
}
@media screen and (min-width: 992px){
  .keymain .btn{
    font-size: 1.2rem;
  }
}
@media screen and (min-width: 1200px){
  .keymain .btn{
    font-size: 1.2rem;
  }
}
.pricing-card .striped li{
  padding-top: 0.3rem;
  padding-bottom: 0.3rem;
  margin-bottom: 0;
}
@media screen and (min-width: 1200px){
  .containerentry {
      max-width: 900px;
  }
}
@media screen and (min-width: 992px){
  .containerentry {
      max-width: 900px;
  }
}
.containerentry img{
  border-radius: 10px;
}
.topimg{
  padding-top:47px;
  padding-bottom: 1rem;
}
.topimgbtn{
  background: #23242a;
  padding-bottom: 1rem;
}
.topimgbtn a{
  font-size: 1.2rem;
}

/*-- 法人LP  --*/
strong {
  background: -moz-linear-gradient(top, transparent 65%, #faddd4 65%);
  background: -webkit-linear-gradient(top, transparent 65%, #faddd4 65%);
  background: linear-gradient(to bottom, transparent 65%, #faddd4 65%);
}
footer strong{
  background: none;
}
.wrapcontent .blueline {
  background: -moz-linear-gradient(top, transparent 65%, #99cbf4 65%);
  background: -webkit-linear-gradient(top, transparent 65%, #99cbf4 65%);
  background: linear-gradient(to bottom, transparent 65%, #99cbf4 65%);
}
.businesslp  h2{
  margin-top: 2rem;
  margin-bottom: 2rem;
  font-weight: bold;
  letter-spacing: 0.2rem;
}
.businesslp  h3{
  color: #2196f3;
}
.businesslp {
  font-size: 1.2rem;
}
.imgmap{
  max-width: 50%;
}
@media (max-width: 767.98px) {
  .imgmap{
    max-width: 90%;
  }
}
/**iscle.com/web-it/wp/page-navi.html**/
.pagenavi{
  color: #2583ad;
  margin: 1rem auto;
  line-height:2em;
  text-align:center;
  clear: both;
}
.pagenavi a{
  text-decoration:none;
}
.pagenavi a.page-numbers, .pagenavi .current{
  color: #2196F3;
  padding: 0.4rem 1rem;
  border:solid 1px #ccc;
  text-decoration:none;
  font-size:1.2rem;
  border-radius: 5px;
}
.pagenavi a.page-numbers:hover{
  color:#fff;
  background: #2196F3;
}
.pagenavi .current{
  color: white;
  background: #2196F3;
  border-color: #2196F3;
  font-weight:bold:
}
.pagenavi .next, .pagenavi .prev{
  border:0 none;
  background:transparent;
  text-decoration:none;
  font-size:1.2rem;
  font-weight:bold;
}
.fontsize2{
  font-size: 1.2rem;
}
.fontsize20{
  font-size: 2rem;
}
.onlinecalendar .table th:first-child{
  position: sticky;
  left: 0;
  background-color: rgba(255, 255, 255, 0.5);
}
.table-responsive {
  display: block;
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.table-responsive > .table-bordered {
  border: 0;
}
.onlinelead{
  position: sticky;
  left: 0;
  background-color: rgba(255, 255, 255, 0.5);
}
.onlinecalendar p,
.onlinecalendar,
.onlinecalendar th,
.onlinecalendar td{
  font-size: 1rem;
  padding: 0;
  margin: 0;
}
@media (width <= 768px) {
  .onlinecalendar p,
  .onlinecalendar,
  .onlinecalendar th,
  .onlinecalendar td{
      font-size: 0.7rem;
    }
  }
.onlinecalendar td{
  padding: 0;
  margin: 0;
}
.onlinecalendar table.table td{
  padding: 0;
  margin: 0;
}
.hrmargintop2{
  padding: 2rem 0;
}
/* swiper */
.swiper-container {
  position: relative;
  overflow: hidden;
}
.swiper-container.visible {
  overflow: visible;
}
.sample-swiper-cards {
  padding: 0 50px;
}
/* swiper common */
.wrapper {
  max-width: 100%;
  max-width: 960px;
  margin: 0 auto;
  overflow-x: hidden;
}
@media (width <= 768px) {
  .wrapper {
    padding: 0;
  }
}

button {
  border: 0;
  padding: 0;
  background-color: transparent;
}

.carousel-wrapper {
  position: relative;
}
.carousel {
  margin-top: 5em;
  margin-bottom: 3em;
  max-width: 100%;
}
@media (max-width: 768px) {
  .carousel {
    margin-top: 3.4em;
    margin-bottom: 0;
    max-width: 100%;
  }
}
.item {
  display: flex;
  align-items: center;
  max-width: 100%;
  justify-content: center;
  text-align: center;
  color: #fff;
  font-size: 32px;
  font-weight: bold;
}
.swiper-wrapper img{
  max-width: 100%;
}
/* balloon1 */
.balloon1 {
  position: relative;
  padding: 7px 10px;
  max-width: 90%;
  color: #000;
  font-size: 16px;
  background: #faddd4;
  border-radius: 8px;
  font-weight: bold;
}

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

.balloon1 p {
  margin: 0;
  padding: 0;
}
.balloon2 {
  position: relative;
  padding: 7px 10px;
  max-width: 90%;
  color: #000;
  font-size: 16px;
  background: #dee2e6;
  border-radius: 8px;
  font-weight: bold;
}

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

.balloon2 p {
  margin: 0;
  padding: 0;
}

.priceplan th,
.priceplan td
{
 width: 320px; 
}
.new_icon:before{
  position: absolute;
  content: "人気!";
  top:15px;
  left: 0px;
  background:#fda085;
  border-radius: 50%;
  color: #fff;
  padding: 20px 15px;
  z-index: 1;
  }
.new_icon2:before{
  position: absolute;
  content: "6/30迄";
  top:15px;
  right: 0px;
  background:#2196f3;
  border-radius: 50%;
  color: #fff;
  padding: 20px 15px;
  z-index: 1;
  font-size: 80%;
  }
.new_icon3:before{
  position: absolute;
  content: "先着5名";
  top:15px;
  right: 0px;
  background:#2196f3;
  border-radius: 50%;
  color: #fff;
  padding: 20px 15px;
  z-index: 1;
  font-size: 80%;
  }
/* top swiper */
  .swiper-button-next, .swiper-button-prev {
    color: #FC6C42;
}
.swiper-pagination-bullet-active {
  background: #FC6C42;
}
.swiper-pagination-bullet {
  width: var(--swiper-pagination-bullet-width, var(--swiper-pagination-bullet-size, 30px));
  height: var(--swiper-pagination-bullet-height, var(--swiper-pagination-bullet-size, 30px));
}
:root {
    --swiper-navigation-size: 80px;
}
/* scheduleseat*/
.scheduleseat iframe {
  width:100%;
  height:520px;
  border: none;
}
@media (width <= 768px) {
  .scheduleseat iframe {
    height:520px;
    border: none;
  }
}
.scheduleseat2 iframe {
  width:100%;
  height:570px;
  border: none;
}
@media (width <= 768px) {
  .scheduleseat2 iframe {
    height:570px;
    border: none;
  }
}
.fontpink{
  color: #fda085;
}
.fontblue{
  color: #007bff;
}