/******************************************
background
******************************************/

/******************************************
clearfix
******************************************/
.clearfix::after {
  content: "";
  display: block;
  clear: both;
}
/******************************************
border
******************************************/

/******************************************
image
******************************************/
.fit-img{
	height: auto;
	width: 100%;
}
.fit-max-img{
	height: auto;
	max-width: 100%;
}
/******************************************
margin
******************************************/
/*margin*/
.m5 {
  margin: 5em;
}

.m4 {
  margin: 4em;
}

.m3 {
  margin: 3em;
}

.m2 {
  margin: 2em;
}

.m1 {
  margin: 1em;
}

/*margin pc only*/
@media screen and (min-width: 769px) {
  .m5-pc {
    margin: 5em;
  }

  .m4-pc {
    margin: 4em;
  }

  .m3-pc {
    margin: 3em;
  }

  .m2-pc {
    margin: 2em;
  }

  .m1-pc {
    margin: 1em;
  }
}
/*margin sp only*/
@media screen and (max-width: 768px) {
  .m5-sp {
    margin: 5em;
  }

  .m4-sp {
    margin: 4em;
  }

  .m3-sp {
    margin: 3em;
  }

  .m2-sp {
    margin: 2em;
  }

  .m1-sp {
    margin: 1em;
  }
}
/*margin-bottom*/
.mb5 {
  margin-bottom: 5em;
}

.mb4 {
  margin-bottom: 4em;
}

.mb3 {
  margin-bottom: 3em;
}

.mb2 {
  margin-bottom: 2em;
}

.mb1 {
  margin-bottom: 1em;
}

/*margin-bottom pc only*/
@media screen and (min-width: 769px) {
  .mb5-pc {
    margin-bottom: 5em;
  }

  .mb4-pc {
    margin-bottom: 4em;
  }

  .mb3-pc {
    margin-bottom: 3em;
  }

  .mb2-pc {
    margin-bottom: 2em;
  }

  .mb1-pc {
    margin-bottom: 1em;
  }
}
/*margin-bottom sp only*/
@media screen and (max-width: 768px) {
  .mb5-sp {
    margin-bottom: 5em;
  }

  .mb4-sp {
    margin-bottom: 4em;
  }

  .mb3-sp {
    margin-bottom: 3em;
  }

  .mb2-sp {
    margin-bottom: 2em;
  }

  .mb1-sp {
    margin-bottom: 1em;
  }
}
/*margin-left*/
.ml5 {
  margin-left: 5em;
}

.ml4 {
  margin-left: 4em;
}

.ml3 {
  margin-left: 3em;
}

.ml2 {
  margin-left: 2em;
}

.ml1 {
  margin-left: 1em;
}

/*margin-left pc only*/
@media screen and (min-width: 769px) {
  .ml5-pc {
    margin-left: 5em;
  }

  .ml4-pc {
    margin-left: 4em;
  }

  .ml3-pc {
    margin-left: 3em;
  }

  .ml2-pc {
    margin-left: 2em;
  }

  .ml1-pc {
    margin-left: 1em;
  }
}
/*margin-left sp only*/
@media screen and (max-width: 768px) {
  .ml5-sp {
    margin-left: 5em;
  }

  .ml4-sp {
    margin-left: 4em;
  }

  .ml3-sp {
    margin-left: 3em;
  }

  .ml2-sp {
    margin-left: 2em;
  }

  .ml1-sp {
    margin-left: 1em;
  }
}
/*margin-right*/
.mr5 {
  margin-right: 5em;
}

.mr4 {
  margin-right: 4em;
}

.mr3 {
  margin-right: 3em;
}

.mr2 {
  margin-right: 2em;
}

.mr1 {
  margin-right: 1em;
}

/*margin-right pc only*/
@media screen and (min-width: 769px) {
  .mr5-pc {
    margin-right: 5em;
  }

  .mr4-pc {
    margin-right: 4em;
  }

  .mr3-pc {
    margin-right: 3em;
  }

  .mr2-pc {
    margin-right: 2em;
  }

  .mr1-pc {
    margin-right: 1em;
  }
}
/*margin-right sp only*/
@media screen and (max-width: 768px) {
  .mr5-sp {
    margin-right: 5em;
  }

  .mr4-sp {
    margin-right: 4em;
  }

  .mr3-sp {
    margin-right: 3em;
  }

  .mr2-sp {
    margin-right: 2em;
  }

  .mr1-sp {
    margin-right: 1em;
  }
}
/*margin-top*/
.mt10 {
  margin-top: 10em;
}
.mt5 {
  margin-top: 5em;
}

