﻿@charset "UTF-8";
*{
  margin: 0;
  padding: 0;
}
body{
  background-color: #eeedec;
  overflow-x: hidden;
}
.none{
  display: none;
}
.block{
  display: block;
}
.wrap p, .wrap span, .wrap dl, h1, h2, h3, h4, h5, h6{
    transform: rotate(0.03deg);
    -moz-transform: rotate(0.03deg);
    -ms-transform: rotate(0.03deg);
    -o-transform: rotate(0.03deg);
    -webkit-transform: rotate(0.03deg);
}
.wrap{
  max-width: 1000px;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  font-size: 20px !important;
  font-family: 'Noto Sans JP', sans-serif !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.wrap h1,.wrap h2,.wrap h3{
  font-size: 30px !important;
}
.both{
  clear: both;
}
            /*fadeout*/
.fadeout{
  opacity: 0;
  transform: translateY(50px);
  transition:opacity 1s,transform 0.5s;
}
.fadeoutright{
  opacity: 0;
  transform: translateX(50px);
  transition:opacity 2s,transform 1.5s;
}
.fadein{
  opacity: 1;
  transform: translateY(0);
}
.fadeinright{
  opacity: 1;
  transform: translateX(0);
}

              /*marker*/
.marker-animation.active{
    background-position: -100% 1.0em;
}
.marker-animation {
    background-image: -webkit-linear-gradient(left, transparent 50%, #FCD900 50%);
    background-image: -moz-linear-gradient(left, transparent 50%, #FCD900 50%);
    background-image: -ms-linear-gradient(left, transparent 50%, #FCD900 50%);
    background-image: -o-linear-gradient(left, transparent 50%, #FCD900 50%);
    background-image: linear-gradient(left, transparent 50%, #FCD900 50%);
    background-repeat: repeat-x;
    background-size: 200% .5em;
    background-position: 0 .5em;
    transition: all 3s ease;
    font-weight: bold;
}

            /*coll to action*/
.cta{
  clear: both;
  width: 300px;
  height: 50px;
  background-color: #e25d4a;
  border-radius: 25px;
  text-align: center;
  line-height: 50px !important;
  margin: 50px auto;
  color: white;
}
.cta a{
  text-decoration: none;
  text-align: center;
}
.cta p{
  color: white;
  font-weight: bold;
  line-height: 50px !important;
  font-size: 14px !important;
}
.cta:hover{
  opacity: 0.6;
}
.cta-img{
  text-align: center;
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
}
.cta-img img{
  width: 100%;
  max-width: 800px;
  height: auto;
  margin: 0 auto;
}
.cta-img a{
  text-decoration: none;
  text-align: center;
  transition: 0.5s;
}
.cta-img a:hover{
  opacity: 0.6;
}
.red{
  color: #dd1d1d;
}

.sns{
  display: flex;
  justify-content: space-around;
}
.sns .insta{
  width: 300px !important;
  height: 50px !important;
  background: linear-gradient(45deg, rgba(254,212,117,1) 0%,rgba(229,61,93,1) 50%,rgba(194,49,134,1) 70%,rgba(156,56,187,1) 100%);
  border-radius: 25px;
  box-shadow: 0 5px 25px rgba(0,0,0,.15);
  display: inline-block;
  font-weight: 400;
  text-align: center;
  text-decoration: none;
  transition: all .2s linear;
  margin-right: auto;
  margin-left: auto;
  margin: 30px;
}
.sns .facebook{
  width: 300px !important;
  height: 50px !important;
  border-radius: 25px;
  box-shadow: 0 5px 25px rgba(0,0,0,.15);
  display: inline-block;
  font-weight: 400;
  text-align: center;
  text-decoration: none;
  transition: all .2s linear;
  margin-right: auto;
  margin-left: auto;
  margin: 30px;
  background-color: #475993;
}
.sns p{
  font-size: 14px !important;
  width: 300px !important;
  line-height: 50px;
  text-align: center;
  color: #fff;
}
.insta:hover,.facebook:hover{
  box-shadow: 0 5px 25px rgba(0,0,0,.30);
}
.page_top{
  cursor: pointer;
  position: fixed;
  right: 5%;
  bottom: 5%;
  text-align: center;
  border-radius: 10px;
  width: 50px;
  height: 40px;
  line-height: 40px;
  color: white;
  background-color: #e25d4a;
}
.page_top i{
  line-height: 40px;
}
.page_top:hover{
  opacity: 0.6;
}
.top{
  width: 100%;
  height: 700px;
  background: url(https://gigaplus.makeshop.jp/nxstage2018/img/freepage/amg/top2.png) no-repeat;
  background-size: cover;
}
.top img{
  position: relative;
  top: 40%;
  left: 30%;
}
.wrap ul{
  display: flex;
  justify-content: space-between;
  text-decoration: none;
}
.wrap li{
  width: 180px;
  height: auto;
  list-style: none;
  margin: 20px 0;
  padding: 10px 20px;
  font-size: 20px !important;
  font-family: 'Noto Sans JP', sans-serif !important;
  color: white;
  background-color: #e25d4a;
  border-radius: 10px;
}
.wrap li a {
  color: #fff;
  font-weight: bold;
  border-radius: 6px;
  display: inline-block;
  transition: .3s;
}
.wrap li:hover {
  transform: scale(1.1);
}
.wrap a{
  text-decoration: none;
}

.menu{
  background-color: white;
}
.stop-background{
  width: 100%;
  height: 300px;
  background: url(https://gigaplus.makeshop.jp/nxstage2018/img/freepage/amg/mercedes1.png) no-repeat;
  background-size: cover;
  background-position: 50% 90%;
}
.stop-background-out{
  width: 100%;
  height: 300px;
  background: url(https://gigaplus.makeshop.jp/nxstage2018/img/freepage/amg/out-parts.png) no-repeat;
  background-size: contain;
  background-attachment: fixed;
  background-position: 50% 50%;
}
.stop-background-in{
  width: 100%;
  height: 300px;
  background: url(https://gigaplus.makeshop.jp/nxstage2018/img/freepage/amg/in-parts.png) no-repeat;
  background-size: contain;
  background-attachment: fixed;
  background-position: 50% 50%;
}
.stop-background-key{
  width: 100%;
  height: 300px;
  background: url(https://gigaplus.makeshop.jp/nxstage2018/img/freepage/amg/key-cover.png) no-repeat;
  background-size: contain;
  background-attachment: fixed;
  background-position: 50% 50%;
}
.stop-background h1,.stop-background-out h1,.stop-background-in h1,.stop-background-key h1{
  color: #eeedec;
  text-align: center;
  margin-right: auto;
  margin-left: auto;
  line-height: 300px;
  letter-spacing: 10px;
  font-size: 30px !important;
}
.title p{
  font-size: 20px !important;
  line-height: normal !important;
  margin-bottom: 10px;
}
.point h3{
  margin-bottom: 10px;
}
.caliper img{
  width: 100%;
  height: auto;
}
.caliper p{
  width: 90%;
  margin: 0 auto;
  text-align: left;
  font-size: 20px !important;
}
.caliper .box1,.caliper .box2,.caliper .box3{
  clear: both;
  padding-top: 30px;
}
.caliper .box2{
  margin-bottom: 30px;
}
.caliper h1{
  margin: 100px auto 20px auto;
  font-size: 30px !important;
}
.caliper h2{
  clear: both;
}
.sidebox p{
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  font-size: 25px !important;
  margin-top: 50px;
}
.caliper-side{
  margin-top: 20px;
}
.caliper-side img{
  float: left;
  width: 50%;
  margin-top: 20px;
}
.caliper-side p{
  float: right;
  width: 50%;
  text-align: left;
  font-size: 20px !important;
}
.caliper-side:nth-child(2) p{
  margin-top: 100px;
  font-size: 20px !important;
}
.text{
  width: 80%;
  margin-top: 50px;
}
.caliper-side2{
  display: flex;
  justify-content: space-around;
}
.caliper-side2 img{
  width: 30%;
}
.premium{
  margin: 100px auto 20px auto; 
}
.premium .text{
  width: 40%;
  height: auto;
}
.premium .caliper-side p{
  margin-top: 50px;
  font-size: 20px !important;
}
.box3 p{
  margin: 0 auto 20px auto;
  font-size: 20px !important;
}
            /*caliper end*/
            /*embrem start*/
.embrem{
  position: relative;
}
.embrem .title{
  margin: 100px 0 20px 0;
}
.embrem .embrem-side{
  display: flex;
  justify-content: space-around;
}
.embrem .embrem-side img{
  width: 80%;
  height: auto;
}
.embrem .box1{
  text-align: left;
  margin-left: 25px;
  margin-bottom: 20px;
}
.embrem-side .box{
  text-align: left;
  width: 45%;
}
.embrem .embrem-side img{
  width: 40%;
}
.embrem .point{
  margin: 30px 0 100px 0;
  font-size: 20px !important;
}
.embrem .point p{
  font-size: 20px !important; 
}
.embrem .point .embrem-side h3{
  margin-bottom: 10px;
}
.embrem .back{
  position: absolute;
  right: 120%;
  width: auto;
  height: 100%;
}
            /*embrem end*/
            /*striker start*/
.striker .title{
  margin: 100px 0 20px 0;
}
.striker-side{
  display: flex;
}
.striker-side .box p{
  font-size: 25px !important;  
  margin-bottom: 10px;
}
.striker-side img{
  width: 80%;
  height: auto;
}
.striker .box{
  text-align: center;
}
.striker .point{
  text-align: left;
  margin: 50px 0 50px 50px;
  font-size: 20px !important;
}
.striker .point p{
  font-size: 20px !important; 
}
.striker-cover{
  margin-left: 50px;
}
.striker-cover img{
  width: 80%;
  height: auto;
  margin-top: 10px;
}
        /*striker end*/
        /*cover start*/
.cover .title{
  margin: 50px 0;
}
.cover .cover-side{
  display: flex;
}
.cover .cover-side img{
  width: 70%;
  height: auto;
}
.cover-side .box p{
  font-size: 20px !important;
  margin-bottom: 10px;
}
.cover .point{
  text-align: left;
  margin: 50px 0 50px 50px;
}
.cover-side2{
  display: flex;
}
.cover-side2 img{
  width: 30%;
}
.cover-side2 p{
  font-size: 20px !important;
  width: 110%;
}
              /*cover end*/
              /*tree start*/
.tree{
  position: relative;
}
.tree .title{
  margin: 50px 0 20px 0;
}
.tree .tree-side{
  display: flex;
  font-size: 20px !important;
}
.tree .tree-side p{
  font-size: 20px !important;  
  margin-bottom: 10px !important;
}
.tree .tree-side img{
  width: 70%;
  height: auto;
}
.tree .tree-side:nth-child(4) img{
  margin: 30px 20px 0 20px;
  width: 15%;
}
.tree .point{
  text-align: left;
  margin-top: 40px;
  font-size: 20px !important;
}
.tree .point p{
  font-size: 20px !important; 
}
.tree .back{
  position: absolute;
  top: 10%;
  right: -40%;
}
              /*tree end*/
              /*sheet start*/
.sheet{
  position: relative;
}
.sheet .title{
  margin: 100px 0 20px 0;
}
.sheet .striker-side{
  justify-content: space-around;
}
.sheet .striker-side img{
  width: 70%;
}
.sheet .point{
  text-align: left;
  margin: 50px auto 50px auto;
  font-size: 20px !important;
}
.sheet .point p{
  font-size: 20px !important;  
}
.sheet .back{
  position: absolute;
  right: 118%;
  width: 50%;
  height: auto;
}
              /*sheet end*/
              /*key start*/
.key .title{
  margin: 100px 0 20px 0;
}
.key-side{
  display: flex;
  justify-content: space-around;
  font-size: 20px !important;
}
.key-side p{
  font-size: 20px !important;  
  margin-bottom: 10px;
}
.key-side img{
  width: 80%;
  height: auto;
}
.key .point{
  text-align: left;
  margin: 50px auto 50px auto;
  font-size: 20px !important;
}
.key .point p{
  font-size: 20px !important;  
}


@media screen and (max-width : 1024px) {

.top{
  width: 100%;
  height: 700px;
  background: url(https://gigaplus.makeshop.jp/nxstage2018/img/freepage/amg/top-pad2.png) no-repeat;
  background-size: cover;
}
.back{
  display: none;
}

.striker-cover{
  margin-left: 20px;
  margin-top: 40px;
}
.striker-cover img{
  width: 70%;
}
.cover-side2{
  display: flex;
}
.cover-side2 img{
  margin-top: 50px;
  width: 30%;
}
.cover-side2 p{
  width: 110%;
}

}

        @media screen and (max-width : 599px) {
.spnone{
  display: none;
}
.spblock{
  display: block;
}
.wrap{
  max-width: 1000px;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  font-size: 14px !important;
  font-family: 'Noto Sans JP', sans-serif !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.wrap h1,.wrap h2,.wrap h3{
  font-size: 20px !important;
}
.wrap ul{
  display: flex;
  justify-content: space-around;
  width: 100%;
}
.wrap li{
  float: left;
  width: 75%;
  height: auto;
  margin: 10px 5px;
  list-style: none;
  padding: 10px 15px;
  font-size: 13px !important;
  font-family: 'Noto Sans JP', sans-serif !important;
}
.wrap li:nth-child(3){
  clear: both;
  float: left;
}
.title p{
  font-size: 16px !important;
  line-height: normal !important;
  margin-bottom: 10px;
}
.top{
  width: 100%;
  height: 700px;
  background: url(https://gigaplus.makeshop.jp/nxstage2018/img/freepage/amg/top-sp2.png) no-repeat;
  background-size: cover;
}
.top img{
  width: 60%;
  position: relative;
  top: 40%;
  left: 15%;
}

.cta-img{
  text-align: center;
}
.cta-img img{
  width: 100%;
  margin-right: auto;
  margin-left: auto;
}
.cta-img a{
  text-decoration: none;
  text-align: center;
  transition: 0.5s;
}
.cta-img a:hover{
  opacity: 0.6;
}
.sns{
  display: block;
  justify-content: space-around;
}
.sns .insta{
  margin: 10px;
}
.sns .facebook{  
  margin: 10px;
}
.stop-background{
  width: 100%;
  height: 100px;
  background: url(https://gigaplus.makeshop.jp/nxstage2018/img/freepage/amg/mercedes1.png) no-repeat;
  background-size: cover;
  background-position: 50% 90%;
}
.stop-background-out{
  width: 100%;
  height: 100px;
  background: url(https://gigaplus.makeshop.jp/nxstage2018/img/freepage/amg/out-parts.png) no-repeat;
  background-size: cover;
  background-position: 80% 50%;
}
.stop-background-in{
  width: 100%;
  height: 100px;
  background: url(https://gigaplus.makeshop.jp/nxstage2018/img/freepage/amg/in-parts.png) no-repeat;
  background-size: cover;
  background-position: 50% 50%;
}
.stop-background-key{
  width: 100%;
  height: 100px;
  background: url(https://gigaplus.makeshop.jp/nxstage2018/img/freepage/amg/key-cover.png) no-repeat;
  background-size: cover;
  background-position: 50% 50%;
}
.stop-background h1,.stop-background-out h1,.stop-background-in h1,.stop-background-key h1{
  color: white;
  text-align: center;
  margin-right: auto;
  margin-left: auto;
  line-height: 100px;
  letter-spacing: 5px;
  font-size: 20px !important;
}
.point p{
  margin-bottom: 10px !important;
}
.caliper img{
  width: 100%;
  height: auto;
}
.caliper p{
  width: 90%;
  margin: 0 auto;
  text-align: left;
  font-size: 14px !important;
}
.caliper .box1,.caliper .box2,.caliper .box3{
  clear: both;
  padding-top: 30px;
}
.caliper .box2{
  margin-bottom: 30px;
}
.caliper h1{
  margin: 50px auto 20px auto;
}
.caliper h2{
  clear: both;
}
.sidebox p{
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  font-size: 20px !important;
  margin-top: 10px;
}

.caliper-side{
  margin-top: 0px;
}
.caliper-side img{
  float: none;
  width: 90%;
  margin-top: 0px;
}
.caliper-side p{
  float: none;
  width: 90%;
  text-align: left;
  font-size: 14px !important;
}
.caliper .box1 .sidebox p{
  margin-top: 20px;
  font-size: 14px !important;
}
.caliper-side:nth-child(2) p{
  margin-top: 20px;
  font-size: 14px !important;
}
.text{
  width: 80%;
  margin-top: 50px;
}
.caliper-side2{
  display: flex;
  justify-content: space-around;
}
.caliper-side2 img{
  width: 30%;
}
.premium{
  margin: 30px auto 20px auto; 
}
.premium .caliper-side{
  display: block;
}
.premium .caliper-side img{
  width: 90%;
  float: none;
}
.premium .caliper-side p{
  float: none;
  width: 90%;
  margin-top: 10px;
  margin-right: auto;
  margin-left: auto;
  font-size: 14px !important;
}
.premium .text{
  width: 80%;
  height: auto;
}
.box3 p{
  margin: 0 auto 20px auto;
}
            /*embrem start*/
.embrem{
  position: relative;
}
.embrem .title{
  margin: 50px 0 20px 0;
}
.embrem .title h1{
  font-size: 18px !important;
}
.embrem .embrem-side{
  display: flex;
  justify-content: space-around;
}
.embrem .embrem-side img{
  width: 80%;
  height: auto;
}
.embrem .box1{
  text-align: left;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 20px;
  width: 90%;
}
.embrem-side .box{
  text-align: left;
  width: 45%;
}
.embrem .embrem-side img{
  width: 40%;
}
.embrem .point{
  margin: 30px 0 100px 0;
}
.embrem .point p{
  font-size: 14px !important; 
}
.embrem .point .box1{
  margin-right: auto;
}
.embrem .point .embrem-side h3{
  margin-bottom: 10px;
}
.embrem .back{
  position: absolute;
  right: 120%;
  width: auto;
  height: 100%;
}
            /*embrem end*/
            /*striker start*/
.striker .title{
  margin: 100px 0 20px 0;
}
.striker-side{
  display: flex;
}
.striker-side .box p{
  font-size: 20px !important;  
}
.striker-side img{
  width: 80%;
  height: auto;
}
.striker .box{
  text-align: center;
}
.striker-side:nth-child(3){
  display: block;
}
.striker .point{
  display: block;
  width: 90%;
  text-align: left;
  margin: 30px 0 0px 20px;
  font-size: 14px !important; 
}
.striker .point p{
  font-size: 14px !important; 
}
.striker-cover{
  margin-left: 20px;
}
.striker-cover img{
  width: 40%;
  height: auto;
  margin-top: 0px;
  display: none;
}
        /*striker end*/
        /*cover start*/
.cover .title{
  margin: 100px 0 20px 0;
}
.cover .cover-side{
  display: flex;
  flex-wrap: wrap;
}
.cover .cover-side .box{
  width: 50%;
}
.cover .cover-side .box:nth-child(3) p{
  margin-top: 20px;
}
.cover .cover-side img{
  width: 70%;
  height: auto;
}
.cover-side .box p{
  width: 90%;
  margin-bottom: 10px;
  font-size: 14px !important;
}
.cover .point{
  width: 90%;
  text-align: left;
  margin: 20px auto 10px auto;
}
.cover-side2{
  display: block;
  width: 100%;
}
.cover-side2 img{
  margin-top: 0;
  width: 80%;
}
.cover-side2 p{
  width: 100%;
  font-size: 14px !important;
}
              /*cover end*/
              /*tree start*/
.tree{
  position: relative;
}
.tree .title{
  margin: 50px 0 20px 0;
}
.tree .tree-side{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.tree .tree-side .box{
  width: 50%;
  margin-top: 20px;
}
.tree .tree-side img{
  width: 70%;
  height: auto;
}
.tree .tree-side p{
  font-size: 14px !important;  
  margin-bottom: 10px !important;
}
.tree .tree-side:nth-child(4){
  width: 90%;
  margin-right: auto;
  margin-left: auto;
}
.tree .tree-side:nth-child(4) img{
  margin: 30px 20px 0 20px;
  width: 15%;
  display: none;
}
.tree .point{
  text-align: left;
  margin-top: 30px;
}
.tree .point p{
  font-size: 14px !important; 
}
.tree .back{
  position: absolute;
  top: 10%;
  right: -40%;
}
              /*tree end*/
              /*sheet start*/
.sheet{
  position: relative;
}
.sheet .title{
  margin: 100px 0 20px 0;
}
.sheet .striker-side{
  justify-content: space-around;
}
.sheet .striker-side img{
  width: 70%;
  margin-bottom: 20px;
}
.sheet .point{
  width: 90%;
  text-align: left;
  margin: 20px auto 0 auto;
}
.sheet .point p{
  font-size: 14px !important;  
}
.sheet .back{
  position: absolute;
  right: 118%;
  width: 50%;
  height: auto;
}
              /*sheet end*/
              /*key start*/
.key .title{
  margin: 50px 0 20px 0;
}
.key-side{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.key-side p{
  font-size: 14px !important;  
  margin-bottom: 10px;
}
.key-side .box{
  width: 50%;
  margin-top: 20px;
}
.key-side img{
  width: 80%;
  height: auto;
}
.key .point{
  text-align: left;
  width: 90%;
  margin: 30px auto 0 auto;
}
.key .point p{
  font-size: 14px !important;  
}





}