@charset "UTF-8";

body {
    font-size: 16px;
    font-family: "Shippori Mincho", sans-serif;
    color:#FCFCFC;
    letter-spacing:0.8px;
    line-height:1.6;
    background:#010E15;
    transition: 2s;
    opacity:0;
}
body.fade {
    opacity:1;
    transition: 2s;
}

@media screen and (max-width: 1000px) {
    body {
        font-size:4.10vw;
        letter-spacing:0;
    }
}

.minFnt {
  font-family: "Shippori Mincho";
  font-weight: 400;
  font-style: normal;
}
.goFnt{
  font-family:  "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic";
}
.marcellusFnt{
  font-family:  "Marcellus";
}

@media screen and (min-width: 1001px) {
    .sp{
        display: none !important;
    }
}

@media screen and (max-width: 1000px) {
    .pc{
        display: none !important;
    }
}

@media screen and (max-width: 1000px) {
    body{
        font-size: 4.1vw;
    }
}


.wrap {
    position:relative;
    z-index:2;
    margin:0 19% 0 auto;
    width:600px;
    background:#010E15;
}

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


/***********************************************
　ヘッダー
***********************************************/

@media screen and (min-width: 1001px) {
    header {
        position:fixed;
        right:0;
        top:0;
        z-index:2;
        width:19%;
        height:100%;
        text-align:center;
        background:#001F2F;
    }
        header h1 {
            position:absolute;
            left:0;
            top:45px;
            width:100%;
            font-family:  "Marcellus";
            font-size:24px;
            color:#FCFCFC;
            letter-spacing:4px;
            font-weight:normal;
            text-align:center;
        }
        header h2 {
            position:absolute;
            left:50%;
            top:18vh;
            transform: translate(-50%,0);
            text-align:center;
        }
        header h3 {
            position:absolute;
            left:50%;
            top:26vh;
            transform: translate(-200%,0);
            font-size:30px;
            color:#FCFCFC;
            letter-spacing:2px;
            font-weight:normal;
            text-align:center;
            -ms-writing-mode: tb-rl;
            writing-mode: vertical-rl;
        }
        header .snsArea {
            position:absolute;
            left:0;
            bottom:60px;
            width:100%;
            text-align:center;
        }
        header .copyArea {
            position:absolute;
            left:0;
            bottom:30px;
            width:100%;
            text-align:center;
        }
}


@media screen and (max-width: 1000px) {
    header {
        display:block;
        position:absolute;
        left:0;
        top:0;
        z-index:3;
        width:100%;
        height:120vw;
    }
        header h1 {
            position:absolute;
            left:17px;
            top:15px;
            font-family:  "Marcellus";
            font-size:16px;
            color:#FCFCFC;
            letter-spacing:2px;
            font-weight:normal;
            text-align:left;
        }
        header h2 {
            position:absolute;
            left:50%;
            top:38vw;
            transform: translate(-50%,0);
            width:58vw;
            text-align:center;
        }
        header h3 {
            position:absolute;
            left:0;
            right:0;
            top:70vw;
            font-size:20px;
            color:#FCFCFC;
            letter-spacing:2px;
            font-weight:normal;
            text-align:center;
        }
            header h3:before,
            header h3:after {
                content:'～';
            }
}



/*.scroll_down a {
  display: inline-block;
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 2;
  width: 13px;
  padding: 10px 10px 110px;
  color: #000;
  font-size: 14px;
  font-family: 'Josefin Sans', sans-serif;
  line-height: 1;
  letter-spacing: .2em;
  text-transform: uppercase;
  text-decoration: none;
  writing-mode: vertical-lr;
  transition: .2s;
  overflow: hidden;
  margin: auto;
}*/


/***********************************************
　PCオンリー
***********************************************/

.bg1 {
    position:fixed;
    left:0;
    top:0;
    z-index:1;
    max-width:1000px;
    width:100%;
    height:100%;
    background:url(../img/bg1.jpg);
    background-size:auto 100%;
}
    .bg1 dl {
        position:fixed;
        left:30px;
        bottom:30px;
        z-index:1;
        width:370px;
    }

        .bg1 dt {
            display:block;
            padding:10px 15px;
            font-size:18px;
            color:#FFF;
            text-align:left;
            background:#010E15;
        }
        .bg1 dd {
            display:block;
            padding:20px;
            font-size:14px;
            color:#010E15;
            text-align:left;
            background:#FFF;
        }
            .bg1 dd span {
                display:inline-block;
                margin-top:5px;
                font-size:16px;
            }
            .bg1 dd a {
                font-size:18px;
                color:#010E15;
                word-wrap: break-word;
                transition: 0.3s;
            }
            .bg1 dd a:hover {
                text-decoration: underline;
                transition: 0.3s;
            }

