@charset "utf-8";
* {
  box-sizing: border-box;
}
img {
  max-width: 100%;
  height: auto;
  -ms-interpolation-mode: bicubic;
  vertical-align: bottom;
}
html {
  -webkit-text-size-adjust: 100%;
  font-size: 62.5%;
}
body {
  line-height: 1.5;
  font-size: 1.4rem;
  color: #333333;
}
body, main, section, h1, h2, h3, p, ul, li, dl, dd, figure {
  margin: 0;
  padding: 0;
}
.headTitleBox {
  margin-bottom: 0;
}
.contentsWrap {
  width: 100%;
}
.oneContents .contentsWrap #main {
  width: 100%;
}
#main {
  padding: 0;
}
/*==========*/
#footerLink {
  margin-top: 0;
}
/*=====main=====*/
.pcOnly {
  display: none;
}
.main-inner {
  background: url("../images/idx_bg01.webp") no-repeat,url("../images/idx_bg03.webp") no-repeat,url("../images/idx_bg02.webp") no-repeat;
  background-size: 100%,100%,100%;
  background-position: left top,left bottom,left 25%;
}
.contents01 {
	padding-top: 13%;
	text-align: center;
}
.contents01 h2 {
  	margin: 0 6%;
}
.sub-inner {
	margin-top: 27%;
	position: relative;
}
.sub-readText {
	margin: 0 3%;
	position: relative;
}
.sub-readText::before {
	width: 10%;
	height: 25%;
	content: "";
	background: url("../images/idx_im05.webp") no-repeat;
	background-size: 100%;
	position: absolute;
	top: 0;
	right: 2%;
	animation: star-flashing-before 3s infinite;
}
.sub-readText::after {
	width: 8%;
	height: 25%;
	content: "";
	background: url("../images/idx_im06.webp") no-repeat;
	background-size: 100%;
	position: absolute;
	top: 75%;
	left: 0;
	animation: star-flashing-after 3s infinite;
}
.pointWrap {
	margin-top: 11%;
	position: relative;
	padding-bottom: 180%;
}
.pointWrap figure {
	width: 55%;
	transform: rotate(-8deg)!important;
	position: absolute;
	z-index: 1;
	left: 20%;
	top: 31%;
}
.point01 {
	background: url("../images/idx_bg04.webp") no-repeat;
	background-size: 100%;
	padding: 7% 8% 16% 9%;
	width: 80%;
	z-index: 1;
	position: absolute;
	left: 10%;
	top: 0;
}
.btnLink {
	margin-top: 5%;
}
.point02 {
	background: url("../images/idx_bg05.webp") no-repeat;
	background-size: 100%;
	padding: 7% 2% 9% 4%;
	z-index: 2;
	position: absolute;
	width: 37%;
	right: 3%;
	top: 55%;
}
.point03 {
	background: url("../images/idx_bg06.webp") no-repeat;
	background-size: 100%;
	padding: 13% 9% 5%;
	z-index: 2;
	position: absolute;
	width: 95%;
	left: 3%;
	bottom: 0;
}
.star-flashing {
	width: 100%;
	height: 100%;
	position: absolute;
}
.star-flashing::before {
	width: 85%;
	height: 100%;
	content: "";
	background: url("../images/idx_im01.webp") no-repeat;
	background-size: 100%;
	position: absolute;
	top: 42%;
	left: 5%;
	animation: star-flashing-before 3s infinite;
}
@keyframes star-flashing-before {
	0% {
		opacity: 1;
	}
	50% {
		opacity: 0;
	}
	60% {
		opacity: 1;
	}
	90% {
		opacity: 0;
	}
	95% {
		opacity: 1;
	}
}
.star-flashing::after {
	width: 88%;
	height: 100%;
	content: "";
	background: url("../images/idx_im02.webp") no-repeat;
	background-size: 100%;
	position: absolute;
	top: 38%;
	left: 5%;
	animation: star-flashing-after 3s infinite;
}
@keyframes star-flashing-after {
	0% {
		opacity: 0;
	}
	60% {
		opacity: 1;
	}
	70% {
		opacity: 0
	}
	80% {
		opacity: 1;
	}
	85% {
		opacity: .3;
	}
	90% {
		opacity: 1;
	}
	100% {
		opacity: 0;
	}
}

