@charset "utf-8";

.page-contents {
  margin: 0 auto;
}

.page-contents h3 {
	width:600px;
	margin:20px auto;
}

.page-contents h3 img {
	width:100%;
}

.page-contents-inner{
	width:700px;
	margin:0 auto 40px;
	text-align: center;
}

.point-step {
	width:700px;
	margin:0 auto;
	text-align: center;
}

.point-step dl {
	width:700px;
	margin:10px auto;
	position:relative;
}

.point-step dt {
	width:100%;
}

.point-step dt img {
	width:100%;
}

.point-step dd {
	width:100%;
	position:absolute;
	top:0;
	left:200px;
}

.point-step dd img {
	width:180px;
}

ul.attention {
	width:600px;
	font-size:14px;
	margin:20px auto 60px;
	text-align: left;
	padding-left: 6em;
}

ul.attention li {
	text-indent: -1em;
	padding-left:1em;
}

.app_DL_container {
	width:100%;
	background-color: #ffebed;
	padding:20px 0 40px;
}

.app_DL_inner {
	width:700px;
	margin:0 auto;
	text-align: center;
}


dl.id_container {
	width:660px;
	margin:40px auto;
}

dl.id_container dt {
	font-size:20px;
	font-weight:bold;
	width:100%;
}

dl.id_container dd {
	width:100%;
}

dl.id_container　dd img {
	width:100%;
}

.recommend-container {
	width:600px;
	margin:40px auto;
	text-align: center;
}

.recommend-container ul {
	width:600px;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
}

.recommend-container li {
	width:48%;
}
.recommend-container li img {
	width:100%;
}

.kirari-img {
	position :relative;
	overflow :hidden;
	width: 190px;
    border-radius: 50%;
    left: 260px;
}

.kirari {
height:100%;
width:30px;
position:absolute;
top:-180px;
left:0;
/*background-color: #fff;
opacity:0;
transform: rotate(45deg);
animation: reflection 2s ease-in-out infinite;
-webkit-transform: rotate(45deg);
-webkit-animation: reflection 2s ease-in-out infinite;
-moz-transform: rotate(45deg);
-moz-animation: reflection 2s ease-in-out infinite;
-ms-transform: rotate(45deg);
-ms-animation: reflection 2s ease-in-out infinite;
-o-transform: rotate(45deg);
-o-animation: reflection 2s ease-in-out infinite;
}
@keyframes reflection {
0% { transform: scale(0) rotate(45deg); opacity: 0; }
30% { transform: scale(0) rotate(45deg); opacity: 0.5; }
31% { transform: scale(4) rotate(45deg); opacity: 1; }
100% { transform: scale(50) rotate(45deg); opacity: 0; }
}
@-webkit-keyframes reflection {
0% { -webkit-transform: scale(0) rotate(45deg); opacity: 0; }
30% { -webkit-transform: scale(0) rotate(45deg); opacity: 0.5; }
31% { -webkit-transform: scale(4) rotate(45deg); opacity: 1; }
100% { -webkit-transform: scale(50) rotate(45deg); opacity: 0; }
}
@-moz-keyframes reflection {
0% { -moz-transform: scale(0) rotate(45deg); opacity: 0; }
30% { -moz-transform: scale(0) rotate(45deg); opacity: 0.5; }
31% { -moz-transform: scale(4) rotate(45deg); opacity: 1; }
100% { -moz-transform: scale(50) rotate(45deg); opacity: 0; }*/
}