@font-face {
font-family: 'user-Futura-DemiBold';
src: url(../../font/Futura-DemiBold.otf) format('opentype'),
    url(../../font/Futura-DemiBold.woff) format('woff');
}
.fixed {
    position: fixed;
    top: 0px;
    width: 100%;
    z-index: 30;
    left: 0;
}

.main_logo {
    opacity: 0;
    width:130px;	
    z-index: 20;

    transition: opacity .5s ease, -webkit-transform .8s ease;
    transition: transform .8s ease, opacity .5s ease;
    transition: transform .8s ease, opacity .5s ease, -webkit-transform 1s ease;
  
}

.fixed  img.main_logo {
    opacity: 1;
    transition: 1s ease-in-out;
    transition-delay: 0s;

    transition: opacity .5s ease, -webkit-transform .8s ease;
    transition: transform .8s ease, opacity .5s ease;
    transition: transform .8s ease, opacity .5s ease, -webkit-transform 1s ease;
}


.top_scroll {
    width:100%;
    z-index: 200;
    background-color: #FFF;
    margin-top:100vh;
    transition: all 1.5s;
}
.is_active {
  background-color: #d3cfbe;
  transition: all 1.5s;
}
/* Layout top scroll */

.topWrap:after {
    display: block;
    content: "";
    clear: both;
}


.top01-01,
.top01-01-3,
.top01-01-4,
.top01-01-5 {
    width:100%;
    margin:0px auto;
    padding:20vh 0 0;
}
.top01-01-2 {
    width:100%;
    margin:0px auto;
    padding:0;
}
.top01-02 {
    width:85%;
    margin:0px auto;
    padding:0;
}

.top01-02 {
    width:70%;
    margin:0 auto;
    text-align: center;
}
.top01-02-2 {
    width: 50%;
    margin: -10vh auto 0;
}
.top01-02-3 {
    width:80%;
    margin:20vh 0 0 auto;
}
.top01-03 {
    width: 90%;
    margin: -5% 0 0 auto;
    padding: 0;
}
.top01-04,
.top01-04-2 {
    width: 75%;
    margin: 85% 15% 0 5%;
}

.top02-01 {
    width:80%;
    text-align: center;
    margin:0 auto;
    padding:20vh 0px 0px 0px;
}

.top02-01-2,
.top02-01-2-2 {
    width:80%;
    text-align: center;
    margin:0 50px 0 auto;
    padding:20vh 0px 0px 0px;
}
.top02-01-3 {
    width: 92.5%;
    text-align: right;
    margin: 20vh 0px 0px 7.5%;
}
.top02-02,
.top02-02-2-2,
.top02-02-2-3 {
    width:70%;
    text-align: center;
    margin:0 auto;
    padding:20vh 0px 0px 0px;
}
.top02-02-2 {
    width: 100%;
    margin-left: 30px;
    padding: 20vh 0;
    float: left;
}
.top02-02-3,
.top02-02-3-2,
.top02-02-3-3 {
    width: calc(100% - 60px);
    margin-left: 30px;
    padding: 0;
    float: left;
}
.top02-02-4 {
    float: left;
    width: 60%;
    margin: 30vh 0 0 68%;
    padding: 0;
}
.top02-02-4-2 {
    float: left;
    width: 60%;
    margin: 30vh 0 0 68%;
    padding: 0;
}
.top02-02-4-3,
.top02-02-4-5 {
    width: 65%;
    margin: 45vh auto 0;
    padding: 0;
}
.top02-02-4-4 {
    width: 58%;
    margin: 45vh auto 0;
    padding: 0;
}
.top02-03 {
    width:100%;
    text-align: center;
    margin:0 auto;
    padding:0px;
}
.top02-03-2 {
    width: 100%;
    text-align: center;
    margin: 0 auto 0 12%;
    padding: 0px;
}

