.wrapper{position:relative}@media only screen and (max-width:860px){.wrapper{overflow-x:hidden}}.overlay{content:"";display:block;width:0;height:0;background-color:rgba(154,217,228,.3);position:absolute;top:0;left:0;z-index:2;opacity:0;transition:opacity .5s}.overlay.open{width:100%;height:100%;opacity:1}main{padding:0 0;transition:all .5s;display:flex;flex-direction:column;justify-content:center}.menu-trigger-sp{margin-top:80%;font-size:10px}.menu-trigger{font-size:12px;color:#7eb3b2;line-height:2em;background:#fff;border-bottom:solid 20px #fff;border-top:solid 10px #fff;border-left:solid 10px #fff;border-right:solid 10px #fff;display:inline-block;width:36px;height:28px;margin-top:2%;margin-right:3%;vertical-align:middle;cursor:pointer;position:fixed;top:0%;right:0%;z-index:100;transform:translateX(0);transition:transform .5s}.menu-trigger.active{transform:translateX(-280px)}.menu-trigger span{display:inline-block;box-sizing:border-box;position:absolute;left:0;width:100%;height:4px;background-color:#7eb3b2}.menu-trigger.active span{background-color:#7eb3b2}.menu-trigger span:nth-of-type(1) {top:0}.menu-trigger.active span:nth-of-type(1) {transform:translateY(12px) rotate(-45deg)}.menu-trigger span:nth-of-type(2) {top:12px}.menu-trigger.active span:nth-of-type(2) {opacity:0}.menu-trigger span:nth-of-type(3) {bottom:0}.menu-trigger.active span:nth-of-type(3) {transform:translateY(-12px) rotate(45deg)}nav{width:350px;height:100%;padding-top:100px;background-color:#7eb3b2;color:#595757;position:fixed;top:0;right:0;z-index:10;transform:translate(350px);transition:all .5s}nav.open{transform:translateZ(0)}nav li{color:#595757;text-align:center;padding:10px 0}nav li a{color:#595757}.triangle-sp01{display:block;height:0;width:0;position:absolute;bottom:8px;right:8px;border-left:15px solid transparent;border-bottom:15px solid #7eb3b2}.btn-sp01 a{color:#3c3c3c}.btn-sp02 a{color:#fff}.btn-sp03 a{color:#fff}.btn-sp01{font-size:18px;background-color:#fff;display:block;height:50px;line-height:50px;position:relative;text-align:center;width:90%;margin:2% auto}.btn-sp02{font-size:18px;background-color:#f5a00e;display:block;height:50px;line-height:50px;position:relative;text-align:center;width:90%;margin:2% auto}.btn-sp03{font-size:18px;background-color:#b492bf;display:block;height:50px;line-height:50px;position:relative;text-align:center;width:90%;margin:2% auto}nav{overflow-y:auto}.spnav02 li{background-color:#fff;display:block;font-size:15px;height:30px;line-height:30px;position:relative;text-align:center;width:90%;margin:1% auto}@media only screen and (min-width:640px){.menu-trigger{margin-top:5%;width:36px;height:28px;margin-right:3%}.menu-trigger-sp{margin-top:70%;font-size:13px}nav{width:100%;height:100%;padding-top:100px;background-color:#7eb3b2;color:#595757;position:fixed;top:0;right:0;z-index:10;transform:translate(100%);transition:all .5s}}