  

@media only screen and (min-width: 768px) {




    #maincontent .smenu{
        position: absolute;
        left: 0;
        top: 50%;
        z-index: 1;
        margin-top: -125px;
    }

    #maincontent .smenu li {
        display: inline;
    }


    #maincontent .smenu li a {
        display: block;
        width: 70px;
        height: 30px;
        overflow: hidden;
        text-indent: -9999px;
        margin-top: 20px;
        margin-top: 20px;
    }


    #maincontent .smenu li:nth-child(1) a {
        background-image: url(/anniversary70th/succeed/img/mn1.png);
    }

    #maincontent .smenu li:nth-child(1) a:hover,#maincontent .smenu li:nth-child(1) a.active {
        background-image: url(/anniversary70th/succeed/img/mn1_over.png);
    }
    #maincontent .smenu li:nth-child(2) a {
        background-image: url(/anniversary70th/succeed/img/mn2.png);
    }

    #maincontent .smenu li:nth-child(2) a:hover,#maincontent .smenu li:nth-child(2) a.active {
        background-image: url(/anniversary70th/succeed/img/mn2_over.png);
    }


    #maincontent .smenu li:nth-child(3) a {
        background-image: url(/anniversary70th/succeed/img/mn3.png);
    }

    #maincontent .smenu li:nth-child(3) a:hover,#maincontent .smenu li:nth-child(3) a.active {
        background-image: url(/anniversary70th/succeed/img/mn3_over.png);
    }
    #maincontent .smenu li:nth-child(4) a {
        background-image: url(/anniversary70th/succeed/img/mn4.png);
    }

    #maincontent .smenu li:nth-child(4) a:hover,#maincontent .smenu li:nth-child(4) a.active {
        background-image: url(/anniversary70th/succeed/img/mn4_over.png);
    }


    #maincontent .smenu li:nth-child(5) a {
        background-image: url(/anniversary70th/succeed/img/mn5.png);
    }

    #maincontent .smenu li:nth-child(5) a:hover,#maincontent .smenu li:nth-child(5) a.active {
        background-image: url(/anniversary70th/succeed/img/mn5_over.png);
    }




    #maincontent .pages{
        position: absolute;
        left: 0;
        top: 0;

    }



    #maincontent .pages .page{
        position: absolute;
        left: 0;
        top: 0;
        overflow: hidden;

    }



    #maincontent .pages .page .image{
        position: absolute;
        left: 0;
        top: 0;
        overflow: hidden;
    }

    #maincontent .pages .page .image img{
        position: absolute;
        left: 0;
        top: 0;

    }

    #maincontent .pages .page .outer{
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;

    }


    #maincontent .pages .top{


    }

    #maincontent .pages .top .shadow{
        position: absolute;
        left: 0;
        top: 0;
        background-color: rgba(0,0,0,0.6);
        width: 100%;
        height: 100%;
    }




    #maincontent .pages .top .image{
        width: 100%;
        height: 100%;
    }



    #maincontent .pages .top h1{
        position: absolute;
        left: 50%;
        top: 50%;
        margin-left: -350px;
        margin-top: -148px;
    }



    #maincontent .pages .top .scroll a{
        position: absolute;
        left: 50%;
        bottom: 60px;
        margin-left: -28px;
    }





    #maincontent .pages .page1{
        background-color: #d6a74f;

    }



    #maincontent .pages .page1 .image{
       width: 40%;
        height: 100%;
    }

    #maincontent .pages .page1 .texts{
        position: absolute;
        left: 40%;
        top: 0;
        width: 60%;
        height: 100%;

    }
    #maincontent .pages .page1 .texts .inner{
        color: #fff;
        font-size:110%;
        line-height: 2em;
        width: 530px;
        position: absolute;
        left: 70px;
        top: 50%;
        margin-top: -180px;
    }
    #maincontent .pages .page1 .texts .body{
        margin-top: 40px;
    }




    #maincontent .pages .page2{
        background-color: #000;

    }


    #maincontent .pages .page2 .image{
        width: 100%;
        height: 100%;
    }

    #maincontent .pages .page2 .texts{
        position: absolute;
        left: 0%;
        top: 0;
        width: 60%;
        height: 100%;
        background-color: rgba(0,0,0,0.6);

    }
    #maincontent .pages .page2 .texts .inner{
        color: #fff;
        font-size:110%;
        line-height: 2em;
        width: 530px;
        position: absolute;
        right: 70px;
        top: 50%;
        margin-top: -180px;
    }
    #maincontent .pages .page2 .texts .body{
        margin-top: 40px;
    }



    #maincontent .pages .page3{
        background-color: #d6a74f;

    }



    #maincontent .pages .page3 .image{
        width: 40%;
        height: 100%;
    }

    #maincontent .pages .page3 .texts{
        position: absolute;
        left: 40%;
        top: 0;
        width: 60%;
        height: 100%;

    }
    #maincontent .pages .page3 .texts .inner{
        color: #fff;
        font-size:110%;
        line-height: 2em;
        width: 530px;
        position: absolute;
        left: 70px;
        top: 50%;
        margin-top: -180px;
    }
    #maincontent .pages .page3 .texts .body{
        margin-top: 40px;
    }






    #maincontent .pages .page4{
        background-color: #fff;

    }



    #maincontent .pages .page4 .image{
        width: 40%;
        left: 60%;
        height: 100%;
    }

    #maincontent .pages .page4 .texts{
        position: absolute;
        left: 0%;
        top: 0;
        width: 60%;
        height: 100%;

    }
    #maincontent .pages .page4 .texts .inner{
        color: #000;
        font-size:110%;
        line-height: 2em;
        width: 530px;
        position: absolute;
        right: 70px;
        top: 50%;
        margin-top: -250px;
    }
    #maincontent .pages .page4 .texts .body{
        margin-top: 40px;
    }


    #maincontent .pages .page4 .texts .link a{
        display: inline-block;
        margin-top: 40px;
        color: #000;
        background-image: url(/anniversary70th/succeed/img/arrow.png);
        background-repeat: no-repeat;
        background-position: right center;
        padding-right: 20px;
    }








    #maincontent .pages .page5{
        background-color: #d6a74f;

    }



    #maincontent .pages .page5 .image{
        width: 40%;
        height: 100%;
    }

    #maincontent .pages .page5 .texts{
        position: absolute;
        left: 40%;
        top: 0;
        width: 60%;
        height: 100%;

    }
    #maincontent .pages .page5 .texts .inner{
        color: #fff;
        font-size:110%;
        line-height: 2em;
        width: 530px;
        position: absolute;
        left: 70px;
        top: 50%;
        margin-top: -180px;
    }
    #maincontent .pages .page5 .texts .body{
        margin-top: 40px;
    }









    #maincontent .pages .ending{
        background-color: #000;

    }



    #maincontent .pages .ending .image{
        width: 100%;
        height: 100%;
    }


    #maincontent .pages .ending .texts{
        color: #000;
        font-size:110%;
        line-height: 2em;
        width: 800px;
        position: absolute;
        left: 50%;
        top: 15%;
        margin-left: -400px;
    }
    #maincontent .pages .ending .texts .body{
        margin-top: 40px;
        text-shadow: 0px 0px 3px #FFF;
    }






}











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




    #maincontent .pages{


    }


    #maincontent .pages .page{
        position: relative;

    }

    #maincontent .pages .page .body{
       background-color: #fff;
        padding-top: 30px;
        padding-bottom: 30px;
        padding-left: 15px;
        padding-right: 15px;
        line-height: 1.85em;
    }



    #maincontent .pages .top{
        position: relative;

    }


    #maincontent .pages .top h1{
        position: absolute;
        left:5%;
        top: 30%;
        width: 90%;
    }



    #maincontent .pages .top .scroll a{
        width: 16%;
        position: absolute;
        left: 42%;
        bottom: 10%;
    }

    #maincontent .pages .page4 .body{
        padding-bottom: 5px;

    }
    #maincontent .pages .page4 .texts .link{
        background-color: #fff;
        padding: 15px;
        padding-top: 0;
    }

    #maincontent .pages .page4 .texts .link a{
        font-size:90%;
        display:inline-block;
        color: #000;
        background-image: url(/anniversary70th/succeed/img/arrow.png);
        background-repeat: no-repeat;
        background-position: right center;
        padding-right: 20px;
    }






}