.contents02 {
  margin-top: 66%;
  padding: 0 4% 10%;
  overflow: hidden;
}
.box figure {
	margin: 6% -22% 0 20%;
}
.btnArea {
  margin: -35% 0 5%;
}
.btnArea p:nth-of-type(n+2) {
  margin: 3% 0 0;
}
.attention {
  color: #fff;
  font-size: 1.2rem;
}
.recomend h2 {
  padding: 4% 13%;
  background-color: #fff;
  font-size: 0;
}
.recomend ul li {
  width: 100%;
}
/*=====mediaQuery=====*/
@media screen and (min-width:751px), print {
  .pcOnly {
    display: inline-block;
  }
  .spOnly {
    display: none;
  }
  #main {
    background-image: linear-gradient(-45deg, #f0f0f0 25%, #f6f6f6 25%, #f6f6f6 50%, #f0f0f0 50%, #f0f0f0 75%, #f6f6f6 75%, #f6f6f6);
    background-size: 15px 15px;
  }
  #main h1 , #main .date{
    text-align: center;
  }
.main-inner {
    width: 1000px;
    margin: 0 auto;
    background: url("../images/idx_bg01_pc.webp") no-repeat,url("../images/idx_bg03_pc.webp") no-repeat,url("../images/idx_bg02_pc.webp") no-repeat;
	background-position: left top,left 1382px,left 270px;
}
.contents01 {
	padding-top: 60px;
}
.contents01 h2 {
  	margin: 0 auto;
	width: 424px;
}
.sub-inner {
	margin: 120px 0 30%;
	position: relative;
}
.sub-readText {
	margin: 0 auto;
	width: 478px;
	position: relative;
}
.pointWrap {
	margin-top: 65px;
	padding-bottom: 590px;
}
.pointWrap figure {
	width: 290px;
	transform: rotate(11.5deg)!important;
	left: 540px;
	top: 170px;
}
.point01 {
	background: url("../images/idx_bg04_pc.webp") no-repeat;
	background-size: 100%;
	padding: 35px 60px 20px 40px;
	width: 363px;
	left: 324px;
	top: 0;
}
.btnLink {
	margin-top: 15px;
}
.point02 {
	background: url("../images/idx_bg05_pc.webp") no-repeat;
	background-size: 100%;
	padding: 40px 25px 40px 15px;
	width: 185px;
	left: 326px;
	top: 260px;
}
.point03 {
	background: url("../images/idx_bg06_pc.webp") no-repeat;
	background-size: 100%;
	padding: 30px 85px 30px 60px;
	width: 510px;
	left: 65px;
	bottom: 0;
}
.star-flashing::before {
	width: 755px;
	background: url("../images/idx_im01_pc.webp") no-repeat;
	top: 320px;
	left: 130px;
}
.star-flashing::after {
	width: 771px;
	background: url("../images/idx_im02_pc.webp") no-repeat;
	top: 225px;
	left: 140px;
}

.contents02 {
  margin: 360px auto 0;
  padding: 0 0 45px;
}
.tx {
	width: 530px;
	margin: 0 auto 20px;
}
.box figure {
	width: 460px;
	margin: 0 auto 0 365px;
}
  .btnArea {
    width: 400px;
    margin: -190px auto 30px;
  }
  .btnArea p + p {
    margin: 20px 20px 0;
  }
  .attention {
    margin: 0 110px 0;
    font-size: 1.5rem;
    text-align: left;
  }
  .recomend {
    width: 1000px;
    margin: 0 auto;
  }
  .recomend h2 {
    text-align: center;
    padding: 13px 0;
  }
  .recomend h2 img {
    width: 400px;
  }
  .recomend ul {
    display: -webkit-flex;
    display: flex;
  }
  .recomend ul li {
    width: 100%;
  }
}