@charset "UTF-8";
/*=======================================
 	             SMACSS  base
 ========================================*/

/*=======================================
	         SMACSS  layout　　　　　　　       ( style.scss ) ( header.scss / main.scss / footer.scss ...) 
========================================*/
/*=======================================
 	        animation
 ========================================*/
.delay-time01 {
    animation-delay: 0.2s;
}
.delay-time02 {
    animation-delay: 0.5s;
}
.delay-time04 {
    animation-delay: 0.8s;
}
.box {
    opacity: 0;
}
.inview.active {
    animation-name: fadeUpAnime;
    animation-duration: 1s;
    animation-fill-mode: forwards;
    opacity: 0;
}
@keyframes fadeUpAnime {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

.fade {
    transition: all 2s;
    visibility: hidden;
    opacity: 0;
}
.fade.active {
    visibility: visible;
    opacity: 1;
}

.slick-dots li button {
    width: 0.8rem;
    height: 0.8rem;
    border-radius: 0;
}
.slick-dots li {
    margin: 0 0.5rem;
}
.slick-dots {
    position: absolute;
    bottom: -2.8rem;
    left: -0.5rem;
}
#sec07 .slick-dots {
    right: -0.5rem;
    left: auto;
}
#sec08 .slick-dots {
    right: -0.5rem;
    left: auto;
}

.sec1-ttl{
    font-family: quincy-cf, serif;
    font-weight: 400;
    font-style: normal;
    font-size: 2.2rem;
    letter-spacing: 0.035em;
}
.sec1-ttl{
    transform: rotate(90deg);
}
.js-typing{
    position: absolute;
    white-space: nowrap;
}
.js-typing {
    opacity: 0;
}
.js-typing.onView {
    opacity: 1;
}
.js-typing span {
    /* transition-duration: .5s; */
    opacity: 0;
}

.js-typing span.js-typing_on {
    animation: text_anime_on 0.5s ease-out forwards;
}

@keyframes text_anime_on {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.ttl .border {
    width: 0;
    height: 0.1rem;
    position: absolute;
    background-color: #999999;
}
#sec08 .border {
    top: 28rem;
    right: 61.1rem;
}
#sec11 .border {
    top: 30rem;
    right: 6.9rem;
}
#sec14 .border {
    bottom: 33rem;
    right: 5.7rem;
}
/* .ttl .border::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background: #fff;
} */
.ttl .js-typing.onView+.border {
    animation-name: border;
    animation-delay: 2s;
    animation-duration: 1.5s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
}

@keyframes border {

    from {
        width: 0;
    }

    to {
        width: 100%;
    }
}

/*=======================================
                  PC   
========================================*/
/* ===================
	　　 General
=================== */
html {
    font-size: 62.5%;
}

* {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

#breadcrumb.edit_lp .cateList {
    margin: 0 auto 30px 120px;
}

#mainLP_Contents {
    /* background-image: url(../img/pc.jpg); */
	background-repeat: no-repeat;
	background-size: 140rem; 
	background-position-x: center; 
	background-position-y: 1.4rem;
    overflow: hidden;
}
/* #mainLP_Contents::before{
	content: "";
	position: absolute;
	background-image: url(../img/pc2.jpg);
	background-size: contain;
	z-index: -1; 
	width: 140rem;
	height: 629rem;
	top: 1299.1rem;
	left: 0;
	right: 0;
	margin: auto;
} */
#wrapper {
    width: 140rem;
    margin: 2rem auto 12rem;
    -webkit-font-feature-settings: "palt";
    font-feature-settings: "palt";
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    color: #000;
}

/* ===================
	　　  common
=================== */
#wrapper img {
    max-width: 100%;
    height: auto;
    image-rendering: -webkit-optimize-contrast;
}
.sp_only {
    display: none;
}
.price {
    font-family: 'Crimson Text', serif;
    font-size: 1.2rem;
    letter-spacing: 0.02em;
    font-feature-settings: "palt";
}
.price li {
    margin-bottom: 1.2rem;
}
.price span {
    border-bottom: 0.1rem solid #e5e5e5;
}
#wrapper .flex {
    display: flex;
    align-items: flex-start;
}
.row-reverse {
    flex-direction: row-reverse;
    justify-content: flex-end;
}
.img {
    background-color: #fff;
}
/* Webフォントを定義 */
@font-face {
    font-family: 'Baskerville'; /* フォント名 */
    /* フォーマットごとにパスを指定 */
    src: url(../fonts/baskvl.ttf) format('truetype');
    }

@media screen and (max-device-width: 767px) {
    #breadcrumb .cateList {
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
    }
}
/* ===================
	　 mainview
=================== */
#mainview {
    position: relative;
    margin-bottom: 7.5rem;
    text-align: center;
}
h2 {
    position: relative;
    width: 110rem;
    margin: 0 auto 7.8rem;
}
#mainview a {
    width: 100%;
    height: 100%;
    display: block;
}
#mainview h3 {
    font-size: 2.6rem;
    font-family: quincy-cf, serif;
    font-weight: 400;
    font-style: normal;
    letter-spacing: 0.035em;
    margin-bottom: 2.2rem;
}
#mainview h3 span {
    font-family:'Baskerville', sans-serif;
    font-weight: 400;
    font-style: normal;
}
#mainview p {
    font-size: 1.2rem;
    line-height: 2.2;
    letter-spacing: 0.025em;
    margin-bottom: 1.8rem;
}