.top02-04 {
    padding: 20vh 0;
    margin-top: 30%;
    width: calc(100% - 40px);
}
.top02-04-2,
.top02-04-2-2 {
    margin: calc(30vh + 15%) 8% 0 auto;
    padding: 0;
    width: 50%;
    margin-right: 7%;
}
.top02-05 {
    width: 60%;
    text-align: center;
    margin: 0 auto;
    padding: 20vh 0px 0px 0px;
}
.top02-05-2,
.top02-05-2-2 {
    width: 45%;
    text-align: center;
    margin: 0 auto;
    padding: 20vh 0px 0px 0px;
}
.top02-06,
.top02-06-2-2 {
    width: 65%;
    text-align: center;
    padding: 20vh 0px 0px 0px;
    margin: 0 0 0 auto;
}
.top02-06-2 {
    width: 80%;
    text-align: center;
    padding: 20vh 0px 0px 0px;
    margin: 0 auto 0 0;
}
.top02-07 {
    width: 58%;
    text-align: center;
    margin: -15vh auto 10vh;
    padding: 0vh 0px 0px 10%;
    float: left;
}
.top02-07-2 {
    margin: 20vh auto 0 10%;
    width: 33%;
    z-index: 2;
}
.top02-07-3 {
    width: 45%;
    margin: 0 auto -30vh 10%;
}
.top03-01 {
    width:70%;
    padding:80vh 0px 0px 0px;
    text-align: center;
    margin:0 50px 0 auto;
}

.top03-02 {
    width:80%;
    padding:40vh 0px 0;
    text-align: center;
    margin:0 auto;
}

.top03-03,
.top03-03-3 {
    width:80%;
    padding:20vh 0px;
    text-align: center;
    margin:0 auto;
}
.top03-03-2 {
    width: calc(100% - 60px);
    margin: 50% 0 0 30px;
}
.top03-03-2-2 {
    width: calc(100% - 60px);
    margin: 20vh 0 0 30px;
}
.top03-04 {
    width:70%;
    padding:40vh 0px;
    text-align: center;
    margin:auto;
}

