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

share.css

----------------------------------------------------------------------- */


/*-----------------------------------------------------------------

	common

-----------------------------------------------------------------*/

#wrap {
  min-width: 320px;
  position: relative;
  transition: all 0.5s ease;
  overflow: hidden;
}

.inner {
  width: 88%;
  max-width: 1200px;
  margin: 0 auto;
}

.w960 {
  max-width: 960px;
}

.w1060 {
  max-width: 1060px;
}

.w100p {
  width: 100%;
  max-width: 100%;
}


/*-----------------------------------------------------------------

	header

-----------------------------------------------------------------*/

/*----------------------------------------------------------
	Display：common
----------------------------------------------------------*/

header {
  width: 100%;
  background: #ffffff;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 110;
  transition: all 0.5s ease;
}

header .inner {
  position: relative;
  overflow: hidden;
  transition: all 0.5s ease;
}

header #logo {
  transition: width 0.5s ease;
  position: relative;
  z-index: 100;
  float: left;
}

header #logo #headerLogo {
  transition: all 0.5s ease;
}

header #logo #headerLogo svg {
  width: 100%;
  height: auto;
}

header #logo #headerLogo .n {
  fill: #221815;
  transition: all 0.5s ease;
}

header #logo #headerLogo .a {
  fill: #e30920;
  transition: all 0.5s ease;
}

header #logo #headerLogo .c {
  fill: #898989;
  transition: all 0.5s ease;
}

header #logo #headerLogoTxt {
  transition: all 0.5s ease;
}

header #logo #headerLogoTxt svg {
  width: 100%;
  height: auto;
  position: relative;
}

header #shoulder {
  transition: all 0.5s ease;
  position: relative;
  z-index: 100;
  float: left;
}

header #shoulder #headerShoulderCopy {
  width: 100%;
  height: auto;
  fill: #000000;
  transition: all 0.5s ease;
}

.sc header {
  background: #ffffff;
  box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1);
}

.sc header #logo #headerLogoTxt {
  opacity: 0;
}

.open header {
  height: 100vh;
  background: #cc0015;
  overflow: scroll;
}

.open header #logo #headerLogo .n,
.open header #logo #headerLogo .a,
.open header #logo #headerLogo .c {
  fill: #ffffff;
}

.open header #logo #headerLogoTxt {
  fill: #ffffff;
  opacity: 1;
}

.open header #shoulder #headerShoulderCopy {
  fill: #ffffff;
}

header #logo a {
  display: block;
}

header #logo a:hover #headerLogo .n,
header #logo a:hover #headerLogo .a,
header #logo a:hover #headerLogo .c {
  fill: #221815;
}


/*----------------------------------------------------------
	Display：← 559px（ sp ）
----------------------------------------------------------*/

@media screen and (max-width:559px) {

  header>.inner {
    width: 90%;
    padding-top: 35px;
    padding-bottom: 20px;
  }

  .sc header>.inner {
    padding-top: 10px;
    padding-bottom: 9px;
  }

  .open header>.inner {
    padding-top: 35px;
    padding-bottom: 20px;
  }

  header #logo,
  header #logo #headerLogo {
    width: 120px;
    height: 48px;
  }

  .sc header #logo,
  .sc header #logo #headerLogo {
    width: 100px;
    height: 40px;
  }

  .open header #logo,
  .open header #logo #headerLogo {
    width: 120px;
    height: 48px;
  }

  header #logo #headerLogoTxt {
    margin-top: -2px;
    width: 120px;
    height: 13px;
  }

  .sc header #logo #headerLogoTxt {
    width: 100px;
    height: 11px;
  }

  .open header #logo #headerLogoTxt {
    margin-top: -2px;
    width: 120px;
    height: 13px;
  }

  header #shoulder {
    width: 120px;
    height: 13px;
    margin: 13px 0 0 20px;
  }

  .sc header #shoulder {
    width: 100px;
    height: 11px;
    margin-top: 8px;
  }

  .open header #shoulder {
    width: 120px;
    height: 13px;
    margin: 13px 0 0 20px;
  }

}

/*----------------------------------------------------------
	Display：← 320px（ sp ）
----------------------------------------------------------*/

@media screen and (max-width:320px) {

  header #logo,
  header #logo #headerLogo {
    width: 100px;
    height: 40px;
  }

  .sc header #logo,
  .sc header #logo #headerLogo {
    width: 90px;
    height: 36px;
  }

  .open header #logo,
  .open header #logo #headerLogo {
    width: 100px;
    height: 40px;
  }

  header #logo #headerLogoTxt {
    margin-top: -3px;
    width: 100px;
    height: 11px;
  }

  .sc header #logo #headerLogoTxt {
    width: 90px;
    height: 9px;
  }

  .open header #logo #headerLogoTxt {
    margin-top: -3px;
    width: 100px;
    height: 11px;
  }

  header #shoulder {
    width: 100px;
    height: 11px;
    margin: 10px 0 0 20px;
  }

  .sc header #shoulder {
    width: 90px;
    height: 9px;
    margin-top: 6px;
  }

  .open header #shoulder {
    width: 100px;
    height: 11px;
    margin: 10px 0 0 20px;
  }

}

/*----------------------------------------------------------
	Display：560px →（ tablet ）
----------------------------------------------------------*/