.mt4 {
  margin-top: 4em;
}

.mt3 {
  margin-top: 3em;
}

.mt2 {
  margin-top: 2em;
}

.mt1 {
  margin-top: 1em;
}
.mt05 {
	margin-top: .5em;
}
/*margin-top pc only*/
@media screen and (min-width: 769px) {
  .mt10-pc {
    margin-top: 10em;
  }
  .mt5-pc {
    margin-top: 5em;
  }

  .mt4-pc {
    margin-top: 4em;
  }

  .mt3-pc {
    margin-top: 3em;
  }

  .mt2-pc {
    margin-top: 2em;
  }

  .mt1-pc {
    margin-top: 1em;
  }
}
/*margin-top sp only*/
@media screen and (max-width: 768px) {
  .mt5-sp {
    margin-top: 5em;
  }

  .mt4-sp {
    margin-top: 4em;
  }

  .mt3-sp {
    margin-top: 3em;
  }

  .mt2-sp {
    margin-top: 2em;
  }

  .mt1-sp {
    margin-top: 1em;
  }
}
/*margin vertical*/
.mv5 {
  margin: 5em auto;
}

.mv4 {
  margin: 4em auto;
}

.mv3 {
  margin: 3em auto;
}

.mv2 {
  margin: 2em auto;
}

.mv1 {
  margin: 1em auto;
}

/*margin-vertical pc only*/
@media screen and (min-width: 769px) {
  .mv5-pc {
    margin: 5em auto;
  }

  .mv4-pc {
    margin: 4em auto;
  }

  .mv3-pc {
    margin: 3em auto;
  }

  .mv2-pc {
    margin: 2em auto;
  }

  .mv1-pc {
    margin: 1em auto;
  }
}
/*margin-vertical sp only*/
@media screen and (max-width: 768px) {
  .mv5-sp {
    margin: 5em auto;
  }

  .mv4-sp {
    margin: 4em auto;
  }

  .mv3-sp {
    margin: 3em auto;
  }

  .mv2-sp {
    margin: 2em auto;
  }

  .mv1-sp {
    margin: 1em auto;
  }
}
/*margin-horizon*/
.mh5 {
  margin: auto 5em;
}

.mh4 {
  margin: auto 4em;
}

.mh3 {
  margin: auto 3em;
}

.mh2 {
  margin: auto 2em;
}

.mh1 {
  margin: auto 1em;
}

/*margin-horizon pc only*/
@media screen and (min-width: 769px) {
  .mh5-pc {
    margin: auto 5em;
  }

  .mh4-pc {
    margin: auto 4em;
  }

  .mh3-pc {
    margin: auto 3em;
  }

  .mh2-pc {
    margin: auto 2em;
  }

  .mh1-pc {
    margin: auto 1em;
  }
}
/*margin-horizon sp only*/
@media screen and (max-width: 768px) {
  .mh5-sp {
    margin: auto 5em;
  }

  .mh4-sp {
    margin: auto 4em;
  }

  .mh3-sp {
    margin: auto 3em;
  }

  .mh2-sp {
    margin: auto 2em;
  }

  .mh1-sp {
    margin: auto 1em;
  }
}
/******************************************
padding
******************************************/
/*padding*/
.p5 {
  padding: 5em;
}

.p4 {
  padding: 4em;
}

.p3 {
  padding: 3em;
}

.p2 {
  padding: 2em;
}

.p1 {
  padding: 1em;
}

/*padding pc only*/
@media screen and (min-width: 769px) {
  .p5-pc {
    padding: 5em;
  }

  .p4-pc {
    padding: 4em;
  }

  .p3-pc {
    padding: 3em;
  }

  .p2-pc {
    padding: 2em;
  }

  .p1-pc {
    padding: 1em;
  }
}
/*padding sp only*/
@media screen and (max-width: 768px) {
  .p5-sp {
    padding: 5em;
  }

  .p4-sp {
    padding: 4em;
  }

  .p3-sp {
    padding: 3em;
  }

  .p2-sp {
    padding: 2em;
  }

  .p1-sp {
    padding: 1em;
  }
}
/*padding-bottom*/
.pb5 {
  padding-bottom: 5em;
}