/* ===================
	　　 section01
=================== */
#sec01 {
    margin-bottom: 12rem;
}
#sec01 .contents-wrapper{
    margin-left: 16.8rem;
}
#sec01 .contents-image01 .img01 {
    margin-left: -4.5rem;
    z-index: 2;
}
#sec01 .contents-image01 .img01 .img-frame {
    width: 28.5rem;
    padding: 0 0 0.5rem 0.5rem;
    background-color: #fff;
}
#sec01 .contents-image01 .img02 {
    width: 42rem;
    margin-top: 16rem;
}
#sec01 .contents-image02{
    margin-top: 28rem;
    margin-left: 8rem;
}
#sec01 .contents-image02 video{
    width: 32.4rem;
}
#sec01 .price {
    margin-top: 2.5rem;
    text-align: right;
}

/* ===================
	　　 section02
=================== */
#sec02 {
    margin-bottom: -26.6rem;
}
#sec02 .contents-wrapper{
    margin-right: 2rem;
    justify-content: flex-end;
}
#sec02 .contents-image01 {
    width: 38rem;
}
#sec02 .contents-image02 {
    width: 34rem;
    margin-left: 3rem;
    margin-top: 24rem;
}
#sec02 .price {
    margin-top: 3rem;
    text-align: right;
}

/* ===================
	　　 section03
=================== */
#sec03 {
    margin-bottom: 18rem;
}
#sec03 .contents-wrapper{
    margin-left: 2rem;
}
#sec03 .contents-image01 {
    width: 30rem;
}
#sec03 .contents-image02 {
    margin-top: 20rem;
    margin-left: 4rem;
}
#sec03 .contents-image02 .img02 {
    position: relative;
    width: 44rem;
}
#sec03 .contents-image02 .img03 {
    width: 24rem;
    margin-top: 58rem;
    margin-left: 18rem;
}
#sec03 .price {
    margin-top: 3rem;
}
#sec03 .js-typing{
    position: absolute;
    width: 15.2rem;
    top: -20rem;
    right: 78.8rem;
}
#sec03 .border {
    left: -50rem;
    bottom: 17.5rem;
}

/* ===================
	　　  section04
=================== */
#sec04{
	margin-bottom: 14rem;
}
#sec04 .contents-wrapper01{
    margin-left: 7.5rem;
    margin-bottom: -33rem;
}
#sec04 .contents-image01 {
    width: 48rem;
}
#sec04 .contents-image02 {
    margin-left: 6rem;
    margin-top: 8rem;
}
#sec04 .contents-image02 .img03 {
    width: 24rem;
    margin-top: 14rem;
}
#sec04 .contents-image02 .img02 .img-frame {
    width: 24.5rem;
    padding: 0 0 0.5rem 0.5rem;
    background-color: #fff;
}
#sec04 .contents-image02 .img02 {
    margin-left: -1.5rem;
    z-index: 2;
}
#sec04 .contents-image01 .price {
    margin-top: 3rem;
}
#sec04 .img04 {
    width: 34rem;
    margin-left: 98.5rem;
    margin-bottom: -4rem;
}
#sec04 .img05 {
    width: 48rem;
    margin-left: 30.5rem;
}

/* ===================
	　　  section05
=================== */
#sec05{
    margin-bottom: 14rem;
}
#sec05 .contents-image01 {
    margin-left: 39.8rem;
    align-items: flex-end;
}
#sec05 .contents-image01 .img01,  #sec05 .contents-image01 .img02 {
    width: 36rem;
}
#sec05 .contents-image01 .img01 {
    margin-left: 2.8rem;
    order: 2;
}
#sec05 .contents-image01 .img02 {
    margin-left: 1rem;
    order: 3;
}
#sec05 .price {
    margin-bottom: -1rem;
    order: 1;
}

/* ===================
	　　  section06
=================== */
#sec06 {
    margin-bottom: 13rem;
}
#sec06 .contents-wrapper{
    margin-left: 17rem;
}
#sec06 .contents-image01 .img01 {
    width: 66rem;
}
#sec06 .contents-image01 .img01 img {
    width: 44rem;
}
#sec06 .contents-image01 .img02 {
    position: relative;
    margin-left: -28.5rem;
    margin-top: 47.5rem;
    z-index: 2;
}
#sec06 .contents-image01 .img02 .img-frame {
    width: 24.5rem;
    padding: 0.5rem 0 0 0.5rem;
    background-color: #fff;
}
#sec06 .contents-image02{
    width: 34rem;
    margin-top: 20rem;
    margin-left: 10rem;
}
#sec06 .price {
    margin-top: 3rem;
    text-align: right;
}
#sec06 .js-typing{
    position: absolute;
    width: 14.5rem;
    top: -16.6rem;
    right: 84.5rem;
}
#sec06 .border {
    left: -33rem;
    bottom: 14rem;
}

/* ===================
	　　  section07
=================== */
#sec07 {
    margin-bottom: -41rem;
}
#sec07 .contents-wrapper{
    margin-right: 2rem;
    justify-content: flex-end;
}
#sec07 .contents-image01 {
    width: 26rem;
}
#sec07 .contents-image02 {
    width: 40rem;
    margin-left: 6rem;
    margin-top: 16rem;
}
#sec07 .price {
    margin-top: 3rem;
}

/* ===================
	　　  section08
=================== */
#sec08 {
    margin-bottom: 12.8rem;
}
#sec08 .contents-wrapper{
    margin-left: 2rem;
}
#sec08 .contents-image01 video {
    width: 32.4rem;
}
#sec08 .contents-image02 {
    width: 36rem;
    margin-left: 6rem;
    margin-top: 37.2rem;
}
#sec08 .price {
    margin-top: 2.8rem;
}
/* ===================
	　　  section9
=================== */
#sec09{
    margin-bottom: 14.2rem;
}
#sec09 .contents-wrapper{
    margin-right: 12rem;
    justify-content: flex-start;
    align-items: flex-end;
}
#sec09 .contents-image01 {
    width: 36rem;
    margin-left: 3rem;
}
#sec09 .price {
    margin-bottom: 0.2rem;
}