@media screen and (min-width:560px) {

  header>.inner {
    padding-top: 45px;
    padding-bottom: 30px;
  }

  .sc header>.inner {
    padding-top: 23px;
    padding-bottom: 15px;
  }

  .open header>.inner {
    padding-top: 45px;
    padding-bottom: 30px;
  }

  header #logo,
  header #logo #headerLogo {
    width: 160px;
    height: 64px;
  }

  .sc header #logo,
  .sc header #logo #headerLogo {
    width: 140px;
    height: 56px;
  }

  .open header #logo,
  .open header #logo #headerLogo {
    width: 160px;
    height: 64px;
  }

  header #logo #headerLogoTxt {
    margin-top: 4px;
    width: 160px;
    height: 17px;
  }

  .sc header #logo #headerLogoTxt {
    width: 140px;
    height: 15px;
  }

  .open header #logo #headerLogoTxt {
    margin-top: 4px;
    width: 160px;
    height: 17px;
  }

  header #shoulder {
    width: 180px;
    height: 19px;
    margin: 22px 0 0 40px;
  }

  .sc header #shoulder {
    width: 160px;
    height: 17px;
    margin: 18px 0 0 30px;
  }

  .open header #shoulder {
    width: 180px;
    height: 19px;
    margin: 22px 0 0 40px;
  }

}

/*----------------------------------------------------------
	Display：769px →（ pc ）
----------------------------------------------------------*/

@media screen and (min-width:769px) {

  header>.inner {
    padding-top: 70px;
    padding-bottom: 55px;
  }

  .sc header>.inner {
    padding-top: 23px;
    padding-bottom: 15px;
  }

  .open header>.inner {
    padding-top: 70px;
    padding-bottom: 55px;
  }

  header #logo,
  header #logo #headerLogo {
    width: 190px;
    height: 76px;
  }

  .sc header #logo,
  .sc header #logo #headerLogo {
    width: 140px;
    height: 56px;
  }

  .open header #logo,
  .open header #logo #headerLogo {
    width: 190px;
    height: 76px;
  }

  header #logo #headerLogoTxt {
    margin-top: 8px;
    width: 190px;
    height: 20px;
  }

  .sc header #logo #headerLogoTxt {
    width: 140px;
    height: 15px;
  }

  .open header #logo #headerLogoTxt {
    margin-top: 8px;
    width: 190px;
    height: 20px;
  }

  header #shoulder {
    width: 200px;
    height: 20px;
    margin: 26px 0 0 45px;
  }

  .sc header #shoulder {
    width: 180px;
    height: 19px;
    margin: 16px 0 0 35px;
  }

  .open header #shoulder {
    width: 200px;
    height: 20px;
    margin: 26px 0 0 45px;
  }

}



/*-----------------------------------------------------------------

	#gNav

-----------------------------------------------------------------*/

/*----------------------------------------------------------
	Display：common
----------------------------------------------------------*/

#gNav {
  display: none;
  opacity: 0;
  width: 100%;
  position: absolute;
  z-index: 200;
  transition: all 0.5s ease;
  overflow: auto;
}

.open #gNav {
  opacity: 1;
  width: 100%;
  position: absolute;
  z-index: 200;
  transition: all 0.5s ease;
}

#gNav .inner {
  overflow: hidden;
  position: relative;
}

/*----------------------------------------------------------
	Display：← 559px（ sp ）
----------------------------------------------------------*/

@media screen and (max-width:559px) {

  #gNav {
    top: 130px;
  }

  #gNav .inner {
    padding-top: 10px;
    padding-bottom: 20px;
  }

}

/*----------------------------------------------------------
	Display：560px →（ tablet + pc ）
----------------------------------------------------------*/

@media print,
screen and (min-width: 560px) {

  #gNav {
    top: 150px;
  }

  #gNav .inner {
    padding-top: 50px;
    padding-bottom: 50px;
  }

}

/*----------------------------------------------------------
	Display：1000px →（ pc ）
----------------------------------------------------------*/

@media print,
screen and (min-width: 1000px) {

  #gNav {
    top: 200px;
  }

}



/*-----------------------------------------------------------------

	#gNavBtn

-----------------------------------------------------------------*/

/*----------------------------------------------------------
	Display：common
----------------------------------------------------------*/

#gNavBtn {
  text-align: center;
  cursor: pointer;
  position: absolute;
  z-index: 100;
  transition: all 0.5s ease;
}

#gNavBtn span {
  display: block;
  margin: 0 auto;
  padding: 0;
  background-color: #515151;
  position: absolute;
  left: 0;
  right: 0;
  transition: all 0.5s ease;
}

.open #gNavBtn span:nth-child(1) {
  -webkit-transform: rotate(315deg);
  -moz-transform: rotate(315deg);
  transform: rotate(315deg);
  background-color: #ffffff;
}

.open #gNavBtn span:nth-child(2) {
  opacity: 0;
}

.open #gNavBtn span:nth-child(3) {
  -webkit-transform: rotate(-315deg);
  -moz-transform: rotate(-315deg);
  transform: rotate(-315deg);
  background-color: #ffffff;
}



/*----------------------------------------------------------
	Display：← 559px（ sp ）
----------------------------------------------------------*/

@media screen and (max-width:559px) {

  #gNavBtn {
    width: 40px;
    height: 40px;
    top: 32px;
    right: 0;
  }

  #gNavBtn span {
    width: 36px;
    height: 2px;
  }

  #gNavBtn span:nth-child(1) {
    top: 12px;
  }

  #gNavBtn span:nth-child(2) {
    top: 26px;
  }

  #gNavBtn span:nth-child(3) {
    top: 40px;
  }

  .open #gNavBtn span:nth-child(1),
  .open #gNavBtn span:nth-child(3) {
    top: 26px;
  }

  .open #gNavBtn,
  .sc #gNavBtn {
    top: 3px;
  }
}

/*----------------------------------------------------------
	Display：← 320px（ sp ）
----------------------------------------------------------*/

@media screen and (max-width:320px) {

  #gNavBtn {
    width: 40px;
    height: 40px;
    top: 30px;
    right: 0;
  }

  #gNavBtn span {
    width: 36px;
    height: 2px;
  }

  #gNavBtn span:nth-child(1) {
    top: 12px;
  }

  #gNavBtn span:nth-child(2) {
    top: 26px;
  }

  #gNavBtn span:nth-child(3) {
    top: 40px;
  }

  .open #gNavBtn span:nth-child(1),
  .open #gNavBtn span:nth-child(3) {
    top: 26px;
  }

  .sc #gNavBtn {
    top: 3px;
  }

  .open #gNavBtn {
    top: 30px;
  }
}

