@charset "UTF-8";

*, *:before, *:after {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

html {
  font-size: 40%;
}

body {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  margin: 0 auto;
  color: #191919;
  font-family:Helvetica, Arial, 'LiHei Pro', '微軟正黑體',sans-serif;
  
  line-height: 1.3;
  font-size: 16px;
  font-size: 1.6rem;
  -webkit-text-size-adjust:100%;
}

a {
  outline: none;
  color: #6e0f0f;
  text-decoration: none;
  -webkit-transition: opacity .2s ease-out;
  transition: opacity .2s ease-out;
}

a:hover {
  text-decoration: underline;
}

a img {
  border: none;
}

h1, h2, h3, h4, h5 {
  margin: 3px;
}

h2 {
  color:#FFF;
  font-weight:bold;
  font-size:2.2em;
  text-shadow:2px 2px 2px #000;
  min-height:48px;
}
h3 {color:#900;font-size:2.5rem;}

ul {margin: 0;padding: 0;list-style: none;}

p {margin: 0;}

em {
  color: #6e0f13;
  font-weight: bold;
  font-style: normal;
}

img {vertical-align: middle;}

.alt {
  position: absolute;
  overflow: hidden;
  width: 0;
  height: 0;
}

html, body { width: 100%; height: 100%;}

.sec .sec-inner { position: relative;margin: 0 auto;width: 414px;}

.header {
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  margin: 0 auto;
  left:-4px;
  width: 414px;
  height: 40.4px;
  /*background: url(../img/bg-header.jpg) no-repeat center top;*/
  -webkit-background-size: contain;
          background-size: contain;
  -js-display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.header .logo-capcom {
  margin-left: 17px;
  width: 74.5px;
}

.header .logo-capcom img {
  width: 100%;
}

body {
  background: #fff;
}

.bg-body div {
  position: fixed;
  z-index: -1;
  width: 100%;
  height: 100%;
}

.bg-body .bg-body-origin {
  background: url(../img/bg-body.jpg) no-repeat center top;
  -webkit-background-size: cover;
          background-size: cover;
}

.bg-body .bg-body-blur {
  display: none;
}

.main {
  position: relative;
  text-align: center;
}

.main img {
  width: 100%;
}

.sec {
  margin: 0 auto 20px;
}

.sec .text-area {
  padding: 0 20px;
  text-align: left;
  font-size: 24px;
  font-size: 2rem;
}

.visual .visual-inner {
  position: relative;
  margin: 0 auto;
  width: 414px;
  height: 818px;
  background: url(../img/bg-visual.jpg) no-repeat center top;
  -webkit-background-size: contain;
          background-size: contain;
}

.visual .visual-inner .list-dl {
  position: absolute;
  bottom: 118px;
  z-index: 1;
  width: 414px;
}

.visual .visual-inner .list-dl li {
  width: 149px;
}

.visual .visual-inner .list-ts {
  position: absolute;
  bottom: 118px;
  z-index: 1;
  width: 414px;
}

.visual .visual-inner .visual-item {
  display: none;
}

.sec-counter {
  margin-top: -34px;
}

.sec-counter .cnt-inner {
  top: 45px;
}


.sec-original .hdg-l2 img {
  width: 232px;
}

.sec-original .img-original-01 {
  margin: 10px auto 0;
  width: 128px;
}


.sec-original .img-original-02, .sec-original .img-original-04, .sec-original .img-original-06 {
  margin: 20px auto 0;
  width: 305.5px;
}

.sec-original .img-original-03, .sec-original .img-original-05 {
  margin: 30px auto 20px;
  width: 368.5px;
}


.box {
  position: relative;
  margin: 0px auto 0;
  border-radius: 6px 6px 0 0;
  /*-webkit-box-shadow: 0 0 12px 1px rgba(0, 0, 0, 0.4);
          box-shadow: 0 0 12px 1px rgba(0, 0, 0, 0.4);*/
  text-align: left;
  font-size: 20px;
  font-size: 2rem;
  width: 365px;
  z-index: 10;
  padding-top:30px;
}

.box .hdg {
  position: relative;
  z-index: 2;
  padding: 15px 20px;
  background: #313232;
  color:#FFF;
  font-size:3rem;
  text-align:center;
  filter: glow(color:blue, strength=2); color:white; font-weight:700; text-shadow: 1px 1px 5px blue;
}

.box .box-inner {
  position: relative;
  z-index: 2;
  padding: 15px 20px 25px;
  /*background-color:#000;*/
  background: url(../img/bg_sec_center.png) repeat-y top center;
}

.box .list-notes {
  margin-top: 5px;
}

.box:after {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 6px 6px 0 0;
}


.cnt-clear {
  position: absolute;
  top: 25px;
  left: 50%;
  z-index: 1;
  margin-left: -180.5px;
  width: 361px;
}

.cnt-clear:before {
  content: "";
  width: 72.5px;
  height: 72.5px;
  position: absolute;
  top: -31px;
  left: -14px;
  background: url(../img/deco-clear.png) no-repeat;
  -webkit-background-size: 72.5px 72.5px;
          background-size: 72.5px 72.5px;
  z-index: 1;
  -webkit-transform: scale(0.2);
      -ms-transform: scale(0.2);
          transform: scale(0.2);
  -webkit-animation: kira 2s infinite linear;
          animation: kira 2s infinite linear;
  -webkit-transform-origin: center center;
      -ms-transform-origin: center center;
          transform-origin: center center;
}

@-webkit-keyframes kira {
  0% {
    -webkit-transform: scale(0.2) rotate(0);
            transform: scale(0.2) rotate(0);
  }
  40% {
    -webkit-transform: scale(0.5) rotate(160deg);
            transform: scale(0.5) rotate(160deg);
  }
  45% {
    -webkit-transform: scale(0.4) rotate(170deg);
            transform: scale(0.4) rotate(170deg);
  }
  50% {
    -webkit-transform: scale(0.5) rotate(180deg);
            transform: scale(0.5) rotate(180deg);
  }
  90% {
    -webkit-transform: scale(0.2) rotate(340deg);
            transform: scale(0.2) rotate(340deg);
  }
  95% {
    -webkit-transform: scale(0.3) rotate(350deg);
            transform: scale(0.3) rotate(350deg);
  }
  100% {
    -webkit-transform: scale(0.2) rotate(360deg);
            transform: scale(0.2) rotate(360deg);
  }
}

@keyframes kira {
  0% {
    -webkit-transform: scale(0.2) rotate(0);
            transform: scale(0.2) rotate(0);
  }
  40% {
    -webkit-transform: scale(0.5) rotate(160deg);
            transform: scale(0.5) rotate(160deg);
  }
  45% {
    -webkit-transform: scale(0.4) rotate(170deg);
            transform: scale(0.4) rotate(170deg);
  }
  50% {
    -webkit-transform: scale(0.5) rotate(180deg);
            transform: scale(0.5) rotate(180deg);
  }
  90% {
    -webkit-transform: scale(0.2) rotate(340deg);
            transform: scale(0.2) rotate(340deg);
  }
  95% {
    -webkit-transform: scale(0.3) rotate(350deg);
            transform: scale(0.3) rotate(350deg);
  }
  100% {
    -webkit-transform: scale(0.2) rotate(360deg);
            transform: scale(0.2) rotate(360deg);
  }
}

.cnt-clear:after {
  content: "";
  width: 72.5px;
  height: 72.5px;
  position: absolute;
  top: 3px;
  right: -34px;
  background: url(../img/deco-clear.png) no-repeat;
  -webkit-background-size: 72.5px 72.5px;
          background-size: 72.5px 72.5px;
  z-index: 1;
  -webkit-animation: kira2 2s infinite linear .6s;
          animation: kira2 2s infinite linear .6s;
  -webkit-transform-origin: center center;
      -ms-transform-origin: center center;
          transform-origin: center center;
  -webkit-transform: scale(0.2);
      -ms-transform: scale(0.2);
          transform: scale(0.2);
}

@-webkit-keyframes kira2 {
  0% {
    -webkit-transform: scale(0.2) rotate(0);
            transform: scale(0.2) rotate(0);
  }
  40% {
    -webkit-transform: scale(0.5) rotate(160deg);
            transform: scale(0.5) rotate(160deg);
  }
  45% {
    -webkit-transform: scale(0.4) rotate(170deg);
            transform: scale(0.4) rotate(170deg);
  }
  50% {
    -webkit-transform: scale(0.5) rotate(180deg);
            transform: scale(0.5) rotate(180deg);
  }
  90% {
    -webkit-transform: scale(0.2) rotate(340deg);
            transform: scale(0.2) rotate(340deg);
  }
  95% {
    -webkit-transform: scale(0.3) rotate(350deg);
            transform: scale(0.3) rotate(350deg);
  }
  100% {
    -webkit-transform: scale(0.2) rotate(360deg);
            transform: scale(0.2) rotate(360deg);
  }
}

@keyframes kira2 {
  0% {
    -webkit-transform: scale(0.2) rotate(0);
            transform: scale(0.2) rotate(0);
  }
  40% {
    -webkit-transform: scale(0.5) rotate(160deg);
            transform: scale(0.5) rotate(160deg);
  }
  45% {
    -webkit-transform: scale(0.4) rotate(170deg);
            transform: scale(0.4) rotate(170deg);
  }
  50% {
    -webkit-transform: scale(0.5) rotate(180deg);
            transform: scale(0.5) rotate(180deg);
  }
  90% {
    -webkit-transform: scale(0.2) rotate(340deg);
            transform: scale(0.2) rotate(340deg);
  }
  95% {
    -webkit-transform: scale(0.3) rotate(350deg);
            transform: scale(0.3) rotate(350deg);
  }
  100% {
    -webkit-transform: scale(0.2) rotate(360deg);
            transform: scale(0.2) rotate(360deg);
  }
}

.cnt-clear .deco-clear:before {
  content: "";
  width: 72.5px;
  height: 72.5px;
  position: absolute;
  top: 20px;
  left: 81px;
  background: url(../img/deco-clear.png) no-repeat;
  -webkit-background-size: 72.5px 72.5px;
          background-size: 72.5px 72.5px;
  z-index: 1;
  -webkit-animation: kira3 2s infinite linear .2s;
          animation: kira3 2s infinite linear .2s;
  -webkit-transform-origin: center center;
      -ms-transform-origin: center center;
          transform-origin: center center;
  -webkit-transform: scale(0.2);
      -ms-transform: scale(0.2);
          transform: scale(0.2);
}

@-webkit-keyframes kira3 {
  0% {
    -webkit-transform: scale(0.1) rotate(0);
            transform: scale(0.1) rotate(0);
  }
  40% {
    -webkit-transform: scale(0.4) rotate(160deg);
            transform: scale(0.4) rotate(160deg);
  }
  45% {
    -webkit-transform: scale(0.3) rotate(170deg);
            transform: scale(0.3) rotate(170deg);
  }
  50% {
    -webkit-transform: scale(0.4) rotate(180deg);
            transform: scale(0.4) rotate(180deg);
  }
  90% {
    -webkit-transform: scale(0.1) rotate(340deg);
            transform: scale(0.1) rotate(340deg);
  }
  95% {
    -webkit-transform: scale(0.2) rotate(350deg);
            transform: scale(0.2) rotate(350deg);
  }
  100% {
    -webkit-transform: scale(0.1) rotate(360deg);
            transform: scale(0.1) rotate(360deg);
  }
}

@keyframes kira3 {
  0% {
    -webkit-transform: scale(0.1) rotate(0);
            transform: scale(0.1) rotate(0);
  }
  40% {
    -webkit-transform: scale(0.4) rotate(160deg);
            transform: scale(0.4) rotate(160deg);
  }
  45% {
    -webkit-transform: scale(0.3) rotate(170deg);
            transform: scale(0.3) rotate(170deg);
  }
  50% {
    -webkit-transform: scale(0.4) rotate(180deg);
            transform: scale(0.4) rotate(180deg);
  }
  90% {
    -webkit-transform: scale(0.1) rotate(340deg);
            transform: scale(0.1) rotate(340deg);
  }
  95% {
    -webkit-transform: scale(0.2) rotate(350deg);
            transform: scale(0.2) rotate(350deg);
  }
  100% {
    -webkit-transform: scale(0.1) rotate(360deg);
            transform: scale(0.1) rotate(360deg);
  }
}

.cnt-clear .deco-clear:after {
  content: "";
  width: 72.5px;
  height: 72.5px;
  position: absolute;
  top: -16px;
  left: 210px;
  background: url(../img/deco-clear.png) no-repeat;
  -webkit-background-size: 72.5px 72.5px;
          background-size: 72.5px 72.5px;
  z-index: 1;
  -webkit-animation: kira4 2s infinite linear .4s;
          animation: kira4 2s infinite linear .4s;
  -webkit-transform-origin: center center;
      -ms-transform-origin: center center;
          transform-origin: center center;
  -webkit-transform: scale(0.2);
      -ms-transform: scale(0.2);
          transform: scale(0.2);
}

@-webkit-keyframes kira4 {
  0% {
    -webkit-transform: scale(0.1) rotate(0);
            transform: scale(0.1) rotate(0);
  }
  40% {
    -webkit-transform: scale(0.4) rotate(160deg);
            transform: scale(0.4) rotate(160deg);
  }
  45% {
    -webkit-transform: scale(0.3) rotate(170deg);
            transform: scale(0.3) rotate(170deg);
  }
  50% {
    -webkit-transform: scale(0.4) rotate(180deg);
            transform: scale(0.4) rotate(180deg);
  }
  90% {
    -webkit-transform: scale(0.1) rotate(340deg);
            transform: scale(0.1) rotate(340deg);
  }
  95% {
    -webkit-transform: scale(0.2) rotate(350deg);
            transform: scale(0.2) rotate(350deg);
  }
  100% {
    -webkit-transform: scale(0.1) rotate(360deg);
            transform: scale(0.1) rotate(360deg);
  }
}

@keyframes kira4 {
  0% {
    -webkit-transform: scale(0.1) rotate(0);
            transform: scale(0.1) rotate(0);
  }
  40% {
    -webkit-transform: scale(0.4) rotate(160deg);
            transform: scale(0.4) rotate(160deg);
  }
  45% {
    -webkit-transform: scale(0.3) rotate(170deg);
            transform: scale(0.3) rotate(170deg);
  }
  50% {
    -webkit-transform: scale(0.4) rotate(180deg);
            transform: scale(0.4) rotate(180deg);
  }
  90% {
    -webkit-transform: scale(0.1) rotate(340deg);
            transform: scale(0.1) rotate(340deg);
  }
  95% {
    -webkit-transform: scale(0.2) rotate(350deg);
            transform: scale(0.2) rotate(350deg);
  }
  100% {
    -webkit-transform: scale(0.1) rotate(360deg);
            transform: scale(0.1) rotate(360deg);
  }
}

.cnt-hide {
  display: none;
}

.blur {
  filter: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg"><filter id="filter"><feGaussianBlur stdDeviation="6" /></filter></svg>#filter');
  -webkit-filter: blur(6px);
          filter: blur(6px);
}


.footer {
  position: relative;
  margin-top: 30px;
  width: 414px;
  border-top: 2px solid #525252;
  background: #191919 url(../img/bg-footer.png) center top no-repeat;
  -webkit-background-size: contain;
          background-size: contain;
  text-align: center;
}

.footer .footer-inner {
  padding: 20px 0;
}

.footer .btn-site {
  margin: 0 auto;
  width: 240px;
}

.footer .btn-site img {
  width: 100%;
}

.footer .text-note {
  margin-top: 10px;
  color: #fff;
  font-size: 12px;
  font-size: 1.2rem;
}

.footer .copyright {
  margin-top: 10px;
  color: #fff;
  font-size: 12px;
  font-size: 1.2rem;
}


.page-top {
  position: fixed;
  right: 50%;
  bottom: 20%;
  z-index: 100;
  display: none;
  margin-right: -195px;
  width: 54.5px;
}

.page-top img {
  width: 100%;
}

.hdg-l1 {
  font-size: 24px;
  font-size: 2.4rem;
}

.hdg-l2 {
  position: relative;
  margin: 0 auto;
  width: 414px;
  background: url(../img/bg-hdg.png) repeat-x center top;
  -webkit-background-size: 217px 55px;
          background-size: 217px 55px;
  -webkit-box-shadow: 0 2px 5px 1px rgba(0, 0, 0, 0.5);
          box-shadow: 0 2px 5px 1px rgba(0, 0, 0, 0.5);
}


.hdg-l2 .hdg-inner {
  display: block;
  padding: 14px 0;
  background: url(../img/bg-hdg-l2.png) no-repeat center top;
  -webkit-background-size: 340px 55px;
          background-size: 340px 55px;
}

.hdg-l3 {
  color: #fff;
  font-size: 24px;
  font-size: 2.4rem;
}

.list-sns {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  text-align: center;
  -js-display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.list-sns li {
  margin-left: 20px;
  width: 68px;
}

.list-sns li:first-child {
  margin-left: 0;
}

.list-sns li a {
  display: block;
}

.list-sns li a img {
  width: 100%;
}


.list-ts li {
  margin-left: 10px;
  text-align:center;
}

.list-ts li:first-child {
  margin-left: 0;
}

.list-dl {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -js-display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.list-dl li {
  margin-left: 10px;
}

.list-dl li:first-child {
  margin-left: 0;
}

.list-bullet {
  font-size: 20px;
  font-size: 2rem;
}

.list-bullet li {
  position: relative;
  margin-top: 5px;
  padding-left: 14px;
}

.list-bullet li:before {
  position: absolute;
  top: 0;
  left: 0;
  content: "・";
}

.list-bullet li:first-child {
  margin-top: 0;
}

.list-notes {
  font-size: 20px;
  font-size: 2rem;
}

.list-notes li {
  position: relative;
  margin-top: 5px;
  padding-left: 15px;
}

.list-notes li:before {
  position: absolute;
  top: 0;
  left: 0;
  content: "※";
}

.list-notes li:first-child {
  margin-top: 0;
}

.list-num li {
  position: relative;
  margin-top: 10px;
  padding-left: 28px;
}

.list-num li span {
  position: absolute;
  top: 0;
  left: 0;
  content: "・";
}

.list-num li:first-child {
  margin-top: 0;
}


.slick-dotted.slick-slider {
  margin-bottom: 0;
}

@media (min-width: 414px){
  /*414~*/

  .body-inner{
    margin: 0 auto;
    width: 414px;
    -webkit-box-shadow: 0px 0 10px 1px rgba(0, 0, 0, 0.5);
            box-shadow: 0px 0 10px 1px rgba(0, 0, 0, 0.5);
  }

  .title img {  width: 50%;}

.list-ts img {  width: 100%;}
.visual .visual-inner .list-ts li {
  width: 414px;
}

	.visual .visual-inner .visual-youtube{
	top: 0px;
    right: 50px;
    width: 90px;
	position:fixed;z-index:1000;
}

  .hdg-l2 .hdg-inner img{
    width: 80%;
	
  }
	
.hdg-l2 .p1 img{ width: 40%;}
.hdg-l2 .p3 img{ width: auto;}

.footer .footer-inner {
  padding: 20px 0 10px;
}


}

@media (min-width: 828px){
  /*828~*/
section{width:100%;margin:0 auto 8vw auto;}
section:before {
    width: 100%;height: 13vw;
	background-size:100%;
    bottom: -2vw;
}
section:after {
    width: 100%; height: 13vw;
	background-size:100%;
    top: -2vw;
}

html{
    font-size: 62.5%;
  }

  body{
    overflow-x: hidden;
  }

  a:hover{
    opacity: .8;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
  }

  .sec .sec-inner{
    width: 828px;
  }

  .header{
    width: 100%;
    -webkit-box-shadow: 0 2px 5px 1px rgba(0, 0, 0, 0.5);
            box-shadow: 0 2px 5px 1px rgba(0, 0, 0, 0.5);
  }

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

  .header .logo-capcom{
    width: 104px;
  }

  .body-inner{
    width: auto;
    -webkit-box-shadow: none;
            box-shadow: none;
  }

  .bg-body .bg-body-origin{
    background: url(../img/bg-visual-pc.jpg) no-repeat center top;
    -webkit-background-size: cover;
            background-size: cover;
  }

  .bg-body .bg-body-blur{
    display: block;
    background: url(../img/bg-visual-blur-pc.jpg) no-repeat center top;
    -webkit-background-size: cover;
            background-size: cover;
  }

  .sec{
    margin-top: 100px;
  }

  .visual .visual-inner{
    margin-bottom: 130px;
    max-width: 1200px;
    width: 100%;
    height: 800px;
    background: none;
    -webkit-background-size: cover;
            background-size: cover;
  }

  .visual .visual-inner .visual-item{
    position: absolute;
    display: block;
  }
  .visual .visual-inner .visual-youtube{
    top: 10px;
    right: 50px;
    width: 90px;
	z-index: 2;
  }
  .visual .visual-inner .visual-logo{
    top: 58px;
    left: 5px;
    width: 320px;
	z-index: 2;
  }

  .visual .visual-inner .visual-date{
    bottom: -280px;
    left: 50%;
    margin-left: -345px;
  }

  .visual .visual-inner .visual-catch-01{
    top: 0px;
    right: 0;
    z-index: 1;
  }

  .visual .visual-inner .visual-catch-02{
    top: 750px;
    left: 50%;
    margin-left: -434px;
    width: 910px;
  }

  .visual .visual-inner .list-dl{
    display: none;
  }

  /*.sec-counter{
    margin-top: 0;
  }*/

  .sec-counter .sec-inner{
    max-width: 1179px;
    width: 100%;
  }

  .sec-counter .image{
    position: relative;
    height: 1284px;
  }

  .sec-counter .image img{
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -550px;
    width: 1179px;
    height: 1284px;
  }

  /*.sec-counter .cnt-inner{
    top: 90px;
  }

  .sec-counter .cnt-deco{
    top: 226px;
  }

  .sec-counter .cnt-failed{
    top: 90px;
  }

  .sec-sns-top{
    margin-top: 20px;
  }

  .sec-movie{
    margin-top: 85px;
  }

  .sec-movie .hdg-l2 .hdg-inner{
    padding: 32px 0;
  }

  .sec-movie .movie{
    width: 736px;
  }

  .sec-movie .movie{
    margin-top: 54px;
  }
*/
  .sec-original .sec-inner{
    max-width: 1024px;
    width: 100%;
  }

  .sec-original .sec-inner .image{
    position: relative;
    height: 1163px;
  }

  .sec-original .sec-inner .image img{
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -464px;
    width: 1024px;
    height: 1163px;
  }

  .sec-original .sec-inner .caroucel{
    margin: 60px auto 0;
    width: 828px;
  }

  .sec-original .img-original-01{
    width: 128px;
  }

  .sec-original .img-original-02, .sec-original .img-original-04, .sec-original .img-original-06{
    width: 611px;
  }

  .sec-original .img-original-02, .sec-original .img-original-04, .sec-original .img-original-06{
    margin-top: 40px;
  }

  .sec-original .img-original-03, .sec-original .img-original-05{
    width: 737px;
  }

  .sec-original .img-original-03, .sec-original .img-original-05{
    margin: 60px auto 40px;
  }

  .sec-dl{
    margin-top: 60px;
  }

  .sec-dl .hdg-l3{
    width: 524px;
  }

  .sec-sns-bottom{
    margin-top: 60px;
  }

  .sec-note .image{
    width: 737px;
  }

  .sec-note .image{
    margin-top: 40px;
  }

  .sec-note .list-bullet{
    margin-top: 10px;
  }

  .box{
    width: 730px;
  }

  .box .list-notes{
    margin-top: 10px;
  }

  .cnt-failed{
    margin-left: -382px;
    width: 764px;
  }

  .cnt-clear{
    top: 50px;
    margin-left: -361px;
    width: 722px;
  }

  .cnt-clear .deco-clear:before{
    top: 78px;
    left: 141px;
  }

  .cnt-clear .deco-clear:after{
    left: 456px;
  }


  .cnt-inner{
    height: 132px;
  }

  .cnt-inner{
    z-index: 1;
    margin-right: -400px;
  }


  .footer{
    margin-top: 60px;
    width: 100%;
  }

  .footer .btn-site{
    width: 480px;
  }

  .page-top{
    right: 10px;
    margin-right: 0;
    width: 80px;
  }

  .hdg-l2{
    width: 100%;
    -webkit-background-size: auto auto;
            background-size: auto;
  }

  .clear{
    width: 100%;
	left: 0;
	min-height:53px;
    -webkit-background-size: auto auto;
            background-size: auto;
  }
  .hdg-l2 .hdg-inner{
    padding: 30px 0;
    -webkit-background-size: auto auto;
            background-size: auto;
  }

  .hdg-l2 .hdg-inner img{
    width: auto;
  }


  .list-bullet li{
    margin-top: 8px;
    padding-left: 20px;
  }

  .list-notes li{
    padding-left: 24px;
  }
 .title img {  width: 50%;}
	
 .list-ts img {  width: 46%; }

section{ position:relative; color: #FFFFFF; text-shadow:1px 1px 1px #2f2645;z-index: 1;
    background: url(../img/bg_sec_center.png) repeat-y top center;
}
	
}

@media (max-width: 828px) and (orientation: landscape){
  /*~828*/
    .title img {  width: 50%;}
 .list-ts img {  width: 46%; }

}

@media (min-width: 1000px){
  /*~1000*/
.visual .visual-inner{
    margin-bottom: 0;
  }

  .visual .visual-inner .visual-date{
    bottom: 60px;
    left: 10px;
    margin-left: 0;
    width: 490px;
  }

  .visual .visual-inner .visual-catch-02{
    top: 555px;
    right: 102px;
	z-index: 1;
    left: auto;
    width: 880px;
  }
    .title img {  width: 50%;}
 .list-ts img {  width: 46%; }

}

@media (min-width: 1200px){
  /*1200~*/
.visual .visual-inner{
    margin-bottom: 100px;
    max-width: 1200px;
    width: 100%;
    height: 800px;
    background: none;
    -webkit-background-size: cover;
            background-size: cover;
  }

  .visual .visual-inner .visual-item{
    position: absolute;
    display: block;
  }

  .visual .visual-inner .visual-logo{
    top: 20px;
    left: 0;
  }

  .visual .visual-inner .visual-date{
    bottom: 0;
    left: 10px;
    width: 600px;
  }

  .visual .visual-inner .visual-catch-02{
    top: 215px;
    right: 130px;
	z-index: 1;
    left: auto;
    margin-left: 0x;
    width: 1020px;
  }

  .caroucel .slick-prev{
    left: -42px;
  }

  .caroucel .slick-next{
    right: -42px;
  }
    .title img {  width: 50%;}
	
  .visual .visual-inner .visual-logo{ width: 420px;  }
  .visual .visual-inner .visual-catch-01{ top: 0p  right: 100px;  }
  .visual .visual-inner .visual-catch-02{ top: 500px; }
   .list-ts img {  width: 46%; }

}

@media (min-width: 1550px){
  /*~1550*/

.header .header-inner{
    max-width: 1550px;
  }

  .visual .visual-inner{
    max-width: 1550px;
  }

  .visual .visual-inner .visual-logo{
    left: 20px;
  }

  .visual .visual-inner .visual-date{
    bottom: 0;
    left: 50px;
    width: auto;
  }
  .visual .visual-inner .visual-logo{ width: 520px;  }
  .visual .visual-inner .visual-catch-01{ top: 0px; right: 300px; }
  .visual .visual-inner .visual-catch-02{ top: 500px; right: 252px; z-index: 1; left: auto;width: auto;}


  .page-top{
    right: 50%;
    margin-right: -760px;
  }
    .title img {  width: 50%;}
	 .list-ts img {  width: 46%; }

}

@media (min-width: 1900px){
.visual .visual-inner .visual-date{
    bottom: 10px;
    left: 20px;
  }

  .visual .visual-inner .visual-logo{ width: 520px;  }
  .visual .visual-inner .visual-catch-01{ top: 0px; right: 300px; }
  .visual .visual-inner .visual-catch-02{ top: 500px; right: 252px; z-index: 1; left: auto;width: auto;}
  .title img {  width: 50%;}
 .list-ts img {  width: 46%; }

}

@media (max-width: 568px) and (orientation: landscape){
.nav-contents .nav-list{
    -webkit-transform: scale(0.4);
        -ms-transform: scale(0.4);
            transform: scale(0.4);
    top: -17%;
  }

  .nav-contents .nav-list li{
    margin-top: 5px;
  }
 .list-ts img {  width: 46%; }

	
	
	
}


.list-ts li {padding:10px;}
.list-dl li {padding:10px;}


.title img {  width: 100%;}
.text-area h4{
	display:inline-block;position:relative; width:auto; margin:10px 0; font-size:3rem; color: #00fcff;
	-moz-border-radius:0.1m;	-webkit-border-radius:0.3em;	border-radius:0.1em; 
	/*background-color:rgba(5, 213, 330, 0.5); */
	padding:3px 28px; text-shadow:none;
	}
	
	h4 .arrow{ display:block; position:absolute; top:-10px; left:-18px;
	background:url(../img/arrow.png) no-repeat center top; width:50px; height:50px;}

.text-area .red{
	color:#F00;	font-weight:bold;
}

.text-area p{ line-height:3rem;}

.text-area span{ color:#006;}

.clear{
  position: absolute;
  width: 160px;
  height: 160px;
  background: url(../img/clear.png) no-repeat center top;
  -webkit-background-size: 160px 160px;
          background-size: 160px 160px;
  z-index:999;
  opacity: 0.8;
  filter: alpha(opacity=80);
	}


.underline{ padding-bottom:0.3em; margin-bottom: 0.3em; border-bottom:#2f2645 2px dotted;}

section{ color: #FFF; text-shadow:1px 1px 1px #2f2645;z-index: 1;}
/*section .inr_box {
	overflow: hidden; position:absolute; z-index: 1;
    background: url(../img/bg_sec_center.png) repeat-y top center;
}*/
section:before {
    content: ''; position:absolute; z-index: 0; display: block;
    background: url(../img/bg_sec_foot.png) no-repeat bottom center;
}
section:after {
    content: ''; position:absolute; z-index: 0; display: block;
	background: url(../img/bg_sec_head.png) no-repeat top center;
}

.p1 img{ width: auto;}
.p2 img{ width: auto;}
.p3 img{ width: auto;}
.p2 {margin-left: 0;}


*, *:before, *:after { -webkit-box-sizing: inherit; -moz-box-sizing: inherit; box-sizing: inherit; }
.logo_flash{ position: relative; margin: 0 auto; transition-duration: .5s; }
.logo_flash{ width: 291px; overflow: hidden; }
.logo_flash:before{
content:"";
position: absolute;
left: -665px;
top: -460px;
width: 291px;
height: 15px;
background-color: rgba(255,255,255,.5);
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);
-webkit-animation: searchLights .5s ease-in .5s infinite;
-o-animation: searchLights .5s ease-in .5s infinite;
animation: searchLights .5s ease-in .5s infinite;
}
@-webkit-keyframes searchLights {
0% { left: -100px; top: 0; }
to { left: 120px; top: 100px; }
}
@-o-keyframes searchLights {
0% { left: -100px; top: 0; }
to { left: 120px; top: 100px; }
}
@-moz-keyframes searchLights {
0% { left: -100px; top: 0; }
to { left: 120px; top: 100px; }
}
@keyframes searchLights {
0% { left: -100px; top: 0; }
to { left: 120px; top: 100px; }
}

#heart{
		    animation: breathe .5s infinite;
		}
		@keyframes breathe{
		  0%{ transform: scale(.99); }
		  50%{ transform: scale(1.03); }
		  100%{ transform: scale(.99); }
		}


.event {
    border-radius:4px;
    -webkit-border-radius:4px;
    color:#00ff0c;
    font-size:12px;
    margin:0px 30px;
    padding:2px 0px;
}
 
@keyframes fade {
    from { opacity: 1.0; }
    50% { opacity: 0.4; }
    to { opacity: 1.0; }
}
 
@-webkit-keyframes fade {
    from { opacity: 1.0; }
    50% { opacity: 0.4; }
    to { opacity: 1.0; }
}
 
.blink {
    animation:fade 1000ms infinite;
    -webkit-animation:fade 1000ms infinite;
    text-align: center;

}

.reg-btn img{width:100%;height:auto}
.reg-btn {position:fixed;z-index:1000;right:1%;width:214px;margin-right:0;margin-left:auto;text-align:right;bottom:0}

@media all and (min-width: 480px) and (max-width: 759px){
	.reg-btn{
		right:calc(50% - 50vw);
		left:0;width:100%;
		max-width:400px;
		margin:0 auto}
	}
@media all and (max-width: 479px){
	.reg-btn{
		right:calc(50% - 50vw);
		left:0;width:100%;
		max-width:400px;
		margin:0 auto;
	}
}
.reg-btn img{max-width:100%}

@media all and (min-width: 960px){.reg-btn img{max-width:215px}}

.showSp{display:none}
@media all and (min-width: 480px) and (max-width: 759px){
	.showSp{display:block}
}
@media all and (max-width: 479px){
	.showSp{display:block}
}

.showPc{display:none}
@media all and (min-width: 960px){
	.showPc{display:block}
}
@media all and (min-width: 760px) and (max-width: 959px){
	.showPc{display:block}
}