/* ===================
	　　  section10
=================== */
#sec10 {
    margin-bottom: 14rem;
}
#sec10 .contents-wrapper{
    margin-left: 26.8rem;
    align-items: flex-end;
}
#sec10 .contents-image01, #sec10 .contents-image02 {
    width: 36rem;
}
#sec10 .contents-image01 {
    margin-left: 2.9rem;
}
#sec10 .contents-image02 {
    margin-left: 1rem;
}
#sec10 .price {
    margin-bottom: -1rem;
}

/* ===================
	　　  section11
=================== */
#sec11 {
    margin-bottom: 15.8rem;
}
#sec11 .contents-wrapper{
    margin-left: 5.5rem;
}
#sec11 .contents-image01 {
    margin-left: 14rem;
}
#sec11 .contents-image01 .img01 {
    width: 38rem;
    margin-left: 5rem;
}
#sec11 .contents-image01 .img02-all {
    margin-top: 52rem;
}
#sec11 .contents-image01 .img02 {
    width: 28rem;
}
#sec11 .contents-image02{
    width: 44rem;
    margin-top: 14rem;
}
#sec11 .contents-image01 .price {
    margin-top: 3rem;
    text-align: right;
}
#sec11 .contents-image02 .price {
    margin-top: 3rem;
}
#sec11 .js-typing{
    position: absolute;
    width: 15.2rem;
    top: 16.4rem;
    right: 78.8rem;
}
#sec11 .border {
    left: -50rem;
    top: 18.9rem;
}

/* ===================
	　　  section12
=================== */
#sec12 {
    margin-bottom: -21.4rem;
}
#sec12 .contents-wrapper{
    margin-left: 51.5rem;
}
#sec12 .contents-image01 {
    width: 26rem;
}
#sec12 .contents-image02 {
    width: 44rem;
    margin-left: 6rem;
    margin-top: 24rem;
}
#sec12 .contents-image02 .img02 {
    position: relative;
}
#sec12 .price {
    margin-top: 3rem;
}
#sec12 .js-typing{
    position: absolute;
    width: 14.5rem;
    top: -27.6rem;
    right: 82.5rem;
}
#sec12 .border {
    left: -53rem;
    top: -25.1rem;
}

/* ===================
	　　  section13
=================== */
#sec13{
    margin-bottom: -25.8rem;
    margin-left: 10rem;
}
#sec13 .contents-image01 {
    width: 36rem;
}
#sec13 .price {
    margin-top: 5.8rem;
}

/* ===================
	　　  section14
=================== */
#sec14 {
    margin-bottom: 10rem;
}
#sec14 .contents-wrapper{
    margin-right: 18rem;
    justify-content: flex-start;
}
#sec14 .contents-image01 {
    width: 36rem;
    margin-left: 4rem;
}
#sec14 .contents-image02 {
    width: 28rem;
    margin-top: 32rem;
}
#sec14 .price {
    margin-top: 3rem;
    text-align: right;
}

/* ===================
	　　  section15
=================== */
#sec15{
    margin-bottom: 10rem;
}
#sec15 .contents-wrapper{
    margin-left: 24rem;
    align-items: flex-end;
}
#sec15 .contents-image01 {
    width: 42rem;
}
#sec15 .price {
    margin-bottom: 0.2rem;
    margin-left: 3rem;
}

/* ===================
	　　  section16
=================== */
#sec16 {
    margin-bottom: 16.7rem;
}
#sec16 .contents-wrapper{
    margin-right: 27rem;
    justify-content: flex-start;
}
#sec16 .contents-image01 {
    width: 24rem;
    margin-left: 4rem;
}
#sec16 .contents-image02 {
    width: 38rem;
    margin-top: 14.1rem;
}
#sec16 .price {
    margin-top: 3rem;
    text-align: right;
}

/* ===================
	　　  section17
=================== */
#sec17 {
    margin-bottom: 9.8rem;
}
#sec17 .contents-wrapper{
    margin-left: 20.6rem;
}
#sec17 .contents-image01 {
    margin-left: 8rem;
}
#sec17 .contents-image01 .img01 {
    width: 36rem;
    margin-left: 1rem;
}
#sec17 .contents-image01 .img02 {
    width: 36rem;
}
#sec17 .contents-image02 video{
    width: 32.4rem;
    margin-top: 38rem;
}
#sec17 .price {
    margin-top: 3rem;
    text-align: right;
}

/* ===================
	　　  section18
=================== */
#sec18 {
    margin-bottom: 18rem;
}
#sec18 .contents-wrapper{
    margin-right: 16rem;
    justify-content: flex-start;
}
#sec18 .contents-image01 {
    width: 28rem;
    margin-left: 6rem;
}
#sec18 .contents-image02 {
    width: 42rem;
    margin-top: 20rem;
}
#sec18 .contents-image02 .img02 {
    position: relative;
}
#sec18 .price {
    margin-top: 3rem;
}
#sec18 .js-typing{
    position: absolute;
    width: 15.2rem;
    top: 15.4rem;
    right: 80.8rem;
}
#sec18 .border {
    left: -54rem;
    top: 17.9rem;
}
/* ===================
	　　  section19
=================== */
#sec19{
    margin-bottom: 18rem;
}
#sec19 .contents-wrapper{
    margin-right: 24rem;
    justify-content: flex-start;
    align-items: flex-end;
}
#sec19 .contents-image01 {
    width: 36rem;
    margin-left: 3rem;
}
#sec19 .price {
    margin-bottom: 0.2rem;
}