/*----------------------------------------------------------
	Display：560px →（ tablet + pc）
----------------------------------------------------------*/

@media print,
screen and (min-width: 560px) {

  #gNavBtn {
    width: 54px;
    height: 54px;
    top: 55px;
    right: 0;
  }

  #gNavBtn span {
    width: 42px;
    height: 2px;
  }

  #gNavBtn span:nth-child(1) {
    top: 10px;
  }

  #gNavBtn span:nth-child(2) {
    top: 26px;
  }

  #gNavBtn span:nth-child(3) {
    top: 42px;
  }

  #gNavBtn:hover span {
    opacity: 0.3;
  }

  .open #gNavBtn span:nth-child(1),
  .open #gNavBtn span:nth-child(3) {
    top: 26px;
  }

  .sc #gNavBtn {
    top: 25px;
  }

  .open #gNavBtn {
    top: 55px;
  }
}

/*----------------------------------------------------------
	Display：769px →（pc）
----------------------------------------------------------*/

@media print,
screen and (min-width: 769px) {

  #gNavBtn {
    width: 54px;
    height: 54px;
    top: 80px;
    right: 0;
  }

  #gNavBtn span {
    width: 46px;
    height: 2px;
  }

  #gNavBtn span:nth-child(1) {
    top: 8px;
  }

  #gNavBtn span:nth-child(3) {
    top: 44px;
  }

  .open #gNavBtn {
    top: 80px;
  }

}




/*-----------------------------------------------------------------

	.nav

-----------------------------------------------------------------*/

/*----------------------------------------------------------
	Display：common
----------------------------------------------------------*/

.nav {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  -ms-flex-pack: wrap;
  flex-wrap: wrap;
}

.nav a {
  display: block;
  color: #ffffff;
  text-decoration: none;
  transition: all 0.5s ease;
  position: relative;
}

.nav>li {
  position: relative;
}

.nav>li .categoryLink {
  position: relative;
}

.nav>li .categoryLink .spOpen {
  display: none;
}

.nav>li .categoryLink a {
  padding-left: 20px;
  font-size: 1.15em;
}

.nav>li .categoryLink a:after {
  content: '';
  margin: auto 0;
  width: 8px;
  height: 8px;
  border-top: 2px solid #ffffff;
  border-right: 2px solid #ffffff;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  transition: all 0.5s ease;
}

.nav>li .categoryLink a:hover:after {
  left: 3px;
}

.nav>li ul {
  padding: 0 20px;
}

.nav>li ul li a {
  padding: 5px 0;
}

.nav .icon70th a {
  display: block;
  width: 132px;
  height: 132px;
  margin: 0;
  padding: 0;
  padding: 20px 15px 0;
  background: #ffffff;
}

.nav .icon70th img {
  width: 100%;
}

.nav .mark-authentication {
  margin: 0;
  padding: 0;
}

.nav .mark-authentication img {
  width: 100%;
}

/*----------------------------------------------------------
	Display：← 768px（ sp ）
----------------------------------------------------------*/

@media screen and (max-width:767px) {

  .nav>li {
    width: 100%;
    padding: 0;
    border-top: 1px solid #ffffff;
  }

  .nav>li ul {
    margin-bottom: 20px;
  }

  .nav>li a {
    padding: 15px 0;
  }

  .nav>li .categoryLink .spOpen {
    display: block;
    content: '';
    margin: auto 0;
    width: 38px;
    height: 38px;
    background-color: #ffffff;
    border-radius: 5px;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 10px;
    z-index: 100;
    cursor: pointer;
  }

  .nav>li .categoryLink .spOpen:after {
    content: '';
    display: block;
    margin: auto;
    width: 16px;
    height: 2px;
    background: #cc0015;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    transition: all 0.5s ease;
  }

  .nav>li .categoryLink .spOpen:before {
    content: '';
    display: block;
    margin: auto;
    width: 2px;
    height: 16px;
    background: #cc0015;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    transition: all 0.5s ease;
  }

  footer .nav>li .categoryLink .spOpen:after,
  footer .nav>li .categoryLink .spOpen:before {
    background: #272727;
  }

  .nav>li .categoryLink .spOpen.ac:after {
    opacity: 0;
  }

  .nav>li .categoryLink .spOpen.ac:before {
    -webkit-transform: rotate(270deg);
    transform: rotate(270deg);
  }

  .nav>li>ul {
    display: none;
  }

  .nav>li:last-child>ul {
    display: block;
    padding: 0;
  }

  .nav>li:last-child>ul li {
    border-bottom: 1px solid #ffffff;
  }

  .nav>li:last-child>ul li a {
    padding: 15px 20px;
    font-size: 1.15em;
  }

  .nav>li:last-child>ul li a:after {
    content: '';
    margin: auto 0;
    width: 8px;
    height: 8px;
    border-top: 2px solid #ffffff;
    border-right: 2px solid #ffffff;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    transition: all 0.5s ease;
  }

  .nav .icon70th {
    width: 100%;
    overflow: hidden;
  }

  .nav .icon70th a {
    float: right;
  }

  .nav .mark-authentication {
    width: 100%;
    overflow: hidden;
  }

  .nav .mark-authentication img {
    width: 120px;
    float: right;
  }
}

/*----------------------------------------------------------
	Display：768px →（ tablet ）
----------------------------------------------------------*/
@media screen and (min-width: 768px) {

  .nav a:hover {
    opacity: 0.6;
  }

  .nav>li .categoryLink {
    margin-bottom: 20px;
  }

}

