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

/* reset *************************************************************/
body {line-height:1; margin:0; font-family:arial,sans-serif;}
h1, h2, h3, h4, h5, h6, p {margin:0; font-size:100%; font-weight:normal; line-height:1.3;display:block;}
article,footer,header {display:block;}
ul,li {list-style:none; padding:0;margin:0;}
dl,dt,dd {padding:0; margin:0;}
table,tr,td {border:0;padding:0;margin:0;}
a {display:block;color:#ff6699;text-decoration:none;}
img {vertical-align:baseline; border:0; padding:0; margin:0;}
div {margin:0;padding:0;}
/* //reset *************************************************************/

*{
  box-sizing: border-box;
}
body {
  background: #333;
  font-family: sans-serif;
}
img {
  max-width: 100%;
  width: auto !important;
  height: auto !important;
  margin:0 auto;
  vertical-align: bottom;
}
#wrapper {
  background: #191a1c; /* Old browsers */
  background: -moz-linear-gradient(left, #191a1c 0%, #2c2a31 50%, #191a1c 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(left, #191a1c 0%,#2c2a31 50%,#191a1c 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to right, #191a1c 0%,#2c2a31 50%,#191a1c 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#191a1c', endColorstr='#191a1c',GradientType=1 ); /* IE6-9 */
  overflow-y: hidden;
  position: relative;
  text-align: center;
}

@media screen and (min-width: 751px) {
  body {font-size:24px;}
  #wrapper {width:750px;margin:auto;}
	
}
@media screen and (max-width: 750px) {
  body {font-size:14px;}
  #wrapper {width:100%;}
	
}
/******************************/

/******************************/
/*front*/
.top{
	position: relative;
  /*overflow-y: hidden;*/
}

.logo{
	position:absolute;
	top:0;
}

.top_front_main{
	position:absolute;
	top:8.87777%;
	width:65.06666666%;
	animation: top_front_main 1.3s linear 0s infinite;

}

@keyframes top_front_main {
  0%   { transform: scale(1.0, 1.0) translate(0%, 0%); }
  15%  { transform: scale(0.9, 0.9) translate(0%, 5%); }
  30%  { transform: scale(1.3, 0.8) translate(0%, 10%); }
  50%  { transform: scale(0.8, 1.3) translate(0%, -10%); }
  70%  { transform: scale(1.1, 0.9) translate(0%, 5%); }
  100% { transform: scale(1.0, 1.0) translate(0%, 0%); }
}


.top_front_sub{
	position:absolute;
	top:56.5555%;
	width:54.4%;
}


.top_woman01{
	position: absolute;
	top:61.099%;
	right:1.4%;
	width:24.13333333%;
}

.top_woman02{
	position: absolute;
	bottom:8%;
	right:1.4%;
	width:24.13333333%;
}
/******************************/

/******************************/
/*ボタン*/
.button{
	position: relative;
}

.button_front{
	position:absolute;
	top:4.833%;
	left:0;
	right:0;
	bottom:0;
	margin: auto;
	width:92%;
	z-index:9999;
}

@keyframes jello {
  11.1% {
    transform: none
  }
  22.2% {
    transform: skewX(-12.5deg) skewY(-12.5deg)
  }
  33.3% {
    transform: skewX(6.25deg) skewY(6.25deg)
  }
  44.4% {
    transform: skewX(-3.125deg) skewY(-3.125deg)
  }
  55.5% {
    transform: skewX(1.5625deg) skewY(1.5625deg)
  }
  66.6% {
    transform: skewX(-0.78125deg) skewY(-0.78125deg)
  }
  77.7% {
    transform: skewX(0.390625deg) skewY(0.390625deg)
  }
  88.8% {
    transform: skewX(-0.1953125deg) skewY(-0.1953125deg)
  }
  100% {
    transform: none
  }
}

.jello {
  animation: jello 2s infinite;
  transform-origin: center
}

.center {
  display: inline-block
}

.jello {
  animation: jello 2s infinite;
  transform-origin: center
}

.center {
  display: inline-block
}
/******************************/

/******************************/
/*sec01*/
#sec01{
	background: url(../img/section01_back.png) no-repeat;
	background-size: cover;
}
.sec01_back{
	position: relative;
	width:93.2%;
	padding-top:4%;
	margin:auto;
}