@media screen and (max-width: 1289px) {
    .bg1 dl {
        left:10px;
        bottom:30px;
        width:175px;
    }

        .bg1 dt {
            padding:5px 5px;
            font-size:15px;
            text-align:center;
        }
        .bg1 dd {
            padding:10px;
            font-size:11px;
        }
            .bg1 dd span {
                font-size:13px;
            }
            .bg1 dd a {
                font-size:15px;
            }
}


/***********************************************
　メイン
***********************************************/

.js-fade {
    opacity: 0;
    visibility: hidden;
    transform: translateY(25px);
    transition: opacity 1.5s, visibility 1.5s, transform 1.5s;
    transition-delay: 250ms;
}

.js-fade.inview {
    opacity: 1;
    visibility: visible;
    transform: translateY(0px);
    transition-delay: 250ms;
}



.mv {
    position:relative;
    z-index:1;
    margin-bottom:120px;
    width:100%;
    height:680px;
    background:url(../img/mv.jpg) center center no-repeat;
    background-size:auto 115%;
    animation: small 5s linear forwards;
}

.mv .clip {
    display:block;
    position:absolute;
    bottom:0;
    left:0;
    z-index:2;
    width:100%;
    height:60px;
    background:url(../img/mv_bg.svg) center center no-repeat;
    background-size:100% auto;
}
    
@media screen and (max-width: 1000px) {
    .mv {
        position:relative;
        z-index:1;
        margin-bottom:25.64vw;
        width:100%;
        height:120vw;
        background:url(../img/mv.jpg) center center no-repeat;
        background-size:auto 115%;
        animation: small 5s linear forwards;
    }

    .mv .clip {
        display:block;
        position:absolute;
        bottom:0;
        left:0;
        z-index:2;
        width:100%;
        height:11.46vw;
        background:url(../img/mv_bg.svg) center center no-repeat;
        background-size:105% auto;
    }
}

.scroll {
  display: inline-block;
  position: absolute;
  right: 0;
  bottom: -42px;
  left: 0;
  z-index: 2;
  margin: auto;
  padding: 10px 10px 110px;
  width: 86px;
  font-size: 14px;
  color: #FCFCFC;
  font-family:  "Marcellus";
  letter-spacing:4px;
  transition: .2s;
}

.scroll:before {
  content: '';
  position: absolute;
  bottom: -20px;
  left: 50%;
  width: 2px;
  height: 100px;
  background: #7F8589
}

.scroll:after {
  content: '';
  position: absolute;
  bottom: -20px;
  left: 50%;
  width: 2px;
  height: 100px;
  background: #000;
  animation: sdl01 1.5s cubic-bezier(1, 0, 0, 1) infinite;
}
    
@media screen and (max-width: 1000px) {
    .scroll {
      display: inline-block;
      position: absolute;
      right: 0;
      bottom: -8vw;
      left: 0;
      z-index: 2;
      margin: auto;
      padding: 10px 10px 110px;
      width: 20vw;
      font-size: 0;
      color: #FCFCFC;
      font-family:  "Marcellus";
      letter-spacing:0.7vw;
      transition: .2s;
    }

    .scroll:before {
      content: '';
      position: absolute;
      bottom: -5vw;
      left: 50%;
      width: 2px;
      height: 100px;
      background: #7F8589
    }

    .scroll:after {
      content: '';
      position: absolute;
      bottom: -5vw;
      left: 50%;
      width: 2px;
      height: 100px;
      background: #000;
      animation: sdl01 1.5s cubic-bezier(1, 0, 0, 1) infinite;
    }
}

@-webkit-keyframes small {
  from { background-size:auto 115%; }
  to   { background-size:auto 100%; }
}

@keyframes sdl01 {
  0% {
    transform: scale(1, 0);
    transform-origin: 0 0;
  }
  50% {
    transform: scale(1, 1);
    transform-origin: 0 0;
  }
  50.1% {
    transform: scale(1, 1);
    transform-origin: 0 100%;
  }
  100% {
    transform: scale(1, 0);
    transform-origin: 0 100%;
  }
}





