/* Custom CSS */





/* I N D E X */

/*[[[[[ Header ]]]]]*/

/*[[[ Station Logos ]]]*/
.index-header .index-header-frame .st-logos {
 position: absolute;
 top: 24px;
 right: 24px;
}
.index-header .index-header-frame .st-logos .st-logos-fm802 figure {
 width: 120px;
 margin-right: 3rem;
}
.index-header .index-header-frame .st-logos .st-logos-fmcocolo figure {
 width: 64px;
}


@media screen and (max-width: 991px) and (min-width: 768px) {
 .index-header .index-header-frame .st-logos {
  position: absolute;
  top: 18px;
  right: 18px;
 }
 .index-header .index-header-frame .st-logos .st-logos-fm802 figure {
  width: 98px;
  margin-right: 2rem;
 }
 .index-header .index-header-frame .st-logos .st-logos-fmcocolo figure {
  width: 52px;
 }

}


@media screen and (max-width: 767px) {
 .index-header .index-header-frame .st-logos {
  top: 12px;
  right: 12px;
 }
 .index-header .index-header-frame .st-logos .st-logos-fm802 figure {
  width: 75px;
  margin-right: 1rem;
 }
 .index-header .index-header-frame .st-logos .st-logos-fmcocolo figure {
  width: 42px;
 }

}


@media screen and (max-width: 360px) {
 .index-header .index-header-frame .st-logos .st-logos-fm802 figure {
  width: 68px;
  margin-right: 1rem;
 }
 .index-header .index-header-frame .st-logos .st-logos-fmcocolo figure {
  width: 38px;
 }

}




/*----- [[[ for Index Page ]]] -----*/
.index-header.full-screen {
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -webkit-box-pack: center;
 -ms-flex-pack: center;
 justify-content: center;
 -webkit-box-align: center;
 -ms-flex-align: center;
 align-items: center;
 margin: 0;
 padding: 0;
 width: 100%;
 height: 100%;
 height: 100vh; 
}
.index-header.full-screen .index-header-frame {
 width: 730px;
 height: auto;
 text-align:center;
}




@media screen and (max-width: 767px) {
 .index-header.full-screen .index-header-frame {
  width: 88%;
 }
 .index-header.full-screen .index-header-frame .index-header-frame-box-rich {
  width: 88%;
  margin-top: -1.4rem;
  margin-left: auto;
  margin-right: auto;
 }

}





/*----- [[[ for Kiyaku Page ]]] -----*/
.index-header.pages {
 margin: 0;
 padding: 0;
 width: 100%;
 height: auto;
}
.index-header.pages .index-header-frame {
 text-align:center;
}


@media screen and (max-width: 767px) {
 .index-header.pages .index-header-frame {
  width: 88%;
  margin-left: auto;
  margin-right: auto;
 }
 .index-header.pages .index-header-frame .index-header-frame-box-rich {
  width: 88%;
  margin-left: auto;
  margin-right: auto;
 }

}





/* [[[ Buttons ]]] */

.buttons {
 width: auto;
 height: auto;
 margin-left: auto;
 margin-right: auto;
 padding: 0;
 position: relative;
 z-index: 11;
}
.buttons ul li {
 text-align: center;
 flex-basis: calc(50% - 78px / 2);
 width: calc(50% - 78px / 2);
 margin: 0 78px 0 0;
}
.buttons ul li:last-child {
 margin-right: 0;
}


@media screen and (max-width: 991px) and (min-width: 768px) {
 .buttons {
  max-width: 680px;
 }

 .buttons ul li {
  flex-basis: calc(50% - 54px / 2);
  width: calc(50% - 54px / 2);
  margin: 0 54px 0 0;
 }

 .buttons .button-text {
  font-size: 0.941176rem;
 }

}


@media screen and (max-width: 767px) {
 .buttons ul li {
  width: 100%;
  margin: 0 auto;
 }
 .buttons ul li:last-child {
  margin-right: auto;
  margin-top: 1rem;
 }

 .buttons .button-text {
  font-size: .875rem;
 }

}





/* [[[ Scroll Arrow ]]] */
.index-header .m-scroll {
	position: absolute;
 bottom: 42px;
 left: 0;
 right: 0;
 z-index: 10;
}
.index-header .m-scroll a {
	color: rgba(51,51,51,1); /* #333333*/
 padding-top: 60px;
 display: block;
 cursor: default;
}
.index-header .m-scroll a:hover {
	text-decoration: none;
}
.index-header .m-scroll a span {
 position: absolute;
 top:0;
	left: 50%;
	margin-left: -12px;
 width: 24px;
 height: 24px;
 border-left: 1px solid #333;
 border-bottom: 1px solid #333;
 -webkit-transform: rotate(-45deg);
 transform: rotate(-45deg);
 -webkit-animation: sdb 1.5s infinite;
 animation: sdb 1.5s infinite;
 box-sizing: border-box;
}
@-webkit-keyframes sdb {
  0% {
    -webkit-transform: rotate(-45deg) translate(0, 0);
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-45deg) translate(-20px, 20px);
    opacity: 0;
  }
}
@keyframes sdb {
  0% {
    transform: rotate(-45deg) translate(0, 0);
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    transform: rotate(-45deg) translate(-20px, 20px);
    opacity: 0;
  }
}


