@charset "utf-8";
/* CSS Document */

.w15{width:15% !important}.w20{width:20% !important}.w25{width:25% !important}.w30{width:30% !important}.w35{width:35% !important}.w40{width:40% !important}.w45{width:45% !important}.w50{width:50% !important}.w56{width:56% !important}.w60{width:60% !important}.w65{width:65% !important}.w70{width:70% !important}.w75{width:75% !important}.w80{width:80% !important}.w85{width:85% !important}.w90{width:90% !important}.w95{width:95% !important}.w100{width:100% !important}.w30px{width:30px !important}.w50px{width:50px !important}.w100px{width:100px !important}.w150px{width:150px !important}.w200px{width:200px !important}.w250px{width:250px !important}.w300px{width:300px !important}.w400px{width:400px !important}.w500px{width:500px !important}.w600px{width:600px !important}.w700px{width:700px !important}

.bgBlue1 { background: #79A8D6 !important; }
.bgBlue2 { background: #5490CA !important; }
.bgBlue3 { background: #2572BC !important; }
.bgBlue1:hover{ background: #93B9DE !important;}
.bgBlue2:hover{ background: #76A6D4 !important;}
.bgBlue3:hover{ background: #508EC9 !important;}

.box-Blue1 { background: #79A8D6 !important; padding: 15px; margin-bottom: 10px }
.box-Blue2 { background: #5490CA !important; padding: 15px }
.box-Blue3 { background: #2572BC !important; padding: 15px }

.box-Blue1:hover{ background: #93B9DE !important;}
.box-Blue2:hover{ background: #76A6D4 !important;}
.box-Blue3:hover{ background: #508EC9 !important;}
.colorBlue1 { color: #79A8D6 !important; }
.colorBlue2 { color: #5490CA !important; }
.colorBlue3 { color: #2572BC !important; }

.flexC{ justify-content: center !important; }
/* 矢印が右に移動 */

.bgWhite { background: #fff !important; }
.triangle {
	margin: 0 auto;
  height: calc(tan(60deg) * 30px / 2);
  width: 30px;
  clip-path: polygon(50% 0, 100% 100%, 0 100%);
}
/* 下向き ▼ */
.down {
  clip-path: polygon(0 0, 100% 0, 50% 100%);
}
#bikeplan .pointC a {
  color: #fff !important;
  text-decoration: none !important;
  overflow: hidden !important;
  outline: none !important;
}
#bikeplan .pointC a:visited {
  color: #fff !important;
}
#bikeplan .pointC a:hover {
  color: #fff !important;
  text-decoration: none !important;
}
#bikeplan .point .pointC img {
    width:auto;
    height:auto;
    max-width:100%;
    max-height:100%;
}

/* ボタン共通設定 */
.btn-bike{
	font-size: 90%;
	font-weight: 500;
    /*矢印の基点とするためrelativeを指定*/
	position: relative;
    /*ボタンの形状*/
	text-decoration: none;
	display: inline-block;
	color:#fff;
    padding: 15px 15px 15px 15px;
    text-align: center;
    outline: none;
    /*アニメーションの指定*/
    transition: ease .2s;
}
.btn-syousai{
	font-size: 70%;
	font-weight: 300;
    /*矢印の基点とするためrelativeを指定*/
	position: relative;
    /*ボタンの形状*/
	text-decoration: none;
	display: inline-block;
	color:#fff;
    padding: 8px 15px;
    text-align: center;
    outline: none;
	border-radius: 35px;
    /*アニメーションの指定*/
    transition: ease .2s;
}
.btn-w{ width: 200px!important;
}
.only-pc-r-txt{ text-align: right !important; }
.only-pc-l-txt{ text-align: left !important; }



@media all and (max-width: 750px) {
.btn-w{ width: 150px !important;}
.only-pc-r-txt{ text-align: center!important; }
.only-pc-l-txt{ text-align: center !important; }
	
    }

.btn-orenge{
	background:#F99918;
}
.btn-green{
	background:#35B7AF;
}
.btn-blue{
	background:#0FAEC4;
}
.btn-blue2{
	background:#2572BC;
}
.btn-yellow{
	background:#C2B70E;
}
.btn-red{
	background:#CF7271;
}

.btn-bike a{
	color:#fff !important;}
.btn-syousai a{
	color:#fff;}
.btn-orenge a{
	color:#fff;}
.btn-green a{
	color:#fff;}
.btn-blue a{
	color:#fff;}
.btn-blue2 a{
	color:#fff;}
.btn-yellow a{
	color:#fff;}
.btn-red a{
	color:#fff;}

.btn-bike a:visited{
	color:#fff !important;}
.btn-syousai a:visited{
	color:#fff !important;}
.btn-orenge a:visited{
	color:#fff !important;}
.btn-green a:visited{
	color:#fff !important;}
.btn-blue a:visited{
	color:#fff;}
.btn-blue2 a:visited{
	color:#fff;}

.btn-yellow a:visited{
	color:#fff;}
.btn-red a:visited{
	color:#fff;}


.btn-bike:hover{
	color:#fff !important;}
.btn-syousai:hover{
	color:#fff;}
.btn-orenge:hover{
	color:#fff; opacity: 0.8}
.btn-green:hover{
	color:#fff; opacity: 0.8}
.btn-blue:hover{
	color:#fff; opacity: 0.8}
.btn-blue2:hover{
	color:#fff; opacity: 0.8}
.btn-yellow:hover{
	color:#fff; opacity: 0.8}
.btn-red:hover{
	color:#fff; opacity: 0.8;}

.btn-bike:active{
	color:#fff !important;}
.btn-syousai:active{
	color:#fff;}
.btn-orenge:active{
	color:#fff;}
.btn-green:active{
	color:#fff;}
.btn-blue:active{
	color:#fff;}
.btn-blue2:active{
	color:#fff;}
.btn-yellow:active{
	color:#fff;}
.btn-red:active{
	color:#fff;}



/* 矢印が右に移動 */

.btnarrow1::after{
    content: '';
    /*絶対配置で矢印の位置を決める*/
	position: absolute;
    top:42%;
    right: 22px;
    /*矢印の形状*/
    width: 12px;
    height: 12px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    transform: rotate(45deg);
    /*アニメーションの指定*/
    transition: all .3s;
}

/*hoverした際の移動*/
.btnarrow1:hover::after{
    right: 15px;
}

.btnarrow2::after{
    content: '';
    /*絶対配置で矢印の位置を決める*/
	position: absolute;
    top:32%;
    right: 22px;
    /*矢印の形状*/
    width: 12px;
    height: 12px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    transform: rotate(45deg);
    /*アニメーションの指定*/
    transition: all .3s;
}

/*hoverした際の移動*/
.btnarrow2:hover::after{
    right: 15px;
}

#bikeplan .yoyaku .title { font-size: 160%; margin-bottom: 35px }
#bikeplan .yoyaku .box-yoyaku { background: #FCFBEE; padding: 35px 25px 25px; margin-bottom: 25px }
#bikeplan .yoyaku .box-yoyaku li { width: 50%; margin-bottom: 0px!important; padding-bottom: 0px!important; }
#bikeplan .yoyaku .box-yoyaku .yoyakuR { width: 47% !important;  }
#bikeplan .yoyaku .price { font-size: 160%; color: #E21F1F; font-weight: 700 }
#bikeplan .yoyaku .borderR{ border-right: solid 1px #ccc; padding-right: 20px;margin-right: 20px;  }
#bikeplan .yoyaku .yoyakuBtn { width: 365px!important; }
@media all and (max-width: 750px) {
#bikeplan .yoyaku .box-yoyaku .yoyakuR { width: 100% !important; text-align: center  }
#bikeplan .yoyaku .borderR { border-right:none; border-bottom: solid 1px #ccc; padding-bottom: 15px; margin-bottom: 15px; width: 100%;padding-right: 0px;margin-right: 0px; }
	#bikeplan .faqTxt{ font-size: 100%; font-weight: 700; margin-right: 10px }
#bikeplan .faq dt{ background: #2572BC; color: #fff; padding: 15px;border-radius: 10px 10px 0 0; font-size: 100%; font-weight: 700 }
#bikeplan .faq dd{ background: #fff; padding: 15px;border-radius: 0 0 10px 10px }
#bikeplan .yoyaku .title {
        font-size: 130% !important;
    }
#bikeplan .yoyaku .box-yoyaku li { width: 100%!important; }
#bikeplan .yoyaku .yoyakuBtn { width: 100%!important; }
}

#bikeplan .flex {display: flex!important;}
#bikeplan .faq dl {box-shadow: 0px 1px 5px 2px rgba(90, 90, 90, 0.2);border-radius: 10px; padding: 0 !important;}
#bikeplan .faq dt{ background: #2572BC; color: #fff; padding: 25px;border-radius: 10px 10px 0 0; font-size: 110%; font-weight: 700 }
#bikeplan .faq dd{ background: #fff; padding: 25px;border-radius: 0 0 10px 10px }
#bikeplan .faqTxt{ font-size: 110%; font-weight: 700; margin-right: 15px }

#bikeplan .mar40tb{ margin: 5% 0 !important;}
#bikeplan .point {
	    background: #DFF7F2 !important;
	margin-bottom: 0;
    }
#bikeplan .w70 {
	width: 70% !important;
	margin: 0 auto;
    }

#bikeplan .movieBg {
	padding-top: 8%;
	margin: 7% auto;
	height: 645px;
	background-image:url(../img/movie-arrow_01.png),
					 url(../img/movie-arrow_02.png),
					 url(../img/movie-arrow_03.png),
					 url(../img/movie-arrow_04.png);
	background-repeat:no-repeat,
					  no-repeat,
					  no-repeat,
					  no-repeat;
	background-position:left top,
						right top,
						left bottom,
						right bottom;
   }
@media all and (max-width: 750px) {
#bikeplan .movieBg {
	background-image:none;
	padding-top: 8%;
	height: auto;
   }
}

#bikeplan .movieTitle {
	font-size: 160%!important;
	font-weight: 600;
	color: #03A69B;
	margin-bottom: 20px;
    }

.slanting-line {
    display: flex;
    justify-content: center;
    align-items: center;
}
.slanting-line::before,.slanting-line::after {
    content: "";
    background-color: #707070;
    height: 1px;
    width: 40px;
}
.slanting-line::before {
    margin-right: 5px;
    transform: rotate(45deg); 
}
.slanting-line::after {
    margin-left: 5px;
    transform: rotate(-45deg); 
}

#bikeplan .point .menu-title {
	font-size: 24px!important;
	color: #fff;
	text-align: left;
	padding: 15px 5px 15px 95px;

    }
#bikeplan .point .menu-title2 {
	font-size: 24px!important;
	color: #fff;
	text-align: left;
	padding: 35px 5px 15px 95px;

    }
#bikeplan .point .pointNum-1 {
	 background: url("../img/icon-point01_s.png") no-repeat left center;
    }
#bikeplan .point .pointNum-2 {
	 background: url("../img/icon-point02_s.png") no-repeat left center;
    }
#bikeplan .point .pointNum-3 {
	 background: url("../img/icon-point03_s.png") no-repeat left center;
    }
@media all and (max-width: 750px) {
#bikeplan .point .menu-title {
	font-size: 18px!important;
	color: #fff;
	text-align: left;
	padding: 8px 5px 8px 85px;

    }
#bikeplan .point .menu-title2 {
	font-size: 18px!important;
	color: #fff;
	text-align: left;
	padding: 8px 5px 8px 85px;

    }
#bikeplan .point .pointNum-1 {
	 background: url("../img/icon-point01_s.png") no-repeat left center;
	background-size: 60px ;
    }
#bikeplan .point .pointNum-2 {
	 background: url("../img/icon-point02_s.png") no-repeat left center;
	background-size: 60px;
    }
#bikeplan .point .pointNum-3 {
	 background: url("../img/icon-point03_s.png") no-repeat left center;
	background-size: 60px;
    }

   }
#bikeplan .cp {
	 margin-bottom: 7%
    }

#bikeplan .cpBg2 {
	    background: url("../img/cp-bg.png") no-repeat center center;
	background-size: cover;
	height: 458px;
	padding: 210px 4% 4% 4%
    }
#bikeplan .cpBg3 {
	    background: url("../img/cp-bg2.png?v=240930") no-repeat center center;
	background-size: cover;
	height: 710px;
	padding: 230px 4% 4% 4%
    }
#bikeplan .cpBg1 {
	    background: url("../img/cp-bg.png") no-repeat center center;
	background-size: cover;
	height: 458px;
	padding: 210px 4% 4% 4%
    }

@media all and (max-width: 1024px) {
#bikeplan .cp-banner img {border-radius: 10px;  width: 130px; height: auto
    }
}
@media all and (min-width: 751px) {
#bikeplan .cpBg .tbflex {  display: flex;
  flex-wrap: nowrap;/*flexアイテムを折り返さない*/
    }
}
@media all and (max-width: 750px) {
    #bikeplan .cpBg2 {
	    background: url("../img/cp-bg-sp.png") no-repeat center center;
	background-size: cover;
	height: 530px;
	padding: 160px 4% 4% 4%
    }
    #bikeplan .cpBg3 {
	    background: url("../img/cp-bg-sp2.png?v=240930") no-repeat center center;
	background-size: cover;
	height: 760px;
	padding: 210px 4% 4% 4%
    }
#bikeplan .cpBg1 {
	    background: url("../img/cp-bg.png") no-repeat center center;
	background-size: cover;
	height: 458px;
	padding: 230px 4% 4% 4%
    }


#bikeplan .cp-banner img{ border-radius: 10px;  width: 130px; height: auto; margin: auto auto;
    }
#bikeplan .box-cp{margin-bottom: 20px !important; width: 90% !important;
    }
#bikeplan .box-cp dl { width: 100%!important;
    }

}

#bikeplan .cp-banner{ margin-right: 15px; border-radius: 10px; 
    }
#bikeplan .cp-banner img{ border-radius: 10px;
    }


#bikeplan .box-cp{ display: flex; width: 48%; margin-bottom: 0
    }
#bikeplan .box-cp dl { width: 100%;
    }
#bikeplan .box-cp dl dt{ color: #03A69B;
    }


#bikeplan .faq {
	    background: #CAE1ED !important;
    }
#bikeplan .point2 {
	    padding: 8% 0;
    }
#bikeplan .yoyaku {
	    background: #F2F0F0 !important;
	    padding: 8% 0;
    }
#bikeplan .pointC {
	    margin: 4% auto !important;
    }
#bikeplan .pointC li {
	    padding: 13px;
    }
#bikeplan .h2Wrap {
        height: auto;
        padding: 25px 0 30px 0 !important;
        font-size: 42px !important;
        font-weight: 900;
	    background: #2572BC !important;
	    text-align: center !important;
	    color: #FFF100 !important;
	    letter-spacing: 0.1em

    }
@media all and (max-width: 750px) {
#bikeplan .h2Wrap {
        font-size: 20px !important;
    }
}

#bikeplan ._inner{width:100%;max-width:calc(1200px + 40px);margin:0 auto;padding:0 20px}@media all and (max-width: 1400px){#bikeplan ._inner{width:calc(100% - 40px);padding:0 20px}}@media screen and (max-width: 520px){#bikeplan ._inner{width:calc(100% - 30px);padding:0 15px}}


#bikeplan .whiteBox {
	    background: #fff;
	    padding: 4%;
	    box-shadow: 0px 1px 5px 2px rgba(90, 90, 90, 0.3);
	margin-bottom: 5%;
    }

#bikeplan .number {
	    margin-right: 4%;
    }
#bikeplan .text {
	    margin-bottom: 15px;
    }

#bikeplan .point-title{
        font-size: 37px;
        font-weight: 700;
    }