.sec01_title{
	position: absolute;
	top:5%;
	left:0;
	right:0;
	bottom:0;
	margin: auto;
	width:88.06666666666%;
}

.sec01_txt01{
	position: absolute;
	top:19.9555%;
	left:2.7%;
	width:55.507868333%;
}

.sec01_txt02{
	position: absolute;
	top:26.177%;
	left:5%;
	width:42.341044444%;
}

.sec01_txt03{
	position: absolute;
	top:51.177%;
	right:2%;
	width:48.783977111%;
}

.sec01_txt04{
	position: absolute;
	top:57.177%;
	right:3.9999999999%;
	width:46.924177396%;
}

.sec01_womanset{
	position: absolute;
	top:42.77777%;
	left:1.33333%;
	width:45.20744444%;
}

.sec01_txt05{
	position:absolute;
	bottom:18.99999%;
	left:3.2222%;
	width:55.078683834%;
}

.sec01_txt06{
	position:absolute;
	bottom:2.33333%;
	left:5%;
	width:46.638054363%;
}

.sec01_cat{
	position: absolute;
	right:2%;
	bottom:1.65%;
	width:40.915593705%;
}
/******************************/
#sec02{
	background: url(../img/section02_back.png)no-repeat;
	background-size: cover;
}

.sec02_back,.sec03_back{
	position: relative;
	width:93.2%;
	padding-top:4%;
	margin:auto;
}

.sec02_title{
	position:absolute;
	width: 93.419170243%;
	top:2%;
	left:0;
	right:0;
	margin: auto;
}

.sec02_txt01_main{
	position:absolute;
	top:11.99999%;
	left:0;
	right:0;
	margin: auto;
	width:81.11587%;
}

.sec02_txt01_img{
	position: absolute;
	top:17.5%;
	left:0;
	right:0;
	margin: auto;
	width:90.84444444%;
}

.sec02_txt01_sub{
	position: absolute;
	top:28.5%;
	left:0;
	right:0;
	margin: auto;
	width:83.690987124%;
}

.sec02_txt02_main,.sec02_txt02_img,.sec02_txt02_sub,
.sec02_txt03_main,.sec02_txt03_img,.sec02_txt03_sub,.three_triangle{
	position: absolute;
	top:0;
	left:0;
	right:0;
	margin: auto;
	
}

.sec02_txt02_main{
	top:37.333%;
	width:82.66666666666%;
}

.sec02_txt02_img{
	top:43.333%;
	width:92.9899999999%;
}

.sec02_txt02_sub{
	top:54.711%;
	width:69.814020028%;
}

.sec02_txt03_main{
	top:64.33%;
	width:79.1130185%;
}

.sec02_txt03_img{
	top:70%;
	width:92.9899999999%;
}

.three_triangle{
	top:83%;
	width:72.67532222%;
}
.sec02_txt03_sub{
	top:86%;
	width:92.9899999999%;
}

.seisi_top,.seisi_bottom{
	position: absolute;
}
.seisi_top{
	top:55.444%;
	right:0;
	width:18.666666666% ;
}

.seisi_bottom{
	top:63.755%;
	width:22.533333333333%;
}
/******************************/
#sec03{
	background: url(../img/section03_back.png)no-repeat;
	background-size:cover;
	position: relative;
}

.sec03_back{
	width:93.2%;
}
.sec03_txt01_main,.sec03_woman_left,.sec03_woman_right{
	position: absolute;
	top:0;
	left:0;
	right:0;
	margin: auto;
}


.sec03_txt01_main{
	top:4%;
	width:93.4190243%;
}

.sec03_woman_left{
	top:73%;
	right:48%;
	 width:46.499999%;
}

.sec03_point{
	position: absolute;
	bottom:47.38888%;
}

.sec03_woman_right{
	top:73%;
	left:48%;
	 width:46.499999%;
}

/******************************/

#footer {
  background-color: #27160d;
  color: #fff;
 padding: 2%;
	text-align: center;
}

#copyright{
	display: inline-block;
	font-size:1.77vh;
	
}