@media screen and (max-width: 575px) {
 .index-header .m-scroll {
  bottom: 28px;
 }

}






/* [[[[[ Content ]]]]] */

/*----- [[[ Content ]]] -----*/

.rp-info {
 max-width: 730px;
 margin-left: auto;
 margin-right: auto;
 position: relative;
}
.rp-info.add-arrow {
 padding-top: 14rem;
}
.rp-info.add-arrow:before {
 content: "";
 width: 100%;
 height: 100%;
 position: absolute;
 top: 3.46875rem;
 display:block;
 margin-left: auto;
 margin-right: auto;
 background: url(../../images/index/rp_img_icon_arrow.png) no-repeat top center;
}
.rp-info .inner-frame {
 position: relative;
 border-radius: 7px;
 box-sizing: border-box;
}

.rp-info .inner-frame .icon-mark {
 position: absolute;
 top: 0;
 left: 0;
 right: 0;
 margin-top: -71px;
 margin-left: auto;
 margin-right: auto;
 text-align: center;
}
.rp-info .inner-frame .rich-box {
 position: relative;
 z-index: 2;
}
.rp-info .inner-frame .rich-box p {
 line-height: 1.8;
}


@media screen and (max-width: 767px) {
 .rp-info .inner-frame .icon-mark {
  width: 108px;
  margin-top: -54px;
  margin-left: auto;
  margin-right: auto;
 }

 .rp-info.add-arrow {
  padding-top: 10rem;
 }
 .rp-info.add-arrow:before {
  top: 2rem;
 }

 .rp-info .inner-frame .rich-box p {
  font-size: 1.125rem;
  line-height: 1.65;
 }

}





/* [[[[[ Footer ]]]]] */

/*----- [[[ Main Footer ]]] -----*/
.index-footer {
	position: relative;
}

.index-footer .index-footer-frame {
 width: 730px;
 height: auto;
 margin-left: auto;
 margin-right: auto;
 text-align:center;
}


@media screen and (max-width: 767px) {
 .index-footer .index-footer-frame {
  width: 88%;
 }

}







/*----- [[[ Social Link Buttons ]]] -----*/
.index-footer .sns-btns {
	width:auto;
	height: auto;
	padding: 0;
	text-align: center;
}
.index-footer .sns-btns .social {
	display: inline-block;
	line-height: 1;
	vertical-align: top;
}





/*----- [[[ Page Top Button ]]] -----*/
.pagetop {
	width:auto;
	height:auto;
	margin:0;
	padding:0;
	text-align: center;
	margin-top: 3rem;
}
.pagetop a {
	cursor: pointer;
	padding-top: 60px;
	position: relative;
 /*bottom: 20px;*/
 /*left: 50%;*/
 z-index: 2;
 display: inline-block;
 -webkit-transform: translate(0, -50%);
 transform: translate(0, -50%);
 text-decoration: none;
 text-indent: 0;
 font : normal 400 16px/1 'Roboto Condensed', sans-serif;
 color: rgba(17,17,17,1);
}
.pagetop a span {
	position: absolute;
 top: 0;
 left: 50%;
 width: 46px;
 height: 46px;
 margin-left: -23px;
 background: rgba(17,17,17,1);
 border-radius: 100%;
 box-sizing: border-box;
 -webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-ms-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}
.pagetop a:hover span {
 background: #646464;
}
.pagetop a span::after {
	position: absolute;
 top: 50%;
 left: 50%;
 content: '';
 width: 16px;
 height: 16px;
 margin: -4px 0 0 -8px;
 border-top: 2px solid #fff;
 border-right: 2px solid #fff;
 -webkit-transform: rotate(-45deg);
 transform: rotate(-45deg);
 box-sizing: border-box;
}


@media screen and (min-width: 768px) {
	.pagetop {
		display: none;
		margin-top: 0;
		position: fixed;
		bottom:2rem;
		right: 2rem;
	}

} /* @media screen and (min-width: 768px) end */





/*----- [[[ Station Logos ]]] -----*/
.index-footer .index-footer-frame .st-logos {
 position: relative;
 width: 100%;
 margin-top: 4rem;
 margin-left: auto;
 margin-right: auto;
 text-align: center;

}
.index-footer .index-footer-frame .st-logos .st-logos-fm802 figure {
 width: 148px;
 margin-right: 4rem;
}
.index-footer .index-footer-frame .st-logos .st-logos-fmcocolo figure {
 width: 80px;
}


@media screen and (max-width: 767px) {
 .index-footer .index-footer-frame .st-logos .st-logos-fm802 figure {
  width: 128px;
  margin-right: 3rem;
 }
 .index-footer .index-footer-frame .st-logos .st-logos-fmcocolo figure {
  width: 68px;
 }

}