@charset "UTF-8";
/*-------------------FONT-------------------*/
@import url('https://fonts.googleapis.com/css?family=M+PLUS+1p:100,300,400,500,600,700&subset=japanese') ;

/* CSS Document */
.wrapper {
	max-width:  980px;
	margin: 0 auto;
}
main {
	margin: 0 auto 50px;;
}
section {
    margin: 30px auto 0;
}
.pc {
	display: block;;
}
.sp {
	display: none;
}
@media (max-width:768px) {
	body{
		padding: 0 0 60px;
	}
}
@media (max-width:768px) {
  .wrapper {
        max-width:  96%;
        margin: 0 auto;
    }
		.pc {
			display: none;;
		}
		.sp {
			display: block;
		}
}
select, input, textarea {

}
.form-control {
    display: block;
    width: 100%;
    padding: .0rem .65rem;
    font-size: 1rem;
    line-height: 1.5rem;
    color: #495057;
    background-color: #f1f1f1;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: .25rem;
    -moz-appearance: none;
    -webkit-appearance: none;
    box-sizing: border-box;
    appearance: none;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}


/*ぱんくず・タイトル*/
.content_top {
    padding: 15px 0;
    box-sizing: border-box;
    background-color: #f1f1f1
}
.breadcrumb {
    font-size: 11px;
    font-weight: normal;
}
.breadcrumb li {
    float: left;
}
.breadcrumb li a::after {
     content: '❯';
    padding: 0 8px;
}

.sticky {
	position: fixed;
	bottom: 52px;
	right: 0;
	width: 120px;
	height: 240px;
}
.sticky li a {
	display: block;;
	width: 100%;
	height: 120px;
	text-align: center;;
	box-sizing: border-box;;
	color: #fff;
	padding: 25px 5px;
}
.sticky li:first-child a {
	background-color: #ca0300;
}
.sticky li:first-child a span {
	font-size: 9px;
}
.sticky li:first-child .fas {
	-moz-transform: rotate(-30deg);
  -webkit-transform: rotate(-30deg);
  -o-transform: rotate(-30deg);
  -ms-transform: rotate(-30deg);
  transform: rotate(-30deg);
	font-size: 30px;
}
.sticky li:last-child a {
	background-color: #ffc600;
	padding: 30px 5px;
}
.sticky li:last-child .fas {
	font-size: 35px;
}
@media (max-width:768px) {
	.sticky {
		position: fixed;
		bottom: 0;
		right: 0;
		width: 100%;
		height: 60px;
		box-sizing: border-box;;
		padding: 10px 0;
		background-color: rgba(0,0,0,0.7);
	}
	.sticky li {
		margin: 0 1%;
		float: left;
		width: 48%;
	}
	.sticky li a {
		display: block;;
		width: 100%;
		height: 40px;
		line-height: 40px;
		font-size: 15px;
		padding: 0px 5px;
	}
	.sticky .sp a {
		background-color: #ca0300;
	}
	.sticky .sp a .fas{
		-moz-transform: rotate(-30deg);
	  -webkit-transform: rotate(-30deg);
	  -o-transform: rotate(-30deg);
	  -ms-transform: rotate(-30deg);
	  transform: rotate(-30deg);
		font-size: 20px;
	}
	.sticky li:last-child a {
		background-color: #ffc600;
		padding: 0px 5px;
	}
	.sticky li:last-child .fas {
		font-size: 20px;
	}
}
.is-hide{
 display:none; 
}
.loading{
  position:fixed;
  top:0;
  right:0;
  bottom:0;
  left:0;
  background:rgba(0,0,0,.5);
}
.loading::before{
  content:"";
  display:block;
  position:fixed;
  left:50%;
  top:50%;
  width:50px;
  height:50px;
  border-radius:5px;
  margin-top:-15px;
  margin-left:-15px;
  background:white;
}
.loading::after{
  content:"";
  display:block;
  position:fixed;
  left:50%;
  top:50%;
  width:32px;
  height:32px;
  border-radius:20px;
  margin-top:-10px;
  margin-left:-10px;
  border:4px solid #60ABB9;
  border-right:4px solid white;
  animation: rotate 1s infinite linear;
}
@keyframes rotate {
  0%    { transform: rotate(0deg); }
  100%  { transform: rotate(360deg); }
}