#bikeplan .border{
        border-bottom: solid 1px #CCC;
	margin: 20px 0 30px 0;
    }

#bikeplan .point2 h2 {
        font-size: 28px;
        font-weight: 900;
	    color: #2572BC ;
	margin-bottom: 15px;
	    letter-spacing: 0.1em;
	padding: 16px 0 16px 88px
    }
#bikeplan .point2Box {
	border-radius: 15px;
	border: solid #afd5e4 5px;
        background:linear-gradient(90deg, rgb(34, 213, 161,12%), rgb(154, 190, 224,30%));
	padding: 4% 4% 0%;
    }
#bikeplan .point2 .pointText {
	font-size: 100% !important;
	margin-bottom: 10px;
	list-style-type: disc;
	margin-left: 15px;
    }

@media all and (max-width: 750px) {
#bikeplan .number {
	    margin-right: 4%;
    }
#bikeplan .number img {
	    max-width: 80px; height: auto;
    }
#bikeplan .text {
	    margin-bottom: 15px;
    }

#bikeplan .point-title{
        font-size: 20px;
        font-weight: 700;
    }
#bikeplan .border{
        border-bottom: solid 1px #CCC;
	margin: 20px 0 30px 0;
    }

#bikeplan .point2 h2 {
        font-size: 36px;
        font-weight: 900;
	    color: #2572BC ;
	margin-bottom: 15px;
	padding: 10px 0 10px 88px;
	letter-spacing: 0;

    }
