@import url("reset.css");
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap');

body{ width: 100%; margin: auto; font-family: "Noto Sans JP", sans-serif; background-color: #000;}

.clearfix { *zoom: 1;}
.clearfix:before,
.clearfix:after { display: table; line-height: 0; content: "";}
.clearfix:after { clear: both;}

.forPC{ display: block;}
.forSP{ display: none;}

p{ font-size: 14px; font-weight: normal; text-align: left; color: #000;}
p.indent-1 { padding-left:1em; text-indent:-1em;}
p.indent-15 { padding-left:1.5em; text-indent:-1.5em;}
a{ text-decoration: none; transition: .3s ease-in-out; -moz-transition: .3s ease-in-out; -webkit-transition: .3s ease-in-out; -o-transition: .3s ease-in-out; -ms-transition: .3s ease-in-out; outline: none; color: #595757; font-size: 14px;}
a:hover{ transition: .3s ease-in-out; -moz-transition: .3s ease-in-out; -webkit-transition: .3s ease-in-out; -o-transition: .3s ease-in-out; -ms-transition: .3s ease-in-out;}

.bg{ width: 100%; height: 100vh; background-image: url(../images/bg.jpg); background-size: cover; background-position: center; background-repeat: no-repeat; position: fixed; z-index: 0;}
section{ width: 100%; height: 100vh; display: flex; justify-content: center; align-items: center; position: relative; z-index: 1;}
.wrap{ width: 100%; max-width: 328px;}
.wrap .logo{ width: 100%; max-width: 196px; margin: auto;}
.wrap ul{ width: 100%; list-style: none; margin: 40px 0 0;}
.wrap ul li{ width: 100%; margin: 15px 0 0; backdrop-filter: blur(6px);}
.wrap ul li:hover{ backdrop-filter: blur(0px); opacity: .5;}
.wrap ul li a{ display: block; width: 100%; border: 1px solid #fff; box-sizing: border-box; display: flex; justify-content: space-between; align-items: center; padding: 10px 19%;}
.wrap ul li a .icon{ width: 45px; aspect-ratio: 1 / 1; background-size: 100%; background-repeat: no-repeat; background-position: center; margin-right: 20px;}
.wrap ul li a .icon.store{ background-image: url(../images/icon02.svg);}
.wrap ul li a .icon.sns{ background-image: url(../images/icon01.svg);}
.wrap ul li a p{ display: inline-block; width: calc(100% - 45px); font-size: 14px; color: #fff; font-weight: 500;}
.wrap .txt{ width: 100%; text-align: center; margin: 40px 0 0;}
.wrap .txt img{ max-width: 110px;}

@media screen and (max-width:769px){
	.wrap .logo{ width: 100%; max-width: 140px; margin: auto;}
}