/*----------------------------------------------------------
	Display：768px → 999px（ tablet ）
----------------------------------------------------------*/
@media screen and (min-width: 768px) and (max-width:999px) {

  .nav>li:nth-child(1) {
    width: 30%;
  }

  .nav>li:nth-child(2) {
    width: 40%;
  }

  .nav>li:nth-child(3) {
    width: 30%;
  }

  .nav>li:last-child {
    width: 100%;
    margin-top: 30px;
    padding: 30px 0 0;
    border-top: 1px solid #ffffff;
  }

  .nav .icon70th {
    width: 132px;
    position: absolute;
    top: 20px;
    right: 20px;
  }

  .nav .mark-authentication {
    width: 160px;
    position: absolute;
    top: 30px;
    right: 20px;
  }
}

/*----------------------------------------------------------
	Display：1000px →（ pc ）
----------------------------------------------------------*/
@media print,
screen and (min-width: 1000px) {

  .nav>li:nth-child(1) {
    width: 23.5%;
  }

  .nav>li:nth-child(2) {
    width: 28%;
  }

  .nav>li:nth-child(3) {
    width: 23.5%;
  }

  .nav>li:nth-child(4) {
    width: 25%;
  }

  .nav>li:last-child {
    padding: 0 0 0 10px;
    border-left: 1px solid #ffffff;
  }

  .nav .icon70th {
    width: 100%;
    padding: 20px 0 0 20px;
  }

  .nav .mark-authentication {
    width: 240px;
    margin: 20px 0 0 20px;
  }

}



/*----------------------------------------------------------

	footer

----------------------------------------------------------*/

/*----------------------------------------------------------
	Display：common
----------------------------------------------------------*/

footer {
  width: 100%;
  min-width: 320px;
  color: #ffffff;
  background: #353535;
}

footer .inner {
  position: relative;
  transition: all 0.5s ease;
}

footer .logoBox {
  overflow: hidden;
}

footer #logo {
  transition: width 0.5s ease;
  position: relative;
  z-index: 100;
}

footer #logo #headerLogo {
  width: 100%;
  fill: #ffffff;
}

footer #logo-jp {
  transition: all 0.5s ease;
  position: relative;
  z-index: 100;
}

footer #logo-jp img {
  width: 100%;
  transition: all 0.5s ease;
}

footer .copyright {
  background: #272727;
}

footer .copyright small {
  display: block;
  width: 86%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 35px 0;
  font-family: "Arial";
  letter-spacing: 0.1em;
}

/*----------------------------------------------------------
	Display：← 559px（ sp ）
----------------------------------------------------------*/

@media screen and (max-width:559px) {

  footer .inner {
    padding-top: 60px;
    padding-bottom: 30px;
  }

  footer .logoBox {
    padding-bottom: 30px;
  }

  footer #logo {
    width: 120px;
    height: 48px;
    float: left;
  }

  footer #logo-jp {
    width: 160px;
    height: 33px;
    margin: 9px 0 0 25px;
    float: left;
  }

  footer small.copyright {
    font-size: 1.4rem;
  }
}

/*----------------------------------------------------------
	Display：← 350px（ sp ）
----------------------------------------------------------*/

@media screen and (max-width:350px) {

  footer #logo {
    width: 110px;
    height: 44px;
    float: left;
  }

  footer #logo-jp {
    width: 140px;
    height: 29px;
    margin: 9px 0 0 20px;
    float: left;
  }
}

/*----------------------------------------------------------
	Display：← 560px（ tablet ）
----------------------------------------------------------*/

@media screen and (min-width:560px) {

  footer .inner {
    padding-top: 60px;
    padding-bottom: 30px;
  }

  footer .logoBox {
    padding-bottom: 30px;
  }

  footer #logo {
    width: 162px;
    height: 65px;
    float: left;
  }

  footer #logo-jp {
    width: 234px;
    height: 48px;
    margin: 9px 0 0 40px;
    float: left;
  }

  footer small.copyright {
    font-size: 1.4rem;
  }
}

/*----------------------------------------------------------
	Display：768px →
----------------------------------------------------------*/

@media print,
screen and (min-width: 768px) {

  footer .inner {
    padding-top: 90px;
    padding-bottom: 60px;
  }

  footer .logoBox {
    padding-bottom: 60px;
  }

  footer #logo {
    width: 180px;
    height: 72px;
    float: left;
  }

  footer #logo-jp {
    width: 260px;
    height: 53px;
    margin: 10px 0 0 45px;
    float: left;
  }

  footer small.copyright {
    font-size: 1.8rem;
  }
}



/*-----------------------------------------------------------------

	contents

-----------------------------------------------------------------*/

/*----------------------------------------------------------
	Display：common
----------------------------------------------------------*/

.contents {
  width: 100%;
  transition: all 0.5s ease;
}

.contents .pageTTL {
  text-align: center;
  line-height: 1.4;
  letter-spacing: 0.1em;
  text-indent: 0.1em;
}

.contents .headLineEng {
  width: 100%;
  height: 52px;
  margin: 0;
  padding: 0;
  text-align: center;
}

.contents .headLineEng img {
  width: auto;
  height: 100%;
}

.contents .headLineJP_Red {
  font-size: 2.8rem;
  line-height: 1.4;
  text-align: center;
  letter-spacing: 0.1em;
  text-indent: 0.1em;
  color: #cc0015;
}

.contents .headLineJP_Black {
  font-size: 2.8rem;
  line-height: 1.4;
  text-align: center;
  letter-spacing: 0.1em;
  text-indent: 0.1em;
}

.contents .headLineJP {
  font-size: 1.15em;
  text-align: center;
  letter-spacing: 0.1em;
  text-indent: 0.1em;
}

.contents .headLineUL {
  text-align: center;
}

.contents .headLineUL span {
  display: inline-block;
  padding: 0 1em 0.25em;
  font-size: 2.4rem;
  line-height: 1.4;
  letter-spacing: 0.1em;
  text-indent: 0.1em;
  border-bottom: 3px solid #cc0015;
}

