@media screen and (max-width: 540px){
	html{font-size:calc(100vw / 540)}
}
@media screen and (min-width: 541px){
	.sp-only{display:none}
}
@media screen and (max-width: 540px){
	.pc-only{display:none}
}
.overlay.hide{transition:opacity 1.2s ease-out;transition-delay:1.2s;opacity:0;pointer-events:none}
header{position:relative;overflow:hidden;height:720rem}
header .hero-container{position:relative;width:100%;height:680rem;overflow:hidden}
header .hero{width:100%;height:100%;object-fit:cover;object-position:center 75%}
header .noise{position:absolute;left:0;top:0;width:100%;height:100%;background-image:url(../image/noise.gif)}
header .title{position:absolute;left:calc((100% - 960rem)/2);top:30%;width:600rem;height:auto;transform:translateY(-50%)}
header .wave{position:absolute;left:0;bottom:0;width:100%;height:320rem;background-image:url(../image/ar_wave.svg);background-repeat:repeat-x;background-size:auto 100%;background-position:center}
@media screen and (max-width: 540px){
	header{height:480rem}
	header .hero-container{height:460rem}
	header .title{width:calc(100vw - 80rem);left:40rem}
	header .wave{height:160rem}
}
@media screen and (min-width: 541px) and (max-width: 1024px){
	header .title{left:80rem}
}
section{max-width:960rem;margin:0 auto 120rem;color:var(--color-primary);font-family:var(--font-family-noto-sans-jp)}
section h2{font-size:40rem;font-weight:var(--font-weight-bold);line-height:1.5;margin-bottom:20rem}
@media screen and (min-width: 541px) and (max-width: 1024px){
	section{max-width:calc(100vw - 160rem)}
}
@media screen and (max-width: 540px){
	section{max-width:calc(100vw - 80rem)}
}
section.contest span{font-size:20rem;font-weight:var(--font-weight-medium);line-height:2}
section.contest img{margin-top:20rem;transition:var(--transition-btn-off)}
section.contest img:hover{opacity:.8}
section.concept{position:relative;top:-80rem;margin:0 auto 40rem}
section.concept span{font-size:20rem;font-weight:var(--font-weight-medium);line-height:2}
@media screen and (max-width: 540px){
	section.concept{top:-60rem;margin:0 auto 60rem}
}
section.howto ul{margin-bottom:20rem;counter-reset:list-counter}
section.howto ul li{display:flex;align-items:flex-start;font-size:20rem;font-weight:var(--font-weight-medium);line-height:2;counter-increment:list-counter}
section.howto ul li:before{content:counter(list-counter,decimal) "．";flex-shrink:0}
section.howto ul.caution li{font-size:16rem;font-weight:var(--font-weight-medium);line-height:1.5;margin-bottom:10rem}
section.howto ul.caution li:before{content:"※";margin-right:5rem}
section.realsize{margin:0 auto 80rem}
section.realsize>span,section.miniature>span{font-size:20rem;font-weight:var(--font-weight-medium);line-height:2}
section.realsize>span.caution,section.miniature>span.caution{display:block;font-size:16rem;line-height:1.5;margin-top:8rem}
section.realsize .item-container,section.miniature .item-container{display:flex;gap:40rem;margin:40rem 0}
section.realsize .item-container .item,section.miniature .item-container .item{padding:20rem 40rem 40rem;border-radius:40rem;background-color:#f0f0f3;overflow:hidden}
section.realsize .item-container .item .qr-container,section.miniature .item-container .item .qr-container{display:flex;gap:20rem;flex-direction:row;align-items:center;padding:20rem;height:160rem;border-radius:20rem;background-color:#fff;overflow:hidden}
section.realsize .item-container .item .qr-container img,section.miniature .item-container .item .qr-container img{height:auto}
section.realsize .item-container .item .qr-container span,section.miniature .item-container .item .qr-container span{flex:1;font-size:20rem;font-weight:var(--font-weight-bold);text-align:center}
section.realsize .item-container .item .qr-container span .small,section.miniature .item-container .item .qr-container span .small,section.realsize .item-container .item .btn-container a .small,section.miniature .item-container .item .btn-container a .small{font-size:16rem}
section.realsize .item-container .item .btn-container a,section.miniature .item-container .item .btn-container a{display:flex;flex-direction:column;justify-content:center;position:relative;border-radius:48rem;width:100%;height:96rem;background:#fff;border:none;box-shadow:var(--box-shadow-detail-btn-base);transition:var(--transition-btn-off);cursor:pointer;color:#1c77ff;font-size:20rem;font-family:var(--font-family-noto-sans-jp);font-weight:var(--font-weight-bold);text-align:center;padding:0 32rem;line-height:1.25}
section.realsize .item-container .item .btn-container a:after,section.miniature .item-container .item .btn-container a:after{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:calc(100% - 16rem);height:calc(100% - 16rem);box-shadow:var(--box-shadow-detail-btn-inner);border-radius:40rem;box-sizing:border-box;border:3rem solid transparent;background:linear-gradient(165deg,#0047ff,#0094ff) border-box;-webkit-mask:linear-gradient(#fff 0 0) padding-box,linear-gradient(#fff 0 0) border-box;-webkit-mask-composite:destination-out;mask:linear-gradient(#fff 0 0) padding-box,linear-gradient(#fff 0 0) border-box;mask-composite:exclude;opacity:.6}
@media screen and (min-width: 541px){
  section.realsize .item-container .item,
  section.miniature .item-container .item{
    overflow: hidden;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    padding: 20rem 40rem 0 0;
  }
  section.realsize .item-container .item > img,
  section.miniature .item-container .item > img{width: 57%;margin-left: -2%;}
  section.realsize .item-container .item .qr-container,
  section.miniature .item-container .item .qr-container{width: 45%;}
}
@media screen and (max-width: 540px){
	section.realsize .item-container,section.miniature .item-container{flex-direction:column}
}
section.back{margin:0 auto 64rem;overflow:visible}
section.back button{position:relative;display:block;border-radius:38rem;width:180rem;height:76rem;margin:0 auto;background:#fff;border:none;box-shadow:var(--box-shadow-detail-btn-base);cursor:pointer;color:#1c77ff;font-size:18rem;line-height:76rem;font-family:var(--font-family-noto-sans-jp);font-weight:var(--font-weight-medium);text-align:center}
section.back button:hover{box-shadow:var(--box-shadow-detail-btn-base-hover);transition:var(--transition-btn-on)}
section.back button:after{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:164rem;height:60rem;box-shadow:var(--box-shadow-detail-btn-inner);border-radius:30rem;box-sizing:border-box;border:3rem solid transparent;background:linear-gradient(165deg,#0047ff,#0094ff) border-box;-webkit-mask:linear-gradient(#fff 0 0) padding-box,linear-gradient(#fff 0 0) border-box;-webkit-mask-composite:destination-out;mask:linear-gradient(#fff 0 0) padding-box,linear-gradient(#fff 0 0) border-box;mask-composite:exclude;opacity:.6}
footer{position:relative;display:flex;align-items:flex-end;width:100%;height:90rem;margin-bottom:0;background-color:var(--color-dark-blue)}
footer .container{display:flex;align-items:center;flex-wrap:wrap;width:100%;height:100%;padding:20rem}
footer span{margin-right:12rem;color:var(--color-text);font-family:var(--font-family-noto-sans-jp);font-weight:var(--font-weight-medium);font-size:12rem;text-align:center;white-space:nowrap}
footer span.only_pc{display:inline}
footer span.copyright{margin-right:24rem}
footer span.cookie_setting,footer span.terms_of_use{cursor:pointer}
@media screen and (max-width: 540px){
	footer{height:128rem}
	footer .container{flex-direction:column;align-items:flex-start;justify-content:center;gap:8rem;height:100%;padding:0 32rem}
	footer .container div{display:block}
	footer span{font-size:16rem;line-height:1.25}
}

/* .l-cookie
================================================== */
.l-cookie {
  position: fixed;
  z-index: 9999;
  left: 0;
  bottom: 0;
  width: 100%;
  background: rgba(245, 245, 245, 0.95);
  box-sizing: border-box;
	color: rgb(51, 51, 51);
}
.l-cookie__inner {
  padding: 24px 20px;
  box-sizing: border-box;
}
.l-cookie__txt {
  line-height: 1.5;
  font-size: 11px;
  letter-spacing: .04em;
}
.l-cookie a {
  display: inline-block;
	text-decoration: underline;
	color: rgb(51, 51, 51);
}
.l-cookie a:hover{
	text-decoration: none;
}
.l-cookie__btns {
  display: flex;
  flex-wrap: wrap;
  margin: 15px -5px 0;
}
.l-cookie button {
  line-height: 1.5;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  width: calc(50% - 10px);
  min-height: 32px;
  margin: 0 5px;
  border: 1px solid rgba(0, 115, 101);
  box-sizing: border-box;
  border-radius: 3px;
  background-color: #fff;
  color: rgba(0, 115, 101);
  font-size: 13px;
  text-align: center;
  letter-spacing: .04em;
}
.l-cookie button.l-cookie__accept {
  background-color: rgba(0, 115, 101);
  color: #fff;
}
@media all and (min-width: 768px) {
  .l-cookie__inner {
    display: flex;
    align-items: center;
    max-width: 1400px;
    width: calc(100% - 120px);
    margin: 0 auto;
    padding: 24px 0;
  }
  .l-cookie__txt {
		font-size: 16px;
  }
  .l-cookie__btns {
    min-width: 340px;
    width: 340px;
    margin: 15px -5px 0 20px;
  }
  .l-cookie button {
    position: relative;
    min-height: 44px;
		font-size: 18px;
    z-index: 1;
    overflow: hidden;
    transition: all 0.3s ease;
  }
  .l-cookie button:before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: -2px;
    left: 0;
    background-color: rgba(245, 245, 245);
    z-index: -1;
    pointer-events: none;
    transform-origin: left top;
    transform: scale(0, 1);
    transition: transform 0.3s ease;
  }
  .l-cookie button:hover:before {
    transform: scale(1, 1);
  }
  .l-cookie button.l-cookie__accept:before {
    background-color: rgba(0, 96, 84);
  }
  .l-cookie button.l-cookie__accept:hover {
    border-color: rgba(0, 96, 84);
  }
}