/* ===================
	　　  section20
=================== */
#sec20 {
    margin-bottom: 14rem;
}
#sec20 .contents-wrapper{
    margin-left: 5rem;
}
#sec20 .contents-image01 {
    
}
#sec20 .contents-image01 .img01 {
    z-index: 2;
}
#sec20 .contents-image01 .img01 .img-frame {
    width: 30.5rem;
    padding: 0 0.5rem 0.5rem 0;
    background-color: #fff;
}
#sec20 .contents-image01 .img02 {
    width: 40rem;
    margin-top: 41rem;
    margin-left: -2.5rem;
}
#sec20 .contents-image02{
    margin-top: 12rem;
    margin-left: 14rem;
}
#sec20 .contents-image02 .img03{
    position: relative;
    width: 58rem;
}
#sec20 .contents-image02 .img03 img{
    position: relative;
    width: 48rem;
}
#sec20 .contents-image01 .price {
    margin-top: 2.5rem;
}
#sec20 .contents-image02 .price {
    margin-top: 3rem;
    text-align: right;
    margin-right: 10rem;
}
#sec20 .js-typing{
    position: absolute;
    width: 15.6rem;
    top: -17.1rem;
    right: 91.4rem;
}
#sec20 .border {
    left: -49rem;
    top: -14.6rem;
}

/* ===================
	　　  section21
=================== */
#sec21 {
    margin-bottom: 17.6rem;
}
#sec21 .contents-wrapper{
    margin-left: 22rem;
}
#sec21 .contents-image01 {
    width: 30rem;
    margin-top: 24rem;
}
#sec21 .contents-image02 .img02 {
    width: 30rem;
    margin-left: -2.5rem;
}
#sec21 .contents-image02 .img03 {
    margin-top: 30.5rem;
    margin-left: -4.5rem;
    z-index: 2;
}
#sec21 .contents-image02 .img03 .img-frame {
    width: 38.5rem;
    padding: 0.5rem 0 0 0.5rem;
    background-color: #fff;
}
#sec21 .contents-image02{
    margin-left: 10.5rem;
}
#sec21 .price {
    margin-top: 3rem;
}

/* ===================
	　　  staff
=================== */
.staff p{
    text-align: center;
    font-family: 'Crimson Text', serif;
    font-size: 1.2rem;
    letter-spacing: 0.02em;
    line-height: 1.666;
    font-feature-settings: "palt";
}

/* ===================
	　　  button
=================== */
.m-btn {
    width: 80rem;
    margin: 3.6rem auto 2.1rem;
    position: relative;
    z-index: 2;
}
.m-btn a {
    width: 80rem;
    height: 6.2rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border: 0.1rem solid #000;
    background-color: #fff;
    font-family: "Crimson Text", serif;
    font-size: 1.1rem;
    line-height: 1.54;
    letter-spacing: 0.002em;
    text-align: center;
}

#dvUserBox table {
    background-color: #fff;
}

/*=======================================
               Responsive   
========================================*/
@media screen and (max-device-width: 767px) {
    #wrapper .sp_only {
        display: block!important;
    }
}
/* for SP */
@media screen and (max-width: 767px) {

    /*=======================================
                    SP    
  ========================================*/

    /* ===================
	　　 General
=================== */
    #breadcrumb .cateList {
        margin: 0 auto!important;
    }

    .main-area {
    /* background-image: url(/Page/PRE_ORDER/220715_AW1st/img/sp.jpg); */
	background-repeat: no-repeat;
	background-size: calc(750* (100vw / 750)); 
	background-position-x: center; 
	background-position-y: calc(174* (100vw / 750));
        overflow: hidden;
        position: relative;
    }
/*     .main-area::before{
	position: absolute;
	content: "";
	background-image: url(/Page/PRE_ORDER/220715_AW1st/img/sp2.jpg);
	background-repeat: no-repeat;
	width: calc(750* (100vw / 750)); 
	height: calc(15045* (100vw / 750));
	background-position-x: center; 
	top: calc(13247* (100vw / 750));
	overflow: hidden;
	background-size: inherit;
	z-index: -1;
} */
/* .main-area::before{
	position: absolute;
	content: "";
	background-image: url(/Page/PRE_ORDER/220715_AW1st/img/sp3.jpg);
	background-repeat: no-repeat;
	width: calc(750* (100vw / 750)); 
	height: calc(15045* (100vw / 750));
	background-position-x: center; 
	top: calc(27693* (100vw / 750));
	overflow: hidden;
	background-size: inherit;
	z-index: -1;
} */
/*     .main-area::after{
	position: absolute;
	content: "";
	background-image: url(/Page/PRE_ORDER/220715_AW1st/img/sp4.jpg);
	background-repeat: no-repeat;
	width: calc(750* (100vw / 750)); 
	height: calc(14045* (100vw / 750)) ;
	background-position-x: center; 
	top: calc(41475* (100vw / 750));
	overflow: hidden;
	background-size: inherit;
	z-index: -1;
} */

    .main-area .main-inner {
        width: 100%;
    }
    #wrapper {
        width: calc(750* (100vw / 750));
        margin: 0 auto;
        -webkit-font-feature-settings: "palt";
        font-feature-settings: "palt";
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }
    .row-reverse {
        flex-direction: row;
        justify-content: flex-start;
    }

    .slick-dots li button {
        width: calc(12* (100vw / 750));
        height: calc(12* (100vw / 750));
    }
    .slick-dots li {
        margin: 0 calc(9* (100vw / 750));
    }
    .slick-dots {
        position: absolute;
        bottom: calc(-42* (100vw / 750));
        left: calc(-9* (100vw / 750));
    }
    #sec05 .slick-dots{
        left: calc(255* (100vw / 750));
    }
    #sec07 .slick-dots {
        right: auto;
        left: calc(-9* (100vw / 750));
    }
    #sec08 .slick-dots {
        right: auto;
        left: calc(-9* (100vw / 750));
    }
    #sec16 .slick-dots {
        right: auto;
        left: calc(345* (100vw / 750));
    }
    /* ===================
　　  common
  =================== */
    #wrapper .sp_only {
        display: block!important;
    }
    .pc_only {
        display: none;
    }
    .price {
        font-size: calc(24* (100vw / 750));
        line-height: 2;
        letter-spacing: 0.01em;
        margin-top: calc(39* (100vw / 750));
    }
    .price span {
        border-bottom: calc(2* (100vw / 750)) solid #e5e5e5;
    }
    .ml {
        margin-left: calc(14* (100vw / 750));
    }
    #wrapper .flex {
        display: flex;
        flex-wrap: wrap;
        /* flex-direction: column; */
    }
    .price li {
        margin-bottom: 0;
    }


    .sec1-ttl {
        font-size: calc(36* (100vw / 750));
        letter-spacing: 0.035em;
    }
    .ttl .border {
        height: calc(2* (100vw / 750));
    }
    
    #sec03 .border {
        bottom: calc(330* (100vw / 750));
        left: calc(-256* (100vw / 750));
    }
    #sec08 .border {
        top: calc(300* (100vw / 750));
        right: calc(616* (100vw / 750));
    }
    #sec11 .border {
        top: calc(318* (100vw / 750));
        right: calc(-129* (100vw / 750));
    }
    #sec14 .border {
        bottom: calc(240* (100vw / 750));
        right: calc(-215* (100vw / 750));
    }

    /* ===================
	　 mainview
=================== */
#mainview {
    margin-bottom: calc(110* (100vw / 750));
}
h2 {
    width: 100%;
    margin: 0 auto calc(116* (100vw / 750));
}
#mainview h3 {
    font-size: calc(52* (100vw / 750));
    margin-bottom: calc(35* (100vw / 750));
}
#mainview p {
    font-size: calc(22* (100vw / 750));
    margin-bottom: calc(28* (100vw / 750));
}