.contents .midashiTxt {
  font-size: 1.8rem;
  line-height: 1.6;
}

.contents .midashiTxtS {
  font-size: 1.6rem;
  line-height: 1.6;
}

.contents .leadTxt {
  line-height: 2;
  text-align: left;
}

/*----------------------------------------------------------
	Display：← 559px（ sp ）
----------------------------------------------------------*/

@media screen and (max-width:559px) {

  #contentsTop {
    padding-top: 105px;
  }

  .contents .inner {
    padding-top: 50px;
    padding-bottom: 50px;
  }

  #contentsTop .inner {
    padding-top: 40px;
  }

  .contents .pageTTL {
    margin-bottom: 25px;
    font-size: 3.2rem;
  }

  .contents .headLineEng {
    height: 26px;
    margin-bottom: 20px;
  }

  .contents .headLineEng.spS {
    height: 22px;
  }

}

/*----------------------------------------------------------
	Display：← 320px（ sp ）
----------------------------------------------------------*/

@media screen and (max-width:320px) {

  .contents .headLineJP_Red {
    font-size: 2.4rem;
  }

  .contents .headLineJP_Black {
    font-size: 2.4rem;
  }

  .contents .headLineUL span {
    font-size: 2.2rem;
  }

  .contents .headLineEng {
    height: 24px;
    margin-bottom: 20px;
  }

  .contents .headLineEng.spS {
    height: 20px;
  }

  .contents .pageTTL {
    margin-bottom: 25px;
    font-size: 3.0rem;
  }

}

/*----------------------------------------------------------
	Display：560px →（ tablet + pc ）
----------------------------------------------------------*/

@media print,
screen and (min-width: 560px) {

  #contentsTop {
    padding-top: 140px;
  }

  .contents .inner {
    padding-top: 60px;
    padding-bottom: 60px;
  }

  #contentsTop .inner {
    padding-top: 50px;
  }

  .contents .pageTTL {
    margin-bottom: 30px;
    font-size: 3.8rem;
    letter-spacing: 0.19em;
    text-indent: 0.19em;
  }

  .contents .headLineEng {
    height: 32px;
    margin-bottom: 25px;
  }

  .contents .headLineJP_Red {
    font-size: 3.2rem;
  }

  .contents .headLineJP_Black {
    font-size: 3.2rem;
  }

  .contents .headLineUL span {
    font-size: 2.8rem;
  }

  .contents .midashiTxt {
    font-size: 2.0rem;
  }

  .contents .midashiTxtS {
    font-size: 1.8rem;
  }

  .contents .leadTxt {
    text-align: center;
  }

}

/*----------------------------------------------------------
	Display：769px →（ pc ）
----------------------------------------------------------*/

@media print,
screen and (min-width: 769px) {

  #contentsTop {
    padding-top: 200px;
  }

  .contents .inner {
    padding-top: 75px;
    padding-bottom: 75px;
  }

  #contentsTop .inner {
    padding-top: 65px;
  }

  .contents .pageTTL {
    margin-bottom: 35px;
    font-size: 4.8rem;
  }

  .contents .headLineEng {
    height: 38px;
    margin-bottom: 30px;
  }

  .contents .headLineJP_Red {
    font-size: 3.8rem;
  }

  .contents .headLineJP_Black {
    font-size: 3.8rem;
  }

  .contents .headLineUL span {
    font-size: 3.2rem;
  }

  .contents .midashiTxt {
    font-size: 2.4rem;
  }

  .contents .midashiTxtS {
    font-size: 2.0rem;
  }

  .contents .leadTxt {
    font-size: 1.15em;
  }

}



/*-----------------------------------------------------------------

	newsList

-----------------------------------------------------------------*/

/*----------------------------------------------------------
	Display：common
----------------------------------------------------------*/

.newsList li {
  overflow: hidden;
}

.newsList li dl {
  margin: 0;
  border-top: 1px dotted #494444;
}

.newsList li:last-child dl {
  border-bottom: 1px dotted #494444;
}

.newsList li dl dt {
  padding: 10px 0;
  font-family: 'arial', sans-serif;
  letter-spacing: 0.05em;
  color: #002394;
}

#newsTop .newsList li dl dt {
  font-size: 1.15em;
}

.newsList li dl dd {
  padding: 10px 0;
}

.newsList li dl dd a.ttl {
  display: block;
  text-decoration: none;
  transition: all 0.5s ease;
}

.newsList li dl dd a {
  text-decoration: none;
  transition: all 0.5s ease;
}

.newsList li dl dd .newsTTL {
  font-size: 1.15em;
  font-weight: bold;
  color: #c01125;
}

.newsList li dl dd p {
  margin-top: 1.25em;
}

.newsList li dl dd a:hover {
  opacity: 0.5;
}

/*----------------------------------------------------------
	Display：← 559px（ sp ）
----------------------------------------------------------*/

@media screen and (max-width:559px) {

  .newsList li dl {
    padding: 0 5%;
  }

  .newsList li dl dt {
    padding: 20px 0 0;
  }

  .newsList li dl dd {
    padding: 10px 0 20px;
  }
}

/*----------------------------------------------------------
	Display：560px →（ tablet + pc ）
----------------------------------------------------------*/

@media print,
screen and (min-width: 560px) {

  .newsList li dl {
    padding: 0 5%;
  }

  .newsList li dl dt {
    float: left;
    clear: left;
    width: 140px;
    padding: 15px 0;
  }

  .newsList li dl dd {
    padding: 15px 0 15px 140px;
  }

  #newsTop .newsList li dl dt,
  #newsTop .newsList li dl dd {
    padding-top: 30px;
    padding-bottom: 30px;
  }

}

/*----------------------------------------------------------
	Display：768px →（ tablet ）
----------------------------------------------------------*/
@media screen and (min-width: 768px) {

  .newsList li dl {
    padding: 0 10%;
  }
}