.top03-05 {
    width:70%;
    padding:27vh 0px 0px;
    text-align: center;
    margin:0 100px 0 auto;
}
.top03-06 {
    width: 56%;
    padding: 0;
    margin: -50% auto 0;
}
.top03-06-2,
.top03-06-2-2 {
    width: calc(100% - 50px);
    padding: 0;
    margin: 120% 50px 0 0;
    z-index: -1;
}
.top03-07 {
    width: 100%;
    padding: 0 0 50px 0;
    text-align: center;
    margin: 0;
}
.top03-08 {
    width: 33%;
    float: right;
    margin: 20vh 0 0 auto;
}
.top03-08-2 {
    width: 33%;
    margin: 20vh 50px 0 auto;
    float: right;
}
.top03-08-3 {
    width: 33%;
    float: right;
    margin: 20vh 50px;
}
.top03-08-4 {
    width: 30%;
    margin: 30vh auto 0 15%;
    float: left;
}
.top03-08-5 {
    width: 27%;
    float: right;
    margin: -35vh 20% 0 0;
}
.top04-01 {
    width: calc(50% - 100px);
    margin: 20vh 50px 0 50px;
    display: inline-block;
    vertical-align: middle;
}
.top04-02 {
    width: calc(50% - 100px);
    margin: 20vh 0 0 46px;
    vertical-align: middle;
    display: inline-block;
}
.top04-03 {
    width: 35%;
    margin: 0 0 0 10%;
    vertical-align: middle;
    display: inline-block;
}
.logo-02 {
    display: inline-block;
    width: calc(55% - 100px);
    text-align: center;
    vertical-align: bottom;
}
.logo-02 img {
    width: 30%;
}
.top05 {
    width: 70%;
    margin: 0 auto 200px;
    padding-top: 200px;
}
.top06 {
    width: 55%;
    padding: 0;
    margin: 20vh auto 0 100px;
}
.top06-02 {
    width: 30%;
    margin: 60vh auto auto -10%;
    padding: 0;
}
.top07 {
    width: 26%;
    margin: 20vh 50px 0;
}
.top07-2 {
    width: 30%;
    margin: 35vh 0 0 10%;
}
.top07-2-2 {
    width: 30%;
    position: relative;
    margin: -40vh auto 0 15%;
}
.top07-3 {
    width: 23%;
    margin: 90vh 0 0 -5%;
}
.top07-4 {
    width: 27%;
    margin: 45vh 7.5% 0 7.5%;
}
.top08 {
    width: 65%;
    margin: 20vh auto 0 100px;
    align-items: baseline;
}
.top08 p.anim {
    width: 70%;
}
.top09 {
    opacity: 1;
    margin: 10vh 0 0 auto;
    width: 70%;
    align-items: baseline;
}
.top09-2 {
    opacity: 1;
    margin: 30vh 5% 0 auto;
    width: 55%;
}
.top09-3 {
    opacity: 1;
    margin: 30vh 0 0 auto;
    width: 55%;
}
.top09 img {
    width: 80%;
}
.top10 {
    width: 26%;
    margin: 0 50px 0;
}
.top10:nth-of-type(2) {
    padding-top: 120px;
}
.top11 {
    width: 60%;
    margin: 50px auto;
    align-items: baseline;
}
.top11 img {
    width: 70%;
    margin-left: 15%;
}
    .top-caption {
    color: #000;
    text-align: center;
    font-size: 14px;
    padding-top: 20px;
    font-family: 'user-Futura-DemiBold', serif;
}
.top11 .top-caption {
    width: 20%;
}
.top12 {
    width: 30%;
    margin: 20vh 30px 0 auto;
    padding-top: 100px;
}
.top13 {
    width: 30%;
    margin: 20vh auto 0 30px;
    padding-top: 100px;
}
.top14 {
    width: 30%;
    margin: 20vh 30px 0 auto;
}
.top15 {
    width: 30%;
    margin: 20vh auto 0 30px;
}
.top-23ss-01 {
    margin: 30vh auto 0 50px;
    width: 33%;
}
.top-23ss-02 {
    width: 60%;
    margin: 90vh auto 0 -10%;
}
.top-23ss-03 {
    width: 30%;
    margin: 20vh 0 0 10%;
}
.top-23ss-04 {
    width: 30%;
    margin: 40vh auto 0 50px;
}
.top-23ss-05 {
    width: 33%;
    margin: 20vh 50px 0 0;
}
.top-23ss-06 {
    width: 33%;
    margin: 40vh 50px 0 auto;
}
.top-23ss-07 {
    width: calc(100% - 200px);
    margin: 20vh auto 0;
}
.top-23ss-08 {
    width: 50%;
    margin: calc(20vh + 120px) auto 0;
}
.top-23ss-09 {
    width: 70%;
    margin: 20vh 0 0 auto;
}
.top-text {
    margin: 20vh auto 0;
    width: 350px;
}
.top-23ss-10 {
    width: 60%;
    margin: 50px auto 0;
}
.top-23ss-11 {
    width: 33%;
    margin: 40vh 0 0 10%;
}
.top-23ss-12 {
    width: 28%;
    margin: 60vh 0 0 50px;
}
.top-23ss-13 {
    width: 30%;
    margin: 20vh 50px 0 calc(13% + 50px);
}
.top-23ss-14 {
    width: 30%;
    margin: 30vh auto 0 0;
}
.top-23ss-15 {
    width: calc(100% - 300px);
    margin: 20vh auto 0;
}
.top-23ss-16 {
    width: 40%;
    margin: calc(20vh + 120px) auto 0 100px;
}
.top-23ss-17 {
    width: 50%;
    margin: 80vh 95px 0 50px;
}
.top-23ss-18 {
    width: 35%;
    margin: 20vh 20% 0 45%;
}
.top-23ss-19 {
    width: 35%;
    margin: -50vh auto 0 50px;
}
.top-23aw-01 {
    width: 45%;
    margin: 0 auto;
    padding: 15% 0 8%;
}
.top-23aw-02 {
    width: 60%;
    margin: 50% 0 0 10%;
    z-index: 2;
}
.top-23aw-03 {
    width: 35%;
    margin: 20% 20% 0 -5%;
    z-index: 1;
}
.flex-colum {
    display: flex;
    width: 50%;
    flex-wrap: wrap;
    margin: 0 auto;
}
.flex-colum .fadein {
    width: 50%;
    display: flex;
}
.flex-colum .fadein:nth-last-of-type(4n-2) {
    transition-delay: 1s;
}
.flex-colum .fadein:nth-last-of-type(4n-3) {
    transition-delay: 0.6s;
}
.flex-colum .fadein:nth-last-of-type(4n-1) {
    transition-delay: 0.4s;
}
.flex-colum .fadein:nth-last-of-type(4n) {
    transition-delay: 0s;
}
.top-23aw-04 {
    margin: 50% auto 0 50px;
    width: 33%;
}
.top-23aw-05 {
    width: 38%;
    margin: 20% 10% 0;
}
.top-23aw-06 {
    width: 25%;
    margin: 20% 10% 0 auto;
}
.top-23aw-07 {
    width: 30%;
    margin: 40% auto 0 10%;
}
.top-23aw-08 {
    width: 35%;
    margin: -5% auto 0;
}