.pb4 {
  padding-bottom: 4em;
}

.pb3 {
  padding-bottom: 3em;
}

.pb2 {
  padding-bottom: 2em;
}

.pb1 {
  padding-bottom: 1em;
}

/*padding-bottom pc only*/
@media screen and (min-width: 769px) {
  .pb5-pc {
    padding-bottom: 5em;
  }

  .pb4-pc {
    padding-bottom: 4em;
  }

  .pb3-pc {
    padding-bottom: 3em;
  }

  .pb2-pc {
    padding-bottom: 2em;
  }

  .pb1-pc {
    padding-bottom: 1em;
  }
}
/*padding-bottom sp only*/
@media screen and (max-width: 768px) {
  .pb5-sp {
    padding-bottom: 5em;
  }

  .pb4-sp {
    padding-bottom: 4em;
  }

  .pb3-sp {
    padding-bottom: 3em;
  }

  .pb2-sp {
    padding-bottom: 2em;
  }

  .pb1-sp {
    padding-bottom: 1em;
  }
}
/*padding-left*/
.pl5 {
  padding-left: 5em;
}

.pl4 {
  padding-left: 4em;
}

.pl3 {
  padding-left: 3em;
}

.pl2 {
  padding-left: 2em;
}

.pl1 {
  padding-left: 1em;
}

/*padding-left pc only*/
@media screen and (min-width: 769px) {
  .pl5-pc {
    padding-left: 5em;
  }

  .pl4-pc {
    padding-left: 4em;
  }

  .pl3-pc {
    padding-left: 3em;
  }

  .pl2-pc {
    padding-left: 2em;
  }

  .pl1-pc {
    padding-left: 1em;
  }
}
/*padding-left sp only*/
@media screen and (max-width: 768px) {
  .pl5-sp {
    padding-left: 5em;
  }

  .pl4-sp {
    padding-left: 4em;
  }

  .pl3-sp {
    padding-left: 3em;
  }

  .pl2-sp {
    padding-left: 2em;
  }

  .pl1-sp {
    padding-left: 1em;
  }
}
/*padding-right*/
.pr5 {
  padding-right: 5em;
}

.pr4 {
  padding-right: 4em;
}

.pr3 {
  padding-right: 3em;
}

.pr2 {
  padding-right: 2em;
}

.pr1 {
  padding-right: 1em;
}

/*padding-right pc only*/
@media screen and (min-width: 769px) {
  .pr5-pc {
    padding-right: 5em;
  }

  .pr4-pc {
    padding-right: 4em;
  }

  .pr3-pc {
    padding-right: 3em;
  }

  .pr2-pc {
    padding-right: 2em;
  }

  .pr1-pc {
    padding-right: 1em;
  }
}
/*padding-right sp only*/
@media screen and (max-width: 768px) {
  .pr5-sp {
    padding-right: 5em;
  }

  .pr4-sp {
    padding-right: 4em;
  }

  .pr3-sp {
    padding-right: 3em;
  }

  .pr2-sp {
    padding-right: 2em;
  }

  .pr1-sp {
    padding-right: 1em;
  }
}
/*padding-top*/
.pt5 {
  padding-top: 5em;
}

.pt4 {
  padding-top: 4em;
}

.pt3 {
  padding-top: 3em;
}

.pt2 {
  padding-top: 2em;
}

.pt1 {
  padding-top: 1em;
}

/*padding-top pc only*/
@media screen and (min-width: 769px) {
  .pt5-pc {
    padding-top: 5em;
  }

  .pt4-pc {
    padding-top: 4em;
  }

  .pt3-pc {
    padding-top: 3em;
  }

  .pt2-pc {
    padding-top: 2em;
  }

  .pt1-pc {
    padding-top: 1em;
  }
}
/*padding-top sp only*/
@media screen and (max-width: 768px) {
  .pt5-sp {
    padding-top: 5em;
  }

  .pt4-sp {
    padding-top: 4em;
  }

  .pt3-sp {
    padding-top: 3em;
  }

  .pt2-sp {
    padding-top: 2em;
  }

  .pt1-sp {
    padding-top: 1em;
  }
}
/*padding-horizon*/
.ph5 {
  padding: 0 5em;
}