/* ===================
	　　 section01
=================== */
#sec01 {
    margin-bottom: calc(133* (100vw / 750));
}
#sec01 .contents-wrapper{
    margin-left: 0;
}
#sec01 .contents-image01 .img01 {
    margin-left: auto;
    margin-bottom: calc(-30* (100vw / 750));
}
#sec01 .contents-image01 .img01 .img-frame {
    width: calc(490* (100vw / 750));
    padding: 0 0 calc(10* (100vw / 750)) calc(10* (100vw / 750));
}
#sec01 .contents-image01 .img02 {
    width: calc(630* (100vw / 750));
    margin-top: 0;
}
#sec01 .contents-image01{
    margin-bottom: calc(80* (100vw / 750));
}
#sec01 .contents-image02{
    margin-top: 0;
    margin-left: calc(198* (100vw / 750));
}
#sec01 .contents-image02 video{
    width: calc(522* (100vw / 750));
}
#sec01 .price {
    margin-top: calc(26* (100vw / 750));
    letter-spacing: 0.018em;
}

/* ===================
	　　 section02
=================== */
#sec02 {
    margin-bottom: calc(132* (100vw / 750));
}
#sec02 .contents-wrapper{
    margin-right: 0;
    justify-content: flex-start;
}
#sec02 .contents-image01 {
    width: calc(560* (100vw / 750));
    margin-left: calc(50* (100vw / 750));
    margin-bottom: calc(80* (100vw / 750));
}
#sec02 .contents-image02 {
    width: 100%;
    margin-left: 0;
    margin-top: 0;
}
#sec02 .contents-image02 .img02 {
    width: calc(510* (100vw / 750));
    margin-left: calc(190* (100vw / 750));
}
#sec02 .price {
    margin-top: calc(30* (100vw / 750));
    margin-right: calc(51* (100vw / 750));
}
#sec02 .ml{
    margin-left: calc(18* (100vw / 750));
}

/* ===================
	　　 section03
=================== */
#sec03 {
    margin-bottom: calc(200* (100vw / 750));
}
#sec03 .contents-wrapper{
    margin-left: 0;
}
#sec03 .contents-image01 {
    width: calc(580* (100vw / 750));
    margin-bottom: calc(60* (100vw / 750));
}
#sec03 .contents-image02 {
    margin-top: 0;
    margin-left: 0;
}
#sec03 .contents-image02 .img02 {
    width: calc(790* (100vw / 750));
    margin-left: auto;
    margin-bottom: calc(192* (100vw / 750));
}
#sec03 .contents-image02 .img02 img {
    width: calc(660* (100vw / 750));
    margin-left: calc(90* (100vw / 750));
}
#sec03 .contents-image02 .img03 {
    width: calc(360* (100vw / 750));
    margin-top: 0;
    margin-left: calc(300* (100vw / 750));
}
#sec03 .price {
    margin-top: calc(28* (100vw / 750));
    margin-left: calc(90* (100vw / 750));
}
#sec03 .js-typing{
    width: calc(248* (100vw / 750));
    top: calc(-316* (100vw / 750));
    right: calc(1462* (100vw / 750));
}
#sec03 .border {
    left: calc(-919* (100vw / 750));
    bottom: calc(274* (100vw / 750));
}