#bikeplan .point2Box {
	border-radius: 15px;
	border: solid #afd5e4 5px;
        background:linear-gradient(90deg, rgb(34, 213, 161,12%), rgb(154, 190, 224,30%));
	padding: 4% 4% 0;
    }

#bikeplan .point2 .pointText {
	font-size: 100% !important;
	margin-bottom: 10px;
	list-style-type: disc;
	margin-left: 15px;
    }
#bikeplan .point2 .sp-photo {
	max-width: 300px; height: auto;margin: 0 auto;

    }
 #bikeplan .icon-point {
	 background: url("../img/icon-point.png") no-repeat left center;

  }

}


 #bikeplan .underline {
       background: linear-gradient(transparent 70%, yellow 25%);
      display: inline;
  }

 #bikeplan .icon-point {
	 background: url("../img/icon-point.png") no-repeat left center;

  }

#bikeplan .col._col2{display:-webkit-flex;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;margin-bottom:50px}
#bikeplan .col._col2 figure{display:block;width:calc(50% - 20px);margin-bottom:20px}
#bikeplan .col._col2 figure img{display:block;margin:0 auto;width:100%;clip-path:inset(0 0 0 0)}
#bikeplan .col figure img{display:block;margin:0 auto;width:100%;clip-path:inset(0 0 0 0)}
#bikeplan .col._col2 figure figcaption{display:block;font-size:14px;text-align:center;line-height:1.4;font-weight:500;margin-top:10px}
#bikeplan .col._col2 figure figcaption .tbNone{display:none}
#bikeplan .col._col2 figure:nth-last-child(1),
#bikeplan .col._col2 figure:nth-last-child(2):nth-child(2n+1){margin-bottom:0}
@media screen and (max-width: 750px){#bikeplan .col._col2 figure{width:calc(50% - 10px)}}
@media screen and (max-width: 520px){#bikeplan .col._col2 figure{width:calc(100% - 5px);margin-bottom:10px !important;}
#bikeplan .col._col2._col2ph figure{width:calc(50% - 5px);margin-bottom:0px !important;}
#bikeplan .col._col2 figure figcaption{font-size:12px;margin-top:5px;margin-bottom:10px}
#bikeplan .col._col2 figure figcaption .tbNone{display:block}}


.boxCol2,.boxCol3,.boxCol4,.boxCol5{margin-bottom:20px !important}.boxCol2:nth-last-child(1),.boxCol3:nth-last-child(1),.boxCol4:nth-last-child(1),.boxCol5:nth-last-child(1){margin-bottom:0}@media all and (min-width: 841px){.boxCol2{display:-webkit-flex;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-wrap:wrap;flex-wrap:wrap}.boxCol2>dl,.boxCol2>div,.boxCol2>li,.boxCol2 ._col2Inner{width:calc(50% - 20px);margin-bottom:40px}.boxCol2>dl:nth-last-child(1),.boxCol2>div:nth-last-child(1),.boxCol2>li:nth-last-child(1),.boxCol2 ._col2Inner:nth-last-child(1),.boxCol2>dl:nth-last-child(2):nth-child(2n+1),.boxCol2>div:nth-last-child(2):nth-child(2n+1),.boxCol2>li:nth-last-child(2):nth-child(2n+1),.boxCol2 ._col2Inner:nth-last-child(2):nth-child(2n+1){margin-bottom:0}.boxCol3,.boxCol4,.boxCol5{display:-webkit-flex;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.boxCol3{width:calc(100% + 16px);margin-left:-8px}.boxCol3>dl,.boxCol3>div,.boxCol3>li,.boxCol3>._col3Inner{width:calc(100% / 3 - 16px);margin:0 8px 16px 8px}.boxCol3>dl:nth-last-child(1),.boxCol3>div:nth-last-child(1),.boxCol3>li:nth-last-child(1),.boxCol3>._col3Inner:nth-last-child(1),.boxCol3>dl:nth-last-child(2):nth-child(3n+1),.boxCol3>div:nth-last-child(2):nth-child(3n+1),.boxCol3>li:nth-last-child(2):nth-child(3n+1),.boxCol3>._col3Inner:nth-last-child(2):nth-child(3n+1),.boxCol3>dl:nth-last-child(2):nth-child(3n+2),.boxCol3>div:nth-last-child(2):nth-child(3n+2),.boxCol3>li:nth-last-child(2):nth-child(3n+2),.boxCol3>._col3Inner:nth-last-child(2):nth-child(3n+2),.boxCol3>dl:nth-last-child(3):nth-child(3n+1),.boxCol3>div:nth-last-child(3):nth-child(3n+1),.boxCol3>li:nth-last-child(3):nth-child(3n+1),.boxCol3>._col3Inner:nth-last-child(3):nth-child(3n+1){margin-bottom:0}
}

@media all and (max-width: 840px){.box{padding:15px}.box02{padding:20px}.boxCol2,.boxCol3{display:block;height:100%;}.boxCol2>dl,.boxCol2>div,.boxCol2>li,.boxCol2 ._col2Inner,.boxCol3>dl,.boxCol3>div,.boxCol3>li,.boxCol3 ._col3Inner{width:100%;margin:0 0 20px 0}
}

/*-------------------------
iframeBox
---------------------------*/
.movie {
	margin:0 auto 0;
	width: 70%;
	padding-top: 40.25%;
	position: relative;
}
.movie iframe {
	position: absolute;
	top: 0;
	right: 0;
	width: 100% !important;
	height: 100% !important;
}

@media all and (max-width: 840px){.movie {
	margin:0 auto 0;
	width: 90%;
	padding-top: 50.25%;
	position: relative;
}
.movie iframe {
	position: absolute;
	top: 0;
	right: 0;
	width: 100% !important;
	height: 100% !important;
}
}
/*-------------------------
iframeBox
---------------------------*/
.iframeBox {
	margin:0 0 1em 0;
	width: 100%;
	padding-top: 56.25%;
	position: relative;
}
.iframeBox iframe {
	position: absolute;
	top: 0;
	right: 0;
	width: 100% !important;
	height: 100% !important;
}