/*-----------------------------------------------------------------

	#contact

-----------------------------------------------------------------*/

/*----------------------------------------------------------
	Display：common
----------------------------------------------------------*/

#contact .headLine {
  color: #ffffff;
  text-align: center;
}

#contact .contactBox {
  width: 100%;
  max-width: 960px;
  margin: 30px auto 0;
  color: #ffffff;
}

#contact .contactBox .midashi {
  margin-bottom: 18px;
  font-size: 1.15em;
  line-height: 1.3;
}

#contact .contactBox .tel {
  width: 100%;
  max-width: 460px;
}

#contact .contactBox .tel img {
  width: 100%;
}

#contact .contactBtn {
  display: block;
  width: 100%;
  max-width: 460px;
  margin: 0;
  padding: 15px 10px;
  line-height: 1.5;
  text-align: center;
  color: #000000;
  background-color: #ffffff;
  text-decoration: none;
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
  position: relative;
  transition: all 0.5s ease;
}

#top #contact .contactBtn {
  background-color: #d1d1d1;
}

#contact .contactBtn:hover {
  color: #ffffff;
  background-color: #333333;
}

#contact .contactBtn::after {
  display: block;
  content: '';
  margin: auto;
  width: 8px;
  height: 8px;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  top: 0;
  bottom: 0;
  right: 15px;
  border-top: 1px solid #111111;
  border-right: 1px solid #111111;
  transition: all 0.5s ease;
}

#contact .contactBtn:hover::after {
  border-top: 1px solid #ffffff;
  border-right: 1px solid #ffffff;
  right: 10px;
}


/*----------------------------------------------------------
	Display：← 559px（ sp ）
----------------------------------------------------------*/

@media screen and (max-width:559px) {

  #contact .headLine {
    font-size: 2.4rem;
    line-height: 1.3;
  }

  #contact .contactBox .box {
    width: 100%;
    text-align: center;
  }

  #contact .contactBox .box:first-child {
    margin-bottom: 35px;
  }

  #contact .contactBox .tel {
    margin: 0 auto;
  }

  #contact .contactBox .midashi {
    text-align: center;
  }

  #contact .contactBtn {
    width: 100%;
    max-width: 460px;
    margin: 0 auto;
    padding: 20px 15px;
    font-size: 1.6rem;
  }

}

/*----------------------------------------------------------
	Display：← 320px（ sp ）
----------------------------------------------------------*/

@media screen and (max-width:320px) {

  #contact .contactBox p {
    font-size: 1.2rem;
  }

}

/*----------------------------------------------------------
	Display：560px →（ tablet ）
----------------------------------------------------------*/

@media print,
screen and (min-width: 560px) {

  #contact .headLine {
    font-size: 2.8rem;
    line-height: 1.3;
  }

  #contact .contactBox .box {
    width: 100%;
    text-align: center;
  }

  #contact .contactBox .box:first-child {
    margin-bottom: 35px;
  }

  #contact .contactBox .tel {
    margin: 0 auto;
  }

  #contact .contactBtn {
    width: 90%;
    margin: 0 auto;
    font-size: 1.6rem;
  }

}

/*----------------------------------------------------------
	Display：768px →（ tablet + pc ）
----------------------------------------------------------*/
@media screen and (min-width: 768px) {

  #contact .headLine {
    font-size: 3.2rem;
    line-height: 1.3;
  }

  #contact .contactBox .box {
    width: 48%;
    text-align: left;
  }

  #contact .contactBox .tel {
    margin: 0;
  }

  #contact .contactBtn {
    margin: 0;
    font-size: 1.6rem;
  }
}

/*----------------------------------------------------------
	Display：769px →（ pc ）
----------------------------------------------------------*/
@media screen and (min-width: 769px) {
  #contact .contactBtn {
    margin: 0;
    font-size: 1.8rem;
  }
}


/*-----------------------------------------------------------------

	#work

-----------------------------------------------------------------*/

/*----------------------------------------------------------
	Display：common
----------------------------------------------------------*/

#work .workList {
  width: 100%;
}

#work .workList li {
  padding: 2px;
  overflow: hidden;
}

#work .workList li img {
  width: 100%;
  transition: all .8s ease 0s;
}

#work .workList li a:hover img {
  opacity: 0.6;
  transform: scale(1.2, 1.2);
}

/*----------------------------------------------------------
	Display：← 559px（ sp ）
----------------------------------------------------------*/

@media screen and (max-width:559px) {

  #work .workList {
    margin-top: 30px;
    margin-bottom: 30px;
  }

  #work .workList li {
    width: 50%;
  }
}

/*----------------------------------------------------------
	Display：560px →（ tablet ）
----------------------------------------------------------*/

@media print,
screen and (min-width: 560px) {

  #work .workList {
    margin-top: 35px;
  }

  #work .workList li {
    width: 33.33%;
  }
}

/*----------------------------------------------------------
	Display：769px →（ pc ）
----------------------------------------------------------*/
@media print,
screen and (min-width: 769px) {

  #work .workList {
    margin-top: 40px;
  }

  #work .workList li {
    width: 25%;
  }


}




/*-----------------------------------------------------------------

	#group

-----------------------------------------------------------------*/

/*----------------------------------------------------------
	Display：common
----------------------------------------------------------*/

#group .groupOutBox {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  -ms-flex-pack: wrap;
  flex-wrap: wrap;
  position: relative;
}

#group .imageBox {
  width: 100%;
  text-align: center;
  position: relative;
}

#group .imageBox img {
  width: 100%;
  max-width: 750px;
}

#group .groupBox .midashi {
  margin-bottom: 15px;
}

#group .groupBox .midashi img {
  width: auto;
  height: 100%;
}


/*----------------------------------------------------------
	Display：← 559px（ sp ）
----------------------------------------------------------*/

@media screen and (max-width:559px) {

  #group .groupBox .midashi {
    height: 24px;
  }

  #group .groupBox {
    width: 100%;
    margin-top: 30px;
  }
}