/* ===================
	　　  section04
=================== */
#sec04{
	margin-bottom: calc(140* (100vw / 750));
}
#sec04 .contents-wrapper01{
    margin-left: 0;
    margin-bottom: calc(60* (100vw / 750));
}
#sec04 .contents-image01 {
    width: calc(660* (100vw / 750));
    margin-bottom: calc(60* (100vw / 750));
}
#sec04 .contents-image02 {
    margin-left: 0;
    margin-top: 0;
}
#sec04 .contents-image02 .img03 {
    width: calc(400* (100vw / 750));
    margin-top: 0;
}
#sec04 .contents-image02 .img02 .img-frame {
    width: calc(410* (100vw / 750));
    padding: 0 0 calc(10* (100vw / 750)) calc(10* (100vw / 750));
}
#sec04 .contents-image02 .img02 {
    margin-left: auto;
    margin-bottom: calc(-368* (100vw / 750));
}
#sec04 .price {
    margin-top: calc(18* (100vw / 750));
    margin-right: calc(41* (100vw / 750));
    text-align: right;
}
#sec04 .img04 {
    width: calc(510* (100vw / 750));
    margin-left: calc(210* (100vw / 750));
    margin-bottom: calc(64* (100vw / 750));
}
#sec04 .img05 {
    width: 100%;
    margin-left: 0;
}

/* ===================
	　　  section05
=================== */
#sec05{
    margin-bottom: calc(152* (100vw / 750));
}
#sec05 .contents-image01 {
    margin-left: 0;
    align-items: flex-start;
    justify-content: center;
}
#sec05 .contents-image01 .img01 {
    width: calc(570* (100vw / 750));
    margin-left: auto;
    margin-right: auto;
    order: 1;
}
#sec05 .contents-image01 .img02 {
    margin-left: 1rem;
    order: 3;
}
#sec05 .price {
    margin-top: calc(70* (100vw / 750));
    margin-bottom: 0;
    order: 2;
    text-align: center;
    letter-spacing: 0.02em;
}

/* ===================
	　　  section06
=================== */
#sec06 {
    margin-bottom: calc(132* (100vw / 750));
}
#sec06 .contents-wrapper{
    margin-left: 0;
    justify-content: center;
}
#sec06 .contents-image01 .img01 {
    width: calc(925* (100vw / 750));
    margin-bottom: calc(60* (100vw / 750));
}
#sec06 .contents-image01 .img01 img {
    width: calc(750* (100vw / 750));
    margin-left: calc(87.5* (100vw / 750));
}
#sec06 .contents-image01 .img02 {
    width: calc(520* (100vw / 750));
    position: relative;
    margin: 0 auto calc(40* (100vw / 750));
}
#sec06 .contents-image01 .img02 .img-frame {
    width: calc(520* (100vw / 750));
    padding: 0;
}
#sec06 .contents-image02{
    width: calc(520* (100vw / 750));
    margin-top: 0;
    margin-left: auto;
    margin-right: auto;
}
#sec06 .price {
    margin-top: calc(28* (100vw / 750));
    text-align: center;
    letter-spacing: 0.03em;
}
#sec06 .js-typing{
    width: calc(237* (100vw / 750));
    top: calc(-346* (100vw / 750));
    right: calc(1431* (100vw / 750));
}
#sec06 .border {
    left: calc(-742* (100vw / 750));
    bottom: calc(304* (100vw / 750));
}
#sec06 .ml{
    margin-left: calc(7* (100vw / 750));
}

/* ===================
	　　  section07
=================== */
#sec07 {
    margin-bottom: calc(132* (100vw / 750));
}
#sec07 .contents-wrapper{
    margin-right: calc(30* (100vw / 750));
    justify-content: flex-end;
}
#sec07 .contents-image01 {
    width: calc(500* (100vw / 750));
    margin-bottom: calc(60* (100vw / 750));
}
#sec07 .contents-image02 {
    width: calc(600* (100vw / 750));
    margin-left: 0;
    margin-right: calc(90* (100vw / 750));
    margin-top: 0;
}
#sec07 .price {
    margin-top: calc(70* (100vw / 750));
}
#sec07 .ml{
    margin-left: calc(18* (100vw / 750));
}

/* ===================
	　　  section08
=================== */
#sec08 {
    margin-bottom: calc(191* (100vw / 750));
}
#sec08 .contents-wrapper{
    margin-left: 0;
}
#sec08 .contents-image01 {
    margin-bottom: calc(60* (100vw / 750));
    margin-left: calc(198* (100vw / 750));
}
#sec08 .contents-image01 video {
    width: calc(522* (100vw / 750));
}
#sec08 .contents-image02 {
    width: calc(600* (100vw / 750));
    margin-left: calc(30* (100vw / 750));
    margin-top: 0;
}
#sec08 .price {
    margin-top: calc(70* (100vw / 750));
}
#sec08 .ml{
    margin-left: calc(17* (100vw / 750));
}
/* ===================
	　　  section9
=================== */
#sec09{
    margin-bottom: calc(151* (100vw / 750));
}
#sec09 .contents-wrapper{
    margin-right: 0;
    align-items: flex-start;
}
#sec09 .contents-image01 {
    width: calc(540* (100vw / 750));
    margin-left: calc(170* (100vw / 750));
}
#sec09 .price {
    margin-top: calc(29* (100vw / 750));
    margin-bottom: 0;
    margin-left: calc(546* (100vw / 750));
}

/* ===================
	　　  section10
=================== */
#sec10 {
    margin-bottom: calc(132* (100vw / 750));
}
#sec10 .contents-wrapper{
    margin-left: 0;
    align-items: flex-start;
}
#sec10 .contents-image01 {
    width: calc(660* (100vw / 750));
    margin-left: 0;
    margin-bottom: calc(60* (100vw / 750));
}
#sec10 .contents-image02 {
    width: calc(520* (100vw / 750));
    margin-left: auto;
}
#sec10 .price {
    margin-bottom: 0;
    margin-top: calc(28* (100vw / 750));
    margin-left: calc(230* (100vw / 750));
}