.top-caption-up {
    color: #000;
    text-align: center;
    font-size: 14px;
    margin: -100px 0 20vh 0;
    font-family: 'user-Futura-DemiBold', serif;
}
.top-caption-02 {
    padding-left: 20px;
    font-size: 14px;
    color: #000;
    font-family: 'user-Futura-DemiBold', serif;
}
.top-caption-03 {
    padding-right: 20px;
    font-size: 14px;
    color: #000;
    text-align: right;
    font-family: 'user-Futura-DemiBold', serif;
}
.footer_left {
    margin-top:10vh;
}
.pc_only {
    display: block;
}
.sp_only {
    display: none;
}

.anim {
    position: relative;
    -webkit-transition: all 1.25s ease-out;
    -ms-transition: all 1.25s ease-out;
    transition: all 1.25s ease-out;
}
.anim:after {
    display: block;
    content: '';
    width: 100%;
    height: 100%;
    background-color: #FFF;
    border: none;
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 1;
    transition: all 1200ms cubic-bezier(0.840, 0.005, 0.620, 0.910);
    -webkit-transition: all 1200ms cubic-bezier(0.840, 0.005, 0.620, 0.910);
    -ms-transition: all 1200ms cubic-bezier(0.840, 0.005, 0.620, 0.910);
    transition-timing-function: cubic-bezier(0.840, 0.005, 0.620, 0.910);
    -webkit-transition-timing-function: cubic-bezier(0.840, 0.005, 0.620, 0.910);
    -ms-transition-timing-function: cubic-bezier(0.840, 0.005, 0.620, 0.910);
}
.top10 .anim:after {
    display: block;
    content: '';
    width: 100%;
    height: 100%;
    background-color: #152a1d;
    border: none;
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 1;
    transition: all 1200ms cubic-bezier(0.840, 0.005, 0.620, 0.910);
    -webkit-transition: all 1200ms cubic-bezier(0.840, 0.005, 0.620, 0.910);
    -ms-transition: all 1200ms cubic-bezier(0.840, 0.005, 0.620, 0.910);
    transition-timing-function: cubic-bezier(0.840, 0.005, 0.620, 0.910);
    -webkit-transition-timing-function: cubic-bezier(0.840, 0.005, 0.620, 0.910);
    -ms-transition-timing-function: cubic-bezier(0.840, 0.005, 0.620, 0.910);
}
.top11.anim:after {
    display: block;
    content: '';
    width: 100%;
    height: 100%;
    background-color: #eaeaea;
    border: none;
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 1;
    transition: all 1200ms cubic-bezier(0.840, 0.005, 0.620, 0.910);
    -webkit-transition: all 1200ms cubic-bezier(0.840, 0.005, 0.620, 0.910);
    -ms-transition: all 1200ms cubic-bezier(0.840, 0.005, 0.620, 0.910);
    transition-timing-function: cubic-bezier(0.840, 0.005, 0.620, 0.910);
    -webkit-transition-timing-function: cubic-bezier(0.840, 0.005, 0.620, 0.910);
    -ms-transition-timing-function: cubic-bezier(0.840, 0.005, 0.620, 0.910);
}
.anim.anim-top_bottom:after {
    top: initial;
    bottom: 0px;
}
.isshow .anim.anim-top_bottom:after {
    height: 0;
}
.anim.anim-left_right:after {
    left: initial;
    left: auto;
    right: 0px;
}
.isshow .anim.anim-right_left:after {
    width: 0;
}
.isshow .anim.anim-left_right:after {
    width: 0;
}
.easein {
   opacity: 0;
   transition: all 1.5s 0s ease-out;
   transition-delay: 1s;
   position: relative;
}
.easein-2 {
   opacity: 0;
   transition: all 1.5s 0s ease-out;
   position: relative;
}
.isshow .easein,
.isshow .easein-2 {
    opacity: 1;
}