.btn1 {
    text-align:center;
}
.btn1 a {
    display:inline-block;
    padding:17px 0;
    min-width:320px;
    font-size:22px;
    color:#FCFCFC;
    line-height:1;
    background-image:url(../img/ico-arr1.svg), linear-gradient(#795912 0%, #412d01 100%);
    background-position:90% center, center center;
    background-repeat:no-repeat, repeat;
    border-radius:30px;
    transition: 0.3s;
}
    
@media screen and (min-width: 1001px) {
    .btn1 a:hover {
        opacity:0.7;
        transition: 0.3s;
    }
}
    
@media screen and (max-width: 1000px) {
    .btn1 a {
        padding:3.85vw 0;
        min-width:100%;
        font-size:5.13vw;
        border-radius:50px;
    }
}


.topBtn {
    margin:0 auto 100px;
    width:100%;
    text-align:center;
}
    
@media screen and (max-width: 1000px) {
    .topBtn {
        margin:0 auto 10vw;
        width:87%;
    }
}


.modeArea {
    margin:0 auto;
    width:100%;
    text-align:center;
}
    .modeArea .inner {
        margin:0 auto;
        width:80%;
    }
    .modeArea .num {
        margin-bottom:10px;
        font-family:  "Marcellus";
        font-size:14px;
        color:#4D565B;
        letter-spacing:1.5px;
    }
        .modeArea .num span {
            display:inline-block;
            margin-left:5px;
            font-family: "Shippori Mincho";
            font-size:30px;
            letter-spacing:0;
        }
        
    .modeArea .img {
        margin-bottom:40px;
    }
        
    .modeArea .ttl {
        margin-bottom:40px;
        font-size:28px;
        color:#4D565B;
        font-weight:normal;
        text-decoration: underline;
    }
        .modeArea .ttl span {
            color:#FCFCFC;
        }
            .modeArea .ttl span span {
                letter-spacing:-1px;
            }
        
    .modeArea .txt {
        margin:0 auto 20px;
        text-align:left;
    }
    .modeArea .txt:last-child {
        margin-bottom:0;
    }
    
@media screen and (max-width: 1000px) {
    .modeArea .inner {
        width:87%;
    }
        .modeArea .num {
            font-size:2.82vw;
            letter-spacing:0.7vw;
        }
            .modeArea .num span {
                font-size:6.92vw;
            }
        
        .modeArea .ttl {
            margin-bottom:30px;
            font-size:5.64vw;
        }
                .modeArea .ttl span span {
                    font-size:5.1vw;
                    letter-spacing:-0.3vw;
                }
        
        .modeArea .txt {
            margin:0 auto 5vw;
        }
}


.mode1 {
    margin:0 auto 120px;
    width:100%;
}
    .mode1 ul {
        margin-bottom:100px;
    }
        .mode1 li {
            margin-bottom:50px;
        }
        .mode1 li:last-child {
            margin-bottom:0;
        }
            .mode1 li h2 {
                margin-bottom:20px;
                padding:5px 0;
                font-size:20px;
                font-weight:normal;
                background:#20333C;
            }
            .mode1 li p {
                font-size:16px;
                text-align:left;
            }
    .mode1 .btn {
        margin-bottom:100px;
    }
    
@media screen and (max-width: 1000px) {
    .mode1 {
        margin:0 auto 20vw;
        width:100%;
    }
        .mode1 ul {
            margin-bottom:16vw;
        }
            .mode1 li {
                margin-bottom:12.82vw;
            }
                .mode1 li h2 {
                    margin-bottom:6.0vw;
                    padding:2.56vw 0;
                    font-size:5.13vw;
                }
                .mode1 li p {
                    margin:0 auto;
                    width:90%;
                    font-size:4.10vw;
                }
        .mode1 .btn {
            margin-bottom:10vw;
        }
}


.mode2 {
    margin:0 auto 120px;
    padding-top:40px;
    width:100%;
    background:url(../img/bg_logo.svg) 0 0 no-repeat;
    background-size:100% auto;
}
    
@media screen and (max-width: 1000px) {
    .mode2 {
        margin:0 auto 20vw;
        padding-top:6.66vw;
    }
}


.mode3 {
    margin:0 auto 100px;
    padding-top:40px;
    width:100%;
    background:url(../img/bg_logo.svg) 0 0 no-repeat;
    background-size:100% auto;
}
    .mode3 .braces {
        white-space: nowrap;
    }
    .mode3 .inner div div {
        margin-bottom:20px;
        padding:20px 0;
        border:1px solid #80878A;
    }
        .mode3 table {
            margin:0 auto;
        }
            .mode3 th {
                padding-right:15px;
                width:auto;
                font-size:18px;
                font-weight:normal;
                vertical-align: baseline;
                text-align:left;
            }
                .mode3 th span {
                    display:inline-block;
                    margin-right:5px;
                    font-size:50%;
                    vertical-align: 3px;
                }
            .mode3 td {
                font-size:18px;
                vertical-align: baseline;
            }
                .mode3 td span {
                    display:inline-block;
                    margin:0 5px;
                    font-size:22px;
                }
                
    .mode3 .btn {
        margin:100px auto 100px;
    }
    
@media screen and (max-width: 1000px) {
    .mode3 {
        margin:0 auto 30vw;
        padding-top:6.66vw;
    }
        .mode3 .braces {
            white-space: normal;
        }
        .mode3 .inner div div {
            margin-bottom:5vw;
            padding:3.33vw 0;
        }
            .mode3 table {
            }
                .mode3 th {
                    width:auto;
                }
                    .mode3 th span {
                        margin-right: 1.5vw;
                        font-size: 40%;
                        vertical-align: 1.2vw;
                    }
                .mode3 td {
                }
                    .mode3 td span {
                        margin:0 0.5vw;
                        font-size:5.13vw;
                    }
                
        .mode3 .btn {
            margin:20vw auto 10vw;
            width:87%;
        }
}






.profArea {
    position:relative;
    margin:0 auto;
    padding:175px 0 70px;
    width:100%;
    text-align:center;
    background:#261902;
}
    .profArea h1 {
        position:absolute;
        left:0;
        top:-33px;
        padding-top:130px;
        width:100%;
        font-family:  "Marcellus";
        font-size:38px;
        color:#937801;
        letter-spacing:10px;
        font-weight:normal;
        background:url(../img/bg_logo.svg) center 0 no-repeat;
        background-size:100% auto;
    }
    
    .profArea .prof {
        margin:0 auto 60px auto;
        padding-bottom:60px;
        width:90%;
        border-bottom:1px solid #938C81;
    }
    .profArea .prof:last-child {
        margin-bottom:0;
        border-bottom:0;
    }
        .profArea .prof img {
            width:280px;
        }
        .profArea .prof .name {
            margin:10px auto 20px auto;
            font-size:26px;
            line-height:1.3;
        }
            .profArea .prof .name span {
                font-size:12px;
            }
            
        .profArea .prof .txt {
            margin:0 auto 30px auto;
            width:90%;
            font-size:16px;
            text-align:left;
        }
            .profArea .prof .txt p {
                margin-bottom:20px;
            }
            .profArea .prof .txt p:last-child {
                margin-bottom:0;
            }
            
        .profArea .prof dl {
            margin:0 auto;
            width:90%;
            padding:15px;
            font-size:14px;
            color:#261902;
            text-align:left;
            background:#DAD8D4;
        }
            .profArea .prof dt {
                margin-bottom:10px;
                font-size:120%;
                font-weight:bold;
            }
            .profArea .prof dd {
                margin-bottom:10px;
            }
            .profArea .prof dd:last-child {
                margin-bottom:0;
            }
    
@media screen and (max-width: 1000px) {
    .profArea {
        padding:31vw 0 11.7vw;
    }
        .profArea h1 {
            top:-5.5vw;
            padding-top:23vw;
            font-size:7.69vw;
            letter-spacing:1.67vw;
        }

        .profArea .prof {
            margin:0 auto 12vw auto;
            padding-bottom:12vw;
        }
        .profArea .prof:last-child {
        }
            .profArea .prof img {
                width:60%;
            }
            .profArea .prof .name {
                margin:2.5vw auto 7vw auto;
                font-size:6.15vw;
            }
                .profArea .prof .name span {
                    font-size:3.08vw;
                }

            .profArea .prof .txt {
                margin:0 auto 15vw auto;
                width:90%;
            }
                .profArea .prof .txt p {
                    margin-bottom:5vw;
                }

            .profArea .prof dl {
                padding:3.84vw;
                width:100%;
                font-size:3.59vw;
            }
                .profArea .prof dt {
                    margin-bottom:1.66vw;
                    font-size:120%;
                }
                .profArea .prof dd {
                    margin-bottom:1.66vw;
                }
}






.infoArea {
    margin:0 auto;
    padding:100px 0;
    width:100%;
    text-align:center;
}
    .infoArea h1 {
        margin-bottom:80px;
        width:100%;
        font-family:  "Marcellus";
        font-size:38px;
        color:#937801;
        letter-spacing:10px;
        line-height:1.3;
        font-weight:normal;
    }
        .infoArea h1 span {
            display:block;
            width:100%;
            font-family: "Shippori Mincho", sans-serif;
            font-size:18px;
            color:#FCFCFC;
            letter-spacing:1px;
        }
        
    .infoArea h2 {
        margin-bottom:30px;
        padding-bottom:15px;
        width:100%;
        font-size:14px;
        line-height:1;
        text-align:center;
        border-bottom:1px solid #707070;
    }

    .infoArea .info1,  
    .infoArea .info2,  
    .infoArea .info3 {
        margin:0 auto 50px auto;
        width:360px;
    }

    .infoArea .info1 {
        font-size:24px;
        line-height:1;
    }
        .infoArea .info1 span {
            font-size:40px;
        }
        .infoArea .info1 p:last-child {
            margin-top:12px;
            font-size:19px;
        }

    .infoArea .info2 {
        font-size:18px;
        text-align:center;
    }
        .infoArea .info2 p {
            display:inline-block;
            text-align:left;
        }

    .infoArea .info3 {
        margin-bottom:80px;
    }
        .infoArea .info3 li {
            margin-bottom:15px;
            padding:10px 5px;
            color:#795912;
            letter-spacing:-0.2px;
            line-height:1;
            text-align:left;
            font-weight:bold;
            background:#FCFCFC;
            border-radius:10px;
        }
            .infoArea .info3 li span {
                font-family: "Shippori Mincho", sans-serif;
                color:#261902;
                font-weight:normal;
            }

@media screen and (max-width: 1000px) {
    .infoArea {
        padding:16.7vw 0;
        width:90%;
    }
        .infoArea h1 {
            margin-bottom:13.3vw;
            font-size:7.69vw;
            letter-spacing:1.67vw;
        }
            .infoArea h1 span {
                font-size:4.62vw;
                letter-spacing:0.17vw;
            }

        .infoArea h2 {
            margin-bottom:6.41vw;
            padding-top:3.84vw;
            padding-bottom:3.84vw;
            font-size:3.59vw;
            border-top:1px solid #707070;
        }

        .infoArea .info1,  
        .infoArea .info2,  
        .infoArea .info3 {
            margin:0 auto 11vw auto;
            width:100%;
        }

        .infoArea .info1 {
            font-size:5.13vw;
        }
            .infoArea .info1 span {
                font-size:8.72vw;
            }
            .infoArea .info1 p:last-child {
                margin-top:2.5vw;
                font-size:4.10vw;
            }

        .infoArea .info2 {
        }

        .infoArea .info3 {
            margin-bottom:13.3vw;
        }
            .infoArea .info3 li {
                margin-bottom:3.84vw;
                padding:2.56vw 0.83vw;
                letter-spacing:-0.03vw;
                border-radius:1.67vw;
            }
}






.faqArea {
    margin:0 auto;
    padding:0 0 100px;
    width:100%;
    text-align:center;
}
    .faqArea h1 {
        margin-bottom:80px;
        width:100%;
        font-family:  "Marcellus";
        font-size:38px;
        color:#937801;
        letter-spacing:10px;
        line-height:1.3;
        font-weight:normal;
    }
        .faqArea h1 span {
            display:block;
            width:100%;
            font-family: "Shippori Mincho", sans-serif;
            font-size:18px;
            color:#FCFCFC;
            letter-spacing:1px;
        }


    .faqArea .faq {
        margin:0 auto 20px auto;
        padding-bottom:20px;
        width:360px;
        background-image:url(../img/ico-off.svg);
        background-position:right 0;
        background-repeat:no-repeat;
        border-bottom:1px solid #707070;
    }
    .faqArea .faq.active {
        background-image:url(../img/ico-on.svg);
        background-position:right 12px;
    }
        .faqArea .faq .ttl {
            padding:0 45px 0 28px;
            font-size:15px;
            text-align:left;
            background-image:url(../img/ico-faqQ.svg);
            background-position:0 1px;
            background-repeat:no-repeat;
            cursor: pointer;
        }
        .faqArea .faq div {
            display:none;
            margin-top:10px;
            padding:0 45px 0 28px;
            font-size:15px;
            text-align:left;
            background-image:url(../img/ico-faqA.svg);
            background-position:0 1px;
            background-repeat:no-repeat;
        }

@media screen and (max-width: 1000px) {
    .faqArea {
        padding:0 0 21vw;
    }
        .faqArea h1 {
            margin-bottom:13.3vw;
            font-size:7.69vw;
            letter-spacing:1.67vw;
        }
            .faqArea h1 span {
                font-size:4.62vw;
                letter-spacing:0.17vw;
            }


        .faqArea .faq {
            margin:0 auto 3.33vw auto;
            padding-bottom:3.33vw;
            width:90%;
        }
        .faqArea .faq.active {
            background-position:right 3.08vw;
        }
            .faqArea .faq .ttl {
                padding:0 11.5vw 0 6.5vw;
                font-size:3.84vw;
                background-position:0 0.17vw;
                background-size:4.61vw auto;
            }
            .faqArea .faq div {
                margin-top:1.67vw;
                padding:0 11.5vw 0 6.5vw;
                font-size:3.84vw;
                background-position:0 0.28vw;
                background-size:4.61vw auto;
            }
}





.movieArea {
    margin:0 auto 100px auto;
    width:478px;
    text-align:center;
}
    .movieArea iframe {
        margin-bottom:5px;
    }
    
    .movieArea p {
        font-siz:14px;
    }
    
@media screen and (max-width: 1000px) {
    .movieArea {
        margin:0 auto 20vw auto;
        width:90%;
    }
        .movieArea iframe {
            width: 85vw;
            height: 49vw;
        }
    
        .movieArea p {
            font-size:90%;
        }
}





.contactArea {
    margin:0 auto 120px auto;
    width:478px;
    text-align:center;
}
    .contactArea h1 {
        margin:0 auto 40px auto;
        padding:10px 0;
        text-align:center;
        border-top:1px solid #FCFCFC;
        border-bottom:1px solid #FCFCFC;
    }
    .contactArea .txt1 {
        display:inline-block;
        margin:0 auto 30px auto;
        font-size:14px;
        text-align:left;
    }
    .contactArea .txt2 {
    }
        .contactArea .txt2 a {
            font-size:18px;
            color:#FCFCFC;
        }

@media screen and (max-width: 1000px) {
    .contactArea {
        margin:0 auto 20vw auto;
        width:90%;
    }
            .contactArea .txt2 a {
                font-size:4.6vw;
            }
}



/*
200 → 1.5px 0.7vw
150 → 1.2px 0.5vw
100 → 1px 0.3vw
50 → 0.8px 0.1vw

30px → 7.7vw
22px → 5.6vw
18px → 4.6vw
16px → 4.1vw
15px → 3.8vw
14px → 3.6vw
12px → 3vw
11px → 2.8vw
*/


/***********************************************
　フッター
***********************************************/

footer {
    margin:0 auto 100px auto;
    width:100%;
    text-align:center;
}

.snsArea {
    margin-bottom:40px;
    display:flex;
    align-items: center;
    justify-content: center;
}
    .snsArea li {
        display:flex;
        align-items: center;
        justify-content: center;
        margin:0 20px;
    }
        .snsArea li a {
            transition: 0.3s;
        }

@media screen and (min-width: 1001px) {
        .snsArea li a:hover {
            opacity:0.7;
            transition: 0.3s;
        }
}

.copyArea {
    font-size:12px;
    letter-spacing:1px;
}

@media screen and (max-width: 1000px) {
    .copy {
        font-size:3vw;
        letter-spacing:0.3vw;
    }
}

.pagetop {
    line-height:1;
    text-align:center;
}
    .pagetop a {
        display:block;
        padding:8px 0;
        width:100%;
        text-align:center;
        background:#B2B2B2;
        transition: 0.3s;
    }

@media screen and (min-width: 1001px) {
    .pagetop a:hover {
        opacity:0.7;
        transition: 0.3s;
    }
}