/*----------------------------------------------------------
	Display：560px →（ tablet ）
----------------------------------------------------------*/

@media print,
screen and (min-width: 560px) {

  #group .groupBox .midashi {
    height: 28px;
  }

  #group .groupBox {
    width: 100%;
    margin-top: 30px;
  }

  #group .imageBox img {
    max-width: 650px;
  }

}

/*----------------------------------------------------------
	Display：768px →（ tablet + pc ）
----------------------------------------------------------*/
@media screen and (min-width: 768px) {}

/*----------------------------------------------------------
	Display：1000px →（ pc ）
----------------------------------------------------------*/
@media screen and (min-width: 1000px) {

  #group .inner {
    width: 95%;
  }

  #group .imageBox img {
    max-width: 750px;
  }

  #group .groupOutBox {
    padding-bottom: 120px;
  }

  #group .imageBox {
    padding-right: 10%;
  }

  #group .groupBox {
    font-size: 0.86em;
    position: absolute;
  }

  #group .groupBox .midashi {
    height: 30px;
  }

  #group .groupBox.box1 {
    width: 25%;
    top: 30px;
    left: 0px;
  }

  #group .groupBox.box2 {
    width: 20%;
    top: 150px;
    right: 0px;
  }

  #group .groupBox.box3 {
    width: 100%;
    top: 540px;
    left: 10%;
  }

  #group .groupBox.box4 {
    width: 45%;
    top: 560px;
    right: 0px;
  }
}



/*-----------------------------------------------------------------

	.onestopserviceStep

-----------------------------------------------------------------*/

/*----------------------------------------------------------
	Display：common
----------------------------------------------------------*/

.onestopserviceStep {
  width: 100%;
  max-width: 1036px;
  margin: 0 auto;
  padding: 40px 0 0;
}

.onestopserviceStep li {
  width: 100%;
}

.onestopserviceStep li img {
  width: 100%;
  height: auto;
}

/*----------------------------------------------------------
	Display：560px →（ tablet ）
----------------------------------------------------------*/

@media print,
screen and (min-width: 560px) {

  .onestopserviceStep li {
    margin-bottom: 25px;
  }

  .onestopserviceStep li:nth-child(1) {
    width: 36.5%;
    max-width: 377px;
  }

  .onestopserviceStep li:nth-child(2) {
    width: 36.5%;
    max-width: 377px;
  }

  .onestopserviceStep li:nth-child(3) {
    width: 27%;
    max-width: 280px;
  }

  .onestopserviceStep li:nth-child(4) {
    width: 29.5%;
    max-width: 305px;
  }

  .onestopserviceStep li:nth-child(5) {
    width: 43.5%;
    max-width: 449px;
  }

  .onestopserviceStep li:nth-child(6) {
    width: 27%;
    max-width: 280px;
  }

}



/*-----------------------------------------------------------------

	flexBox

-----------------------------------------------------------------*/

.flex-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-pack: wrap;
  flex-wrap: wrap;
}

.flexbw-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  -ms-flex-pack: wrap;
  flex-wrap: wrap;
}

.flexba-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: distribute;
  justify-content: space-around;
  -webkit-flex-wrap: wrap;
  -ms-flex-pack: wrap;
  flex-wrap: wrap;
}

/*----------------------------------------------------------
	Display：560px →（ tablet + pc ）
----------------------------------------------------------*/

@media print,
screen and (min-width: 560px) {

  .flexbwPC {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }

}



/*-----------------------------------------------------------------

	btn

-----------------------------------------------------------------*/

/*----------------------------------------------------------
	Display：common
----------------------------------------------------------*/

.btnN {
  display: block;
  width: 80%;
  max-width: 340px;
  margin: 40px auto 0;
  padding: 12px 10px;
  font-size: 1.8rem;
  line-height: 1.5;
  text-align: center;
  color: #ffffff;
  background-color: #cc0015;
  background-size: 10px auto;
  text-decoration: none;
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
  position: relative;
  transition: all 0.5s ease;
}

.btnN:hover {
  background-color: #a40011;
}

.btnN::after {
  display: block;
  content: '';
  margin: auto;
  width: 8px;
  height: 8px;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  top: 0;
  bottom: 0;
  right: 15px;
  border-top: 1px solid #ffffff;
  border-right: 1px solid #ffffff;
  transition: all 0.5s ease;
}

.btnN:hover::after {
  right: 10px;
}

/*----------------------------------------------------------
	Display：560px →（ tablet ）
----------------------------------------------------------*/

@media print,
screen and (min-width: 560px) {

  .btnN {
    padding: 15px 10px;
  }

}



/*-----------------------------------------------------------------

	modal movieOpen

-----------------------------------------------------------------*/

/*----------------------------------------------------------
	Display：common
----------------------------------------------------------*/

.movieOpen {
  display: block;
  position: relative;
}

.movieOpen img {
  transition: all 0.5s ease;
}

.movieOpen:hover img {
  opacity: 0.6;
}

.movieOpen::before {
  content: '';
  display: block;
  margin: auto;
  width: 74px;
  height: 74px;
  background: url(../img/common/icon_play.png);
  background-size: 74px auto;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  transition: all 0.5s ease;
  z-index: 2;
}

#modalBox {
  display: none;
}

#modalMovie {
  margin: auto;
  background: #ffffff;
  border: none;
  box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.5);
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 10000;
  transition: all 0.5s ease;
}

#modalMovie #if {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}

#modalMovie .close {
  width: 40px;
  height: 40px;
  position: absolute;
  top: -5px;
  right: -5px;
  z-index: 1001;
  cursor: pointer;
  background: #ffffff;
  transition: all 0.5s ease;
}

#modalMovie #close:hover {
  opacity: 0.5;
}

#modalMovie .close img {
  width: 100%;
}