/* ===================
	　　  section11
=================== */
#sec11 {
    margin-bottom: calc(132* (100vw / 750));
}
#sec11 .contents-wrapper{
    margin-left: 0;
}
#sec11 .contents-image01 {
    margin-left: 0;
    margin-bottom: calc(153* (100vw / 750));
}
#sec11 .contents-image01 .img01 {
    width: calc(600* (100vw / 750));
    margin-left: calc(50* (100vw / 750));
    margin-bottom: calc(60* (100vw / 750));
}
#sec11 .contents-image01 .img02-all {
    margin-top: 0;
    margin-left: calc(180* (100vw / 750));
}
#sec11 .contents-image01 .img02 {
    width: calc(520* (100vw / 750));
}
#sec11 .contents-image02{
    width: 100%;
    margin-top: 0;
}
#sec11 .contents-image02 .img03 {
    width: calc(825* (100vw / 750));
}
#sec11 .contents-image02 .img03 img {
    width: calc(750* (100vw / 750));
}
#sec11 .contents-image01 .price {
    margin-top: calc(70* (100vw / 750));
    text-align: left;
}
#sec11 .contents-image02 .price {
    margin-top: calc(28* (100vw / 750));
    text-align: center;
}
#sec11 .js-typing{
    width: calc(248* (100vw / 750));
    top: calc(332* (100vw / 750));
    right: calc(1330* (100vw / 750));
}
#sec11 .border {
    left: calc(-753* (100vw / 750));
    top: calc(371* (100vw / 750));
}

/* ===================
	　　  section12
=================== */
#sec12 {
    margin-bottom: calc(132* (100vw / 750));
}
#sec12 .contents-wrapper{
    margin-left: 0;
}
#sec12 .contents-image01 {
    width: calc(520* (100vw / 750));
    margin-bottom: calc(60* (100vw / 750));
}
#sec12 .contents-image02 {
    width: 100%;
    margin-left: 0;
    margin-top: 0;
}
#sec12 .contents-image02 .img02 {
    width: calc(790* (100vw / 750));
}
#sec12 .contents-image02 .img02 img {
    width: calc(660* (100vw / 750));
    margin-left: calc(90* (100vw / 750));
}
#sec12 .price {
    margin-top: calc(28* (100vw / 750));
    margin-left: calc(90* (100vw / 750));
}
#sec12 .js-typing{
    width: calc(237* (100vw / 750));
    top: calc(-315* (100vw / 750));
    right: calc(1348* (100vw / 750));
}
#sec12 .border {
    left: calc(-794* (100vw / 750));
    top: calc(-276* (100vw / 750));
}
#sec12 .ml{
    margin-left: calc(19* (100vw / 750));
}

/* ===================
	　　  section13
=================== */
#sec13{
    margin-bottom: calc(132* (100vw / 750));
    margin-left: calc(30* (100vw / 750));
}
#sec13 .contents-image01 {
    width: calc(540* (100vw / 750));
}
#sec13 .price {
    margin-top: calc(71* (100vw / 750));
}

/* ===================
	　　  section14
=================== */
#sec14 {
    margin-bottom: calc(192* (100vw / 750));
}
#sec14 .contents-wrapper{
    margin-right: 0;
}
#sec14 .contents-image01 {
    width: calc(600* (100vw / 750));
    margin-left: calc(120* (100vw / 750));
    margin-bottom: calc(60* (100vw / 750));
}
#sec14 .contents-image02 {
    width: calc(540* (100vw / 750));
    margin-top: 0;
    margin-left: calc(30* (100vw / 750));
}
#sec14 .price {
    margin-top: calc(28* (100vw / 750));
    text-align: left;
}
#sec14 .ml{
    margin-left: calc(18* (100vw / 750));
}

/* ===================
	　　  section15
=================== */
#sec15{
    margin-bottom: calc(151* (100vw / 750));
}
#sec15 .contents-wrapper{
    margin-left: calc(170* (100vw / 750));
    flex-direction: column;
    align-items: flex-start;
}
#sec15 .contents-image01 {
    width:calc(540* (100vw / 750));
}
#sec15 .price {
    margin-bottom: 0;
    margin-top: calc(28* (100vw / 750));
    margin-left: calc(401* (100vw / 750));
}

/* ===================
	　　  section16
=================== */
#sec16 {
    margin-bottom: calc(132* (100vw / 750));
}
#sec16 .contents-wrapper{
    margin-right: 0;
}
#sec16 .contents-image01 {
    width: calc(520* (100vw / 750));
    margin-left: auto;
    margin-right: auto;
    margin-bottom: calc(60* (100vw / 750));
}
#sec16 .contents-image02 {
    width: 100%;
    margin-top: 0;
}
#sec16 .price {
    margin-top: calc(71* (100vw / 750));
    text-align: center;
}
#sec16 .ml{
    margin-left: calc(17* (100vw / 750));
}

/* ===================
	　　  section17
=================== */
#sec17 {
    margin-bottom: calc(131* (100vw / 750));
}
#sec17 .contents-wrapper{
    margin-left: 0;
}
#sec17 .contents-image01 {
    margin-left: 0;
    margin-bottom: calc(80* (100vw / 750));
}
#sec17 .contents-image01 .img01 {
    width: calc(540* (100vw / 750));
    margin-left: auto;
    margin-bottom: calc(60* (100vw / 750));
}
#sec17 .contents-image01 .img02 {
    width: calc(660* (100vw / 750));
}
#sec17 .contents-image02 video{
    width: calc(600* (100vw / 750));
    margin-top: 0;
    margin-left: calc(110* (100vw / 750));
}
#sec17 .price {
    margin-top: calc(28* (100vw / 750));
    margin-left: calc(110* (100vw / 750));
    text-align: left;
}
#sec17 .ml{
    margin-left: calc(18* (100vw / 750));
}