@media screen and (max-width:1080px) {
    
.top01-01,
.top01-01-5 {
    padding:10vh 0;
}
.top01-01-4 { 
    padding-top: 5vh;
}
.top01-02 {
    padding:20vh 0;
}
.top01-02-3 {
    margin-top: 10vh;
}
.top02-01-2,
.top02-01-2-2 {
    padding:15vh 0 0 0;
}

.top02-02,
.top02-02-2-2,
.top02-02-2-3 {
    padding:10vh 0px 0px 0px;
}
.top02-02-4-3,
.top02-02-4-5 {
    margin:23vh auto 0;    
}
.top02-02-4-4 {
    width: 50%;
    margin: 23vh auto 0;
}
.top02-05-2,
.top02-05-2-2 {
    padding-top: 25vh;
    width: 35%;
}
.top02-07 {
    width: 50%;
    margin: -6vh auto;
} 
.top02-07-2 {
    margin-top: 10vh;
}
.top02-07-3 {
    width: 35%;
}
.top03-01 {
    padding:60vh 0px 0px 0px;
}
.top03-02 {
    padding:20vh 0px 0;
}
.top03-03 {
    padding:20vh 0px;
}
.top03-03-3 {
    padding: 10vh 0;
}
.top03-04 {
    padding:20vh 0px;
}
.top03-05 {
    padding:10vh 0px;
    margin:30vh auto 0 ;
}
.top03-08,
.top03-08-2 {
    margin: 10vh 50px 2vh;
}
.top03-08-3 {
    margin-top: 10vh;
}
.top03-08-4 {
    margin-top: 15vh;
}
.top03-08-5 {
    margin-top: -15vh;
}
.top04-01,
.top04-02 {
    margin-top: 10vh;
}
.effect div.right-3 {
    margin-top: 30vh;    
}

.top07-2 {
    margin: 30% 0 0 10%;
}
.top07-3 {
    margin: 55% 0 0 -5%;
}
.top07-4 {
    margin: 35% 7.5% 0 7.5%;
}
.top12 {
    margin: 10% 30px 0 auto;
}
.top13 {
    margin: 10% auto 0 30px;
}
.top14 {
    margin: 10% 30px 0 auto;
}
.top15 {
    margin: 10% auto 0 30px;
}
.top09-2 {
    margin: 25% 5% 0 auto;
}
.top07-2-2 {
    margin: -25% auto 0 15%;
}
.top09-3 {
    margin: 10% 0 0 auto;
}
}
@media screen and (max-width:820px) {
.top-23ss-01 {
    margin: 30% auto 0 50px;
}
.top-23ss-02 {
    margin: 60% auto 0 -10%;
}
.top-23ss-03 {
    margin: 15% 0 0 70px;
}
.top-23ss-04 {
    margin: 25% auto 0 25px;
}
.top-23ss-05 {
    margin: 15% 50px 0 0;
}
.top-23ss-06 {
    margin: 40% 40px 0 auto;
}
.top-23ss-07 {
    margin: 0 auto 0;
}
.top-23ss-08 {
    margin: calc(15% + 120px) auto 0;
}
.top-23ss-09 {
    margin: 10% 0 0 auto;
}
.top-text {
    margin: 0 auto 0;
}
.top-23ss-11 {
    margin: 30% 0 0 10%;
}
.top-23ss-12 {
    margin: 45% 0 0 50px;
}
.top-23ss-13 {
    margin: 15% 50px 0 calc(13% + 50px);
}
.top-23ss-14 {
    margin: 25% auto 0 0;
}
.top-23ss-15 {
    margin: 0 auto 0;
}
.top-23ss-16 {
    margin: calc(15% + 120px) auto 0 100px;
}
.top-23ss-17 {
    margin: 55% 95px 0 50px;
}
.top-23ss-18 {
    margin: 15% 20% 0 45%;
}
.top-23ss-19 {
    margin: -25% auto 0 50px;
}
.top_caption_5 {
    margin: -20.5% 50px 0 auto;
}
    
}
@media screen and (max-width:768px) {
    
.fixed  img.main_logo {
    width: 100px!important;
    transition: 1s;
    transition-delay: 0s;
}
    
.top03-01 {
    padding:40vh 0px 0px 0px;
}
.top05 {
    width: 100%;
    padding: 0;
    margin: 0;
    line-height: 0;
}
.top02-05 {
    width: calc(100% - 100px);
    padding-top: 120px;
}
.top06 {
    width: 75%;
    padding: 0;
    margin: 120px auto 0 0px;
    float: left;
}
.top06-02 {
    width: 40%;
    margin: 0 0 0 auto;
    padding: 0;
    float: right;
}
.top07 {
    width: 55%;
    margin: 120px auto 0 0;
}
.top07:nth-of-type(2n) {
    margin: 50px auto 0;
}
.top07:nth-of-type(3n) {
    margin: 50px 0 0 auto;
}
.top08 {
    margin: 120px auto 0 0;
}
.top08 p.anim,
.top09 img {
    width: 100%;
}
.top09 {
    margin: 0;
    width: 100%;
}
.top10 {
    width: 65%;
    margin: 0 auto 50px;
}
.top10:nth-of-type(3n) {
    margin-top: -120px;
}
.effect div.right .top02-05 {
    padding-top: 0px;
}
.fadein-up.isshow:nth-of-type(2n),
.fadein-up.isshow:nth-of-type(3n) {
    transition-delay: 0s;
}
.effect div.left,
.effect div.right {
    width: 100%;
}
.flex {
    display: block;
    padding-top: 120px;
} 
    .flex:after {
        display: block;
        content: "";
        clear: both;
    }
.green {
    margin-top: 120px;
    position: relative;
}
.green02 {
    margin-top: 0px;
    position: relative;
    padding: 0;
    background-color: #fff;
}
.logo-02 {
    display: block;
    width: 100%;
    bottom: 150px;
    position: absolute;
}
.top-caption-02,
.top-caption-03 {
    padding-top: 20px;
    padding-left: 0;
    text-align: center;
}
.top-caption-up {
    margin: -100px 0 120px 0;
}
.pc_only {
    display: none;
}
.sp_only {
    display: block;
}
   
.top04-03 {
    width: 100%;
    margin: 0;
}
.logo-02 img {
    width: 200px;
}
.top07-2 {
    width: 60%;
    margin: 30% auto 0 0;
}
.top07-3 {
    margin: -20% 0 0 auto;
    width: 55%;
}
.top07-4 {
    margin: 10% auto;
    width: 70%;
}
.top11 {
    width: 100%;
    margin: 20% auto;
}
.top11 img {
    width: calc(100% - 50px);
    margin: 0 25px;
}
.top11 .top-caption {
    margin: 0 auto;
}
.top12 {
    margin: 0 10px 0 0;
    width: calc(50% - 10px);
    padding-top: 200px;
    float: left;
}
.top13 {
    margin: 0 0 0 10px;
    width: calc(50% - 10px);
    float: right;
    padding-top: 200px;
}
.top14 {
    margin: 0 10px 0 0;
    width: calc(50% - 10px);
    padding-top: 50px;
    float: left;
}
.top15 {
    margin: 0 0 0 10px;
    width: calc(50% - 10px);
    float: right;
    padding-top: 50px;
}
.top09-2 {
    margin: 40% 0 0 auto;
    width: 85%;
}
.top07-2-2 {
    margin: -25% auto 0 0;
    width: 45%;
    z-index: 2;
}
.top09-3 {
    margin: 20% auto 0 auto;
    width: 75%;
}
.top-23ss-01 {
    margin: 20% auto 0 0;
    width: 70%;
}
.top-23ss-02 {
    margin: -10% 0 0 auto;
    width: 80%;
}
.top-23ss-03 {
    margin: 0 auto 0 25px;
    width: 60%;
}
.top-23ss-04 {
    margin: 50px 25px 0 auto;
    width: 60%;
}
.top-23ss-05 {
    width: calc(60% + 25px);
    margin: 0 0 0 auto;
}
.top-23ss-06 {
    margin: 50px auto 0;
    width: calc(60% + 25px);
}
.top-23ss-07 {
    width: 100%;
}
.top-23ss-08 {
    width: calc(100% - 50px);
    margin: 250px auto 0;
}
.top-23ss-09 {
    width: 100%;
    margin: 100px 0 0 auto;
}
.top-23ss-10 {
    width: 100%;
    margin: 25px auto 0;
}
.top-23ss-11 {
    margin: 150px auto 0 25px;
    width: 80%;
}
.top-23ss-12 {
    margin: 50px auto 0;
    width: 55%;
}
.top-23ss-13 {
    width: 60%;
    margin: 0px auto 0;
}
.top-23ss-14 {
    width: 60%;
    margin: 45px 25px 0 auto;
}
.top-23ss-15 {
    width: 100%;
}
.top-23ss-16 {
    margin: 120px auto 0;
    width: 85%;
}
.top-23ss-17 {
    margin: 100px 0 0 25px;
    width: calc(100% - 25px);
}
.top-23ss-18 {
    width: 60%;
    margin: 100px auto 0;
}
.top-23ss-19 {
    margin: 50px auto 0 0;
    width: 60%;
}
.top_caption_5 {
    margin: 0px auto 0 25px;
}
    
.top-23aw-01 {
    width: 55%;
}
.top-23aw-02 {
    width: 65%;
    margin: 80% 0 0 0;
    z-index: 2;
    position: relative;
}
.top-23aw-03 {
    width: 65%;
    margin: -120% 0 0 auto;
}
.flex-colum {
    width: calc(100% - 50px);
    margin: 20% auto 0;
}
.top-23aw-05 {
    width: 75%;
    margin: 20% 0 0 auto;
}
.top-23aw-04 {
    margin: 10% auto 0 0px;
    width: 50%;
}
.top-23aw-06 {
    width: 65%;
    margin: 5% 0 0 auto;
}
.top-23aw-07 {
    width: 65%;
    margin: 10% auto 0 0;
}
.top-23aw-08 {
    width: 70%;
    margin: -5% 0 0 auto;
}
}