#modalMovie video {
  width: 100% !important;
  height: 100% !important;
  margin: 0;
  padding: 0;
  border: none;
  background: #000000;
  position: absolute;
  top: 0;
  right: 0;
}

/*----------------------------------------------------------
	Display：559px →（ sp ）
----------------------------------------------------------*/

@media screen and (max-width: 559px) {
  #modalMovie {
    ;
    width: 340px;
    height: 191px;
  }

  .movieOpen::before {
    width: 62px;
    height: 62px;
    background-size: 62px auto;
  }
}

/*----------------------------------------------------------
	Display：340px →（ sp ）
----------------------------------------------------------*/

@media screen and (max-width: 340px) {
  #modalMovie {
    width: 310px;
    height: 174px;
  }
}


/*----------------------------------------------------------
	Display：560px →（ tablet ）
----------------------------------------------------------*/

@media print,
screen and (min-width: 560px) {
  #modalMovie {
    width: 640px;
    height: 360px;
  }
}


/*----------------------------------------------------------
	Display：769px →（ pc ）
----------------------------------------------------------*/

@media print,
screen and (min-width: 840px) {
  #modalMovie {
    width: 800px;
    height: 450px;
  }
}



/*-----------------------------------------------------------------

	.closeBtn

-----------------------------------------------------------------*/
.closeBtn {
  width: 38px;
  height: 38px;
  display: block;
  text-align: center;
  cursor: pointer;
  position: absolute;
  top: -30px;
  right: 0px;
  z-index: 20000;
  transition: all 0.3s;
}

.closeBtn span {
  display: block;
  height: 5px;
  margin-left: auto;
  margin-right: auto;
  background: #111111;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  transition: 0.5s ease-in-out;
}

.closeBtn span:nth-child(1) {
  transform: rotate(45deg);
}

.closeBtn span:nth-child(2) {
  transform: rotate(135deg);
}

.closeBtn:hover span:nth-child(1) {
  transform: rotate(225deg);
}

.closeBtn:hover span:nth-child(2) {
  transform: rotate(315deg);
}

/*----------------------------------------------------------
	Display：560px →（ tablet + pc）
----------------------------------------------------------*/

@media print,
screen and (min-width: 560px) {

  #privacypolicy .inner {
    padding: 50px;
  }

}


/*-----------------------------------------------------------------

	pageloading

-----------------------------------------------------------------*/

#pageloading-wrap {
  background-color: rgba(255, 255, 255, 1);
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  text-align: center;
  display: table;
  z-index: 1000;
}

#pageloading-icon {
  display: table-cell;
  vertical-align: middle;
}

.loader {
  color: #272727;
  font-size: 8px;
  margin: auto;
  width: 1em;
  height: 1em;
  border-radius: 50%;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  text-indent: -9999em;
  -webkit-animation: load4 1.3s infinite linear;
  animation: load4 1.3s infinite linear;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
}

@-webkit-keyframes load4 {

  0%,
  100% {
    box-shadow: 0 -3em 0 0.2em, 2em -2em 0 0em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 0;
  }

  12.5% {
    box-shadow: 0 -3em 0 0, 2em -2em 0 0.2em, 3em 0 0 0, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
  }

  25% {
    box-shadow: 0 -3em 0 -0.5em, 2em -2em 0 0, 3em 0 0 0.2em, 2em 2em 0 0, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
  }

  37.5% {
    box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 0, 2em 2em 0 0.2em, 0 3em 0 0em, -2em 2em 0 -1em, -3em 0em 0 -1em, -2em -2em 0 -1em;
  }

  50% {
    box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 0em, 0 3em 0 0.2em, -2em 2em 0 0, -3em 0em 0 -1em, -2em -2em 0 -1em;
  }

  62.5% {
    box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 0, -2em 2em 0 0.2em, -3em 0 0 0, -2em -2em 0 -1em;
  }

  75% {
    box-shadow: 0em -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0.2em, -2em -2em 0 0;
  }

  87.5% {
    box-shadow: 0em -3em 0 0, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0, -2em -2em 0 0.2em;
  }
}

@keyframes load4 {

  0%,
  100% {
    box-shadow: 0 -3em 0 0.2em, 2em -2em 0 0em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 0;
  }

  12.5% {
    box-shadow: 0 -3em 0 0, 2em -2em 0 0.2em, 3em 0 0 0, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
  }

  25% {
    box-shadow: 0 -3em 0 -0.5em, 2em -2em 0 0, 3em 0 0 0.2em, 2em 2em 0 0, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
  }

  37.5% {
    box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 0, 2em 2em 0 0.2em, 0 3em 0 0em, -2em 2em 0 -1em, -3em 0em 0 -1em, -2em -2em 0 -1em;
  }

  50% {
    box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 0em, 0 3em 0 0.2em, -2em 2em 0 0, -3em 0em 0 -1em, -2em -2em 0 -1em;
  }

  62.5% {
    box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 0, -2em 2em 0 0.2em, -3em 0 0 0, -2em -2em 0 -1em;
  }

  75% {
    box-shadow: 0em -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0.2em, -2em -2em 0 0;
  }

  87.5% {
    box-shadow: 0em -3em 0 0, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0, -2em -2em 0 0.2em;
  }
}





/*-----------------------------------------------------------------

	effect

-----------------------------------------------------------------*/

.effect-s {
  transform: translateY(50px);
  opacity: 0;
}

.effect-s.is-animated {
  transform: translateY(0);
  opacity: 1;
  transition: 1.2s;
}





/*-----------------------------------------------------------------

	Display：print

-----------------------------------------------------------------*/

@media print {

  body {
    width: 1200px;
    transform: scale(0.8);
    -moz-transform: scale(0.8);
    -webkit-transform: scale(0.8);
    transform-origin: 0 0;
  }

  .br320 {
    display: none;
  }

  .br375 {
    display: none;
  }

  .brPad {
    display: none;
  }

}