/* ===================
	　　  section18
=================== */
#sec18 {
    margin-bottom: calc(192* (100vw / 750));
}
#sec18 .contents-wrapper{
    margin-right: 0;
}
#sec18 .contents-image01 {
    width: calc(540* (100vw / 750));
    margin-left: calc(30* (100vw / 750));
    margin-bottom: calc(40* (100vw / 750));
}
#sec18 .contents-image02 {
    width: 100%;
    margin-top: 0;
}
#sec18 .contents-image02 .img02 {
    width: calc(790* (100vw / 750));
}
#sec18 .contents-image02 .img02 img {
    width: calc(630* (100vw / 750));
    margin-left: calc(120* (100vw / 750));
}
#sec18 .price {
    margin-top: calc(29* (100vw / 750));
    margin-left: calc(120* (100vw / 750));
}
#sec18 .js-typing{
    width: calc(248* (100vw / 750));
    top: calc(-315* (100vw / 750));
    right: calc(1211* (100vw / 750));
}
#sec18 .border {
    left: calc(-669* (100vw / 750));
    top: calc(-276* (100vw / 750));
}
#sec18 .ml{
    margin-left: calc(18* (100vw / 750));
}
/* ===================
	　　  section19
=================== */
#sec19{
    margin-bottom: calc(153* (100vw / 750));
}
#sec19 .contents-wrapper{
    margin-right: 0;
    align-items: flex-start;
}
#sec19 .contents-image01 {
    width: calc(540* (100vw / 750));
    margin-left: calc(30* (100vw / 750));
}
#sec19 .price {
    margin-top: calc(28* (100vw / 750));
    margin-left: calc(31* (100vw / 750));
    margin-bottom: 0;
}

/* ===================
	　　  section20
=================== */
#sec20 {
    margin-bottom: calc(132* (100vw / 750));
}
#sec20 .contents-wrapper{
    margin-left: 0;
}
#sec20 .contents-image01 {
    margin-bottom: calc(192* (100vw / 750));
}
#sec20 .contents-image01 .img01 {
    margin-left: calc(240* (100vw / 750));
    margin-bottom: calc(60* (100vw / 750));
}
#sec20 .contents-image01 .img01 .img-frame {
    width: calc(480* (100vw / 750));
    padding: 0;
}
#sec20 .contents-image01 .img02 {
    width: calc(600* (100vw / 750));
    margin-top: 0;
    margin-left: 0;
}
#sec20 .contents-image02{
    margin-top: 0;
    margin-left: 0;
}
#sec20 .contents-image02 .img03{
    width: calc(925* (100vw / 750));
}
#sec20 .contents-image02 .img03 img{
    width: calc(710* (100vw / 750));
    margin-left: calc(40* (100vw / 750));
}
#sec20 .contents-image01 .price {
    width: 100%;;
    margin-top: calc(29* (100vw / 750));
    margin-left: calc(40* (100vw / 750));
}
#sec20 .contents-image02 .price {
    margin-top: calc(28* (100vw / 750));
    text-align: left;
    margin-right: 0;
    margin-left: calc(41* (100vw / 750));
}
#sec20 .js-typing{
    width: calc(255* (100vw / 750));
    top: calc(-248* (100vw / 750));
    right: calc(1353* (100vw / 750));
}
#sec20 .border {
    left: calc(-683* (100vw / 750));
    top: calc(-209* (100vw / 750));
}
#sec20 .img02 .ml{
    margin-left: calc(18* (100vw / 750));
}
#sec20 .contents-image02 .ml{
    margin-left: calc(16* (100vw / 750));
}

/* ===================
	　　  section21
=================== */
#sec21 {
    margin-bottom: calc(164* (100vw / 750));
}
#sec21 .contents-wrapper{
    margin-left: 0;
}
#sec21 .contents-image01 {
    width: calc(600* (100vw / 750));
    margin-top: 0;
    margin-left: auto;
    margin-bottom: calc(60* (100vw / 750));
}
#sec21 .contents-image02 .img02 {
    width: calc(450* (100vw / 750));
    margin-left: 0;
    margin-bottom: calc(-231* (100vw / 750));
}
#sec21 .contents-image02 .img03 {
    margin-top: 0;
    margin-left: auto;
}
#sec21 .contents-image02 .img03 .img-frame {
    width: calc(470* (100vw / 750));
    padding: calc(10* (100vw / 750)) 0 0 calc(10* (100vw / 750));
}
#sec21 .contents-image02{
    margin-left: 0;
}
#sec21 .price {
    margin-top: calc(29* (100vw / 750));
    text-align: center;
}
#sec21 .ml{
    margin-left: calc(17* (100vw / 750));
}

/* ===================
	　　  staff
=================== */
.staff p{
    font-size: calc(24* (100vw / 750));
    letter-spacing: 0.02em;
}

    /* ===================
  　　  button
  =================== */
    .m-btn {
        width: calc(630 *(100vw / 750));
        margin: calc(55 *(100vw / 750)) auto calc(98* (100vw / 750));
    }
    .m-btn a {
        width: calc(630 *(100vw / 750));
        height: calc(124 *(100vw / 750));
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        border: 1px solid #000;
        background-color: #fff;
        font-family: "Crimson Text", serif;
        font-size: calc(22 *(100vw / 750));
        line-height: 1.54;
        letter-spacing: 0.002em;
        text-align: center;
    }

}


/* for Tablet */
@media screen and (min-width: 768px) and (max-width: 1400px) {

    /*=======================================
                    Tablet    
  ========================================*/
    /* ===================
	　　 General
=================== */
    html {
        font-size: calc(10* (100vw / 1400))!important;
    }

    * {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }
    /* #wrapper {
  width: calc(1200 *(100vw / 1200));
  margin: calc(0 *(100vw / 1200)) ;
  -webkit-font-feature-settings: "palt";
          font-feature-settings: "palt";
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
} */

}

/*# sourceMappingURL=style.css.map */