/*スクロール先の位置*/
#point2{
    position: absolute;
    bottom: 0px;
    left:50%;
    transform: translateY(-50px) translateX(0);
    -webkit- transform: translateY(-50px) translateX(0);
}



/*スクロールボタン*/
    .bg_top a{
        color: white;
        padding-top: 60px;
        position: absolute;
        bottom: 20px;
        left: 50%;
        z-index: 3;
        display: inline-block;
        font-size: 2em;
        transform: translateY(0%) translateX(120%);
        -webkit- transform: translateY(0%) translateX(120%);
    }



/*スクロールボタンの矢印*/
.bg_top a span {
    position: absolute;
    top: 0;
    left: 50%;
    border-left: 2px solid #fff;
    border-bottom: 2px solid #fff;
    margin-left: -12px;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-animation: sdb 2s infinite;
    animation: sdb 2s infinite;
    box-sizing: border-box;
    z-index: 3;
}

/*お知らせ*/
.noteTop{
    width: 100%;
    min-height: 70px;
    margin: 0px;
    padding: 15px 0px;
    text-align: center;
    background-color: #d29700;
    position: absolute;
    bottom: 0%;
    left: 0%;
    text-shadow: 0px 0px 0px #221100;
    color: black;
}
.noteTop p{
    position: relative;
    left: 100px;
    padding: 0px;
    margin: 0px;
    font-size: 1.25em;
}
.noteTop p b{
    font-size: 1.5em;
    display: inline-block;
    margin-bottom:5px;
}

@-webkit-keyframes sdb {
  0% {
    -webkit-transform: rotate(-45deg) translate(0, 0);
  }
  20% {
    -webkit-transform: rotate(-45deg) translate(-10px, 10px);
  }
  40% {
    -webkit-transform: rotate(-45deg) translate(0, 0);
  }
}
@keyframes sdb {
  0% {
    transform: rotate(-45deg) translate(0, 0);
  }
  20% {
    transform: rotate(-45deg) translate(-10px, 10px);
  }
  40% {
    transform: rotate(-45deg) translate(0, 0);
  }
}

.bg_top, .bg_pic1, .bg_pic2 {
    color: white;
    text-shadow: 0px 0px 4px #221100;
}

    
/*背景*/
.bg_top {
    background-image:url('../img/bg01.jpg');
}
.bg_pic2 {
    background-image:url('../img/bg04.jpg');
}

@media screen and (max-width:1023px) {
    /*　画面サイズが1023pxまではここを読み込む　*/
    
    /*2段目の固定背景*/
    .bg_pic1::before {
        background-image:url('../img/bg02.jpg');
    }
    /*スクロールボタン*/
    .bg_top a{
        left: 50%;
        font-size: 4em;
        transform: translateY(0%) translateX(-50%);
        -webkit- transform: translateY(0%) translateX(-50%);
    }
    
    /*　ロゴ位置　*/
    .copyImg{
    position: absolute;
        top: 25%;
        left: 50%;
        z-index: 3;
    }
    .copyImg img{
        width: 750px;
    }
    .logoImg{
        position: absolute;
        top: 50%;
        left: 50%;
        z-index: 3;
    }
    .logoImg img{
        width: 400px;
    }
    
    /*スクロールボタンの矢印サイズ*/
    .bg_top a span {
        width: 36px;
        height: 36px;
    }
    /*お知らせ*/
    .noteTop{
        left:50%;
        bottom:-150px;
        min-height: 220px;
    }
    .noteTop p{
        left:0px;
        margin-top: 40px;
    }
}
/*スマホ表示ここまで*/

@media screen and (min-width:1024px) {
    /*　画面サイズが1024pxからはここを読み込む　*/
    
    /*2段目の固定背景*/
    .bg_pic1 {
        background-image:url('../img/bg02.jpg');
    }
    
    /*トップ背景位置、PCで少し右にずらす*/
    .bg_top {
        background-position:100px 0%;
    }
    /* ロゴ位置 */
    .copyImg{
        position: absolute;
        top: 27%;
        right: 7%;
        z-index: 3;
        display:none;
    }
    .copyImg img{
        width: 300px;
    }
    .logoImg{
    position: absolute;
    top: 48%;
    left: 50%;
        z-index: 3;
    }
    .logoImg img{
        width: 350px;
    }
    
    /*スクロールボタンの矢印サイズ*/
    .bg_top a span {
        width: 24px;
        height: 24px;
    }
}
/*PC表示ここまで*/

/*コピー中途半端なウインドウサイズでは非表示*/
@media screen and (min-width:1280px) {
    .copyImg{
        display:block;
    }
    .logoImg img{
        width: 350px;
    }
}
/*コピー表示ここまで*/