@media screen and (max-width: 428px) {   
    
.top_scroll {
  padding-bottom:0px;
}
    
.effect div.center {
  width:100%;
}

.effect div.left,
.effect div.left-2,
.effect div.left-3,
.effect div.left-4 {
  width:100%;
  float:none;
margin: 0;
}

.effect div.right,
.effect div.right-2 {
  width:100%;
  transition: 1.7s;
  float:none;
}
.top01-01-2 {
   width: 100%;     
}
.top01-01-3 {
    padding: 0;
    width: calc(100% - 50px);
}
.top01-01-4 {
    padding: 0;
    width: 60%;
    margin: 10vh auto;
}
.top01-01-5 {
    width: 85%;
    margin: 0 auto 0 0;
}
.top01-02 {
    padding: 10vh 0;
}

.top01-02 {
    width:85%;
    margin:0px auto;
    padding:20vh 0;
}
.top01-02 {
    padding: 10vh 0 0 0;
}
.top01-02-2 {
    width: 65%;
    margin: -100px 25px 0 auto;
}
.top01-03 {
    margin: -15% 0 0 auto;
    width: 70%;
}
.top01-04 {
    width: 75%;
    margin: 0 0 0 auto;
}
.top01-04-2 {
    width: 75%;
    margin: 0 0 0 auto;
}

.top02-01,
.top02-01-2 {
    width:80%;
    text-align: center;
    margin:0 auto;
    padding:10vh 0px 0px 0px;
}
.top02-01-2-2 {
    width: 95%;
    margin: 0 0 0 auto;
    padding: 0;
}
.top02-01-3 {
    width: 100%;
    margin: 10vh 0 0;
}

.top02-02 {
    padding:10vh 0 0 0;
}
.top02-02-2 {
    width: 60%;
    margin-left: 25px;
    padding: 10vh 0;
}
.top02-02-2-2 {
    width: 80%;
    padding: 10vh 0 0 0;
}
.top02-02-2-3 {
    width: 70%;
    margin: 10vh auto 0 0;
    padding: 0;
}
.top02-02-3 {
    width: 60%;
    margin: 0 auto 0 25px;
    float: none;
    padding-bottom: 10%;
}
.top02-02-3-2 {
    width: 60%;
    margin: -40% auto 0 15%;
    float: none;
    padding-bottom: 10%;
}
.top02-02-3-3 {
    width: 70%;
    margin: 10% auto 0 0;
    float: none;
    padding-bottom: 10%;
}
.top02-02-4-2 {
    width: 60%;
    margin: 10vh auto 0 30px;
    float: left;
}
.top02-02-4-3 {
    margin: 50px auto 0;
    width: 70%;
}
.top02-02-4-4 {
    margin: 0 0 0 auto;
    width: 70%;
}
.top02-02-4-5 {
    width: 80%;
    margin: 50px 0 0 auto;
}
.top02-03 {
    padding:10vh 0 0 0;
}
.top02-04 {
    width: 80%;
    margin: 0 0 0 20%;
    padding: 25% 0;
}
.top02-04-2-2 {
    width: 50%;
    margin: 0 0 0 auto;
    padding-top: 60vh;
}
.top02-05 {
    padding-top: 120px;
}
.effect div.right .top02-05 {
    padding-top: 50px;
}
.top02-05-2 {
    width: 70%;
    padding: 25% 0 0;
}
.top02-05-2-2 {
    width: 60%;
    margin: 20px auto 0 15px;
    padding: 0;
}
.top02-06 {
    width: 87%;
    padding: 25% 0;
}
.top02-06-2 {
    padding: 10vh 0 0 0;
}
.top02-06-2-2 {
    width: 55%;
    padding: 0;
    margin: 10vh auto 10vh 10%;
}
.top02-07 {
    width: 70%;
    margin: -80px auto 0;
}
.top02-07-2 {
    width: 50%;
}
.top02-07-3 {
    margin: 10vh auto 0 15px;
    width: 60%;
}
.top03-01 {
    padding: 10vh 0 0 0;
}
.top03-02 {
    width:100%;
    padding:0;
    text-align: center;
    margin:0 auto;
}
.top03-03 {
    width:80%;
    padding:25% 0px 5%;
    text-align: center;
    margin:0 auto;
}
.top03-03-2 {
    margin: 25% auto 0;
    width: calc(100% - 50px);
}
.top03-03-3 {
    width:100%;
    padding:10vh 0 0 0;
    text-align: center;
    margin:0 auto;
}
.top03-04 {
    width:70%;
    padding:40vh 0px;
    text-align: center;
    margin:auto;
}
.top03-05 {
    width: 65%;
    padding: 0 0 0 0;
    margin: 0 auto;
}
.top03-06 {
    margin: 15% auto 0 10%;
    width: 50%;
}
.top03-06-2 {
    width: 75%;
    margin: 10vh 0 0 0;
}
.top03-07 {
    padding: 0 0 20px 0;
}
.top03-08 {
    margin-right: 0;
    width: 70%;
}
.top03-08-2 {
    margin-right: 0;
    width: 70%;
    margin-top: 20px;
}
.top03-08-3 {
    width: 55%;
    margin-right: 25px;
    margin-bottom: 50px;
}
.top03-08-4 {
    width: 65%;
    margin: 0 auto 0 15px;
}
.top03-08-5 {
    margin: 50px 25px 0 auto;
    width: 45%;
}
.top04-01 {
    display: block;
    width: 50%;
    margin: 50px auto 0 0;
}
.top04-02 {
    width: 80%;
    margin: 50px auto 0;
    display: block;
}
    .top05 {
        width: 100%;
        height: auto;
        margin: 0;
        padding: 0;
    }
.top06-02 {
    margin-top: 50px;
}
.top07 {
    margin: 80px auto 0 0;
}
.top08 {
    margin: 80px auto 0 0;
}
.top09 {
    margin-top: -50px;
}
.green {
    margin-top: 80px;
}
.green02 {
    margin-top: 80px;
}
.right-2 .top03-06-2-2 {
    width: 80%;
    margin: 10vh 0 0 auto;
}
.right .top03-06-2-2 {
    width: 80%;
    margin: 3vh 0 0 auto;
}
.top_caption_2 {
    margin-left:20%; 
}
.top_caption_3 {
    margin-left:25px; 
    line-height: 1.7;
    letter-spacing: 0.05em;
}
.effect div.left-5 {
    width: 70%;
}
.effect div.right-3 {
    width: 90%;
    float: right;
    margin: 0;
}
.top07-2 {
    margin: 40% auto 0 0;
}
.top07-2-2 {
    margin: -45% auto 0 0;
}
.top-23ss-05 {
    margin: -60px 0 0 auto;
}
.top-23ss-13 {
    width: 60%;
    margin: -70px auto 0;
}
.top_caption_5 {
    margin: -80px auto 0 25px;
}
.top-23aw-01 {
    padding: 23% 0 20%;
}
}