.ph4 {
  padding: 0 4em;
}

.ph3 {
  padding: 0 3em;
}

.ph2 {
  padding: 0 2em;
}

.ph1 {
  padding: 0 1em;
}

/*padding-horizon pc only*/
@media screen and (min-width: 769px) {
  .ph5-pc {
    padding: 0 5em;
  }

  .ph4-pc {
    padding: 0 4em;
  }

  .ph3-pc {
    padding: 0 3em;
  }

  .ph2-pc {
    padding: 0 2em;
  }

  .ph1-pc {
    padding: 0 1em;
  }
}
/*padding-horizon sp only*/
@media screen and (max-width: 768px) {
  .ph5-sp {
    padding: 0 5em;
  }

  .ph4-sp {
    padding: 0 4em;
  }

  .ph3-sp {
    padding: 0 3em;
  }

  .ph2-sp {
    padding: 0 2em;
  }

  .ph1-sp {
    padding: 0 1em;
  }
}
/*padding-vertical*/
.pv5 {
  padding: 5em 0;
}

.pv4 {
  padding: 4em 0;
}

.pv3 {
  padding: 3em 0;
}

.pv2 {
  padding: 2em 0;
}

.pv1 {
  padding: 1em 0;
}

/*padding-vertical pc only*/
@media screen and (min-width: 769px) {
  /*padding vertical*/
  .pv5-pc {
    padding: 5em 0;
  }

  .pv4-pc {
    padding: 4em 0;
  }

  .pv3-pc {
    padding: 3em 0;
  }

  .pv2-pc {
    padding: 2em 0;
  }

  .pv1-pc {
    padding: 1em 0;
  }
}
/*padding-vertical sp only*/
@media screen and (max-width: 768px) {
  /*padding vertical*/
  .pv5-sp {
    padding: 5em 0;
  }

  .pv4-sp {
    padding: 4em 0;
  }

  .pv3-sp {
    padding: 3em 0;
  }

  .pv2-sp {
    padding: 2em 0;
  }

  .pv1-sp {
    padding: 1em 0;
  }
}
/******************************************
text
******************************************/
/*position*/
.text-center {
  text-align: center;
}
@media screen and (min-width:769px){
	.text-center-pc {
		text-align: center;
	}
}
@media screen and (max-width:768px){
	.text-center-sp {
		text-align: center;
	}
}
.text-left {
  text-align: left;
}

.text-right {
  text-align: right;
}

/*size*/
.text-10 {
	font-size: .625em;
}
.text-12 {
	font-size: .75em;
}
.text-14 {
	font-size: .875em;
}
.text-18 {
  font-size: 1.125em;
}
.text-24 {
  font-size: 1.5em;
}
.text-30 {
  font-size: 1.875em;
}
.text-36 {
	font-size: 2.25em;
}

@media screen and (min-width: 769px) {
  
}
@media screen and (max-width: 768px) {
  
}
/*weight*/
.text-normal {
  font-weight: normal;
}

.text-bold {
  font-weight: bold;
}

/******************************************
width
******************************************/
.w100 {
  width: 100%;
}
@media screen and (max-width: 768px) {
	.w100-sp{
		width: 100%;
	}
}
.w70 {
  width: 70%;
}
@media screen and (min-width: 769px) {
	.w70-pc{
		width: 70%;
	}
}
@media screen and (max-width: 768px) {
	.w70-sp{
		width: 70%;
	}
}
.w50 {
  width: 50%;
}
@media screen and (min-width: 769px) {
	.w50-pc{
		width: 50%;
	}
}
@media screen and (max-width: 768px) {
	.w50-sp{
		width: 50%;
	}
}
.w30 {
  width: 30%;
}
@media screen and (min-width: 769px) {
	.w30-pc{
		width: 30%;
	}
}
@media screen and (max-width: 768px) {
	.w30-sp{
		width: 30%;
	}
}

/******************************************
display
******************************************/
.pc-only {
  display: inherit;
}
@media screen and (max-width: 768px) {
  .pc-only {
    display: none;
  }
}

.sp-only {
  display: none;
}
@media screen and (max-width: 768px) {
  .sp-only {
    display: inherit;
  }
}