@charset "utf-8";

/***************************************************************************
Media Queries
****************************************************************************/

@media print, screen and (max-width: 1000px) {
}
@media only screen and (max-width: 768px) {
}



:root {
    --100vw: calc( 100vw - calc( 100vw - 100% ) );
    --header_main_nav_font_size: 1.8rem;
}
@media print, screen and (max-width: 1920px) {
    :root {
        --header_main_nav_font_size: calc( 100vw * 18 / 1920 );
    }
}
@media print, screen and (max-width: 1000px) {
    :root {
        --header_main_nav_font_size: calc( 100vw * 13 / 1000 );
    }
}
@media print, screen and (max-width: 768px) {
    :root {
        --header_main_nav_font_size: calc( 100vw * 16 / 768 );
    }
}


/***************************************************************************
.top_img_patch
****************************************************************************/
.top_img_patch {
    position: absolute;
    left: 20px;
    bottom: 20px;
    background-color: transparent;
    overflow: hidden;
    max-width: calc( 100vw * 300 / 1920 );
}
@media print, screen and (max-width: 768px) {
    .top_img_patch {
        display: none;
    }
}



/***************************************************************************
.top_img_bukken_logo
****************************************************************************/
@media print, screen and (max-width: 768px) {
    .top_img_bukken_logo {
        position: static;
        top: auto;
        left: auto;
        padding: 3.0vw 0;
        margin: 0 auto;
        
    }
}



/***************************************************************************
#action_merit ( index.css line 363 )
****************************************************************************/
#action_merit {
    background-image: none;
    background-color: #d1dbe1;
}
@media print, screen and (max-width: 768px) {
    #action_merit {
        background-color: #fff;
    }
}

/***************************************************************************
#action_merit .contents ( index.css line 370 )
****************************************************************************/
#action_merit .contents {
    width: 100%;
    max-width: calc( 100vw * 1636 / 1920 );
}
@media print, screen and (max-width: 768px) {
    #action_merit .contents {
        max-width: none;
        padding: 0 calc( 100vw * 40 / 768 );
    }
}

/***************************************************************************
#action_merit li ( index.css line 376 )
****************************************************************************/
#action_merit li {
    padding: calc( 100vw * 35 / 1920 );
}
@media print, screen and (max-width: 768px) {
    #action_merit li {
        background: none;
        background-color: #d1dbe1;
        padding: calc( 100vw * 30 / 768 ) 0;
    }
}

/***************************************************************************
#action_merit li:before ( index.css line 384 )
****************************************************************************/
#action_merit li:before {
    height: calc( 100vw * 92 / 1920 );
}

/***************************************************************************
#action_merit li img ( index.css line 380 )
****************************************************************************/
#action_merit li img:first-child {
    width: calc( 100vw * 493 / 1920 );
}
#action_merit li img:nth-child(2) {
    width: calc( 100vw * 502 / 1920 );
}
#action_merit li img:nth-child(3) {
    width: calc( 100vw * 471 / 1920 );
}
@media print, screen and (max-width: 768px) {
    #action_merit li img:first-child {
        width: calc( 100vw * 583 / 768 );
        max-width: none;
    }
    #action_merit li img:nth-child(2) {
        width: calc( 100vw * 558 / 768 );
        max-width: none;
    }
    #action_merit li img:nth-child(3) {
        width: calc( 100vw * 594 / 768 );
        max-width: none;
    }
}



/***************************************************************************
.priceobi
****************************************************************************/
.priceobi {
}
@media print, screen and (max-width: 768px) {
    .priceobi {
        width: 100%;
        border-bottom: 1px #333 solid;
    }
}

/***************************************************************************
.priceobi ul ( index.css line 380 )
****************************************************************************/
.priceobi ul {
    /* max-width: calc( 100vw * 1200 / 1920 ); */
    /* max-width: calc( 100vw *740 / 1920 ); */
    max-width: calc( 100vw *850 / 1920 );
    align-items: end;
}
@media print, screen and (max-width: 768px) {
    .priceobi ul {
        width: 100%;
        max-width: calc( 100vw * 595 / 768 );
        border-bottom: none;
    }
}

/***************************************************************************
.priceobi ul li ( index.css line 510 )
****************************************************************************/
.priceobi ul li {
    padding: calc( 100vw * 20 / 1920 ) calc( 100vw * 5 / 1920 ) ;
}
@media print, screen and (max-width: 768px) {
    .priceobi ul li {
        padding: calc( 100vw * 20 / 768 ) 0 0 0;
    }
    .priceobi ul li:last-child {
        padding: calc( 100vw * 20 / 768 ) 0 calc( 100vw * 20 / 768 ) 0;
    }
    .priceobi ul li::before {
        margin-bottom: calc( 100vw * 20 / 768 );
    }
}

/***************************************************************************
.priceobi ul li:before ( index.css line 514 )
****************************************************************************/
.priceobi ul li::before {
    height: calc( 100vw * 50 / 1920 );
}
@media print, screen and (max-width: 768px) {
    .priceobi ul li::before {
        height: 1px;
    }
}

/***************************************************************************
.priceobi li img
****************************************************************************/
.priceobi li:first-child img {
    width: calc( 100vw * 400 / 1920 );
}
.priceobi li:nth-child(2) img {
    width: calc( 100vw * 400 / 1920 );
}
.priceobi li:nth-child(3) img {
    width: calc( 100vw * 400 / 1920 );
}
@media print, screen and (max-width: 768px) {
    .priceobi li img:first-child {
        margin: 0;
        width: calc( 100vw * 595 / 768 );
    }
    .priceobi li img:nth-child(2) {
        margin: 0;
        width: calc( 100vw * 595 / 768 );
    }
    .priceobi li img:nth-child(3) {
        margin: 0;
        width: calc( 100vw * 595 / 768 );
    }
}



/***************************************************************************
#page_ttl ( index.css line 577 )
****************************************************************************/
#page_ttl.contents {
    max-width: calc( 100vw * 1400 / 1920 );
}
@media print, screen and (max-width: 768px) {
    #page_ttl {
        margin-bottom: 0;
    }
    #page_ttl.contents {
        width: 100%;
        max-width: none;
        padding: calc( 100vw * 50 / 768 ) calc( 100vw * 40 / 768 ) calc( 100vw * 10 / 768 );
    }
}

/***************************************************************************
#page_ttl ul ( index.css line 580 )
****************************************************************************/
#page_ttl ul {
    margin-bottom: calc( 100vw * 50 / 1920 );
    margin-top: calc( 100vw * 70 / 1920 );
}
@media print, screen and (max-width: 768px) {
    #page_ttl ul {
        margin: 0;
    }
}

/***************************************************************************
#page_ttl .ttl33 ( index.css line 577 )
****************************************************************************/
#page_ttl .ttl33 {
    font-size: calc( 100vw * 79 / 1920 );
    font-weight: bold;
}
#page_ttl .ttl33 span:first-child {
    margin-bottom: calc( 100vw * 10 / 1920 );
}
#page_ttl .ttl33 .exp_01 {
    font-size: calc( 100vw * 30 / 1920 );
    font-weight: normal;
}
#page_ttl .ttl33 .exp_02 {
    font-size: calc( 100vw * 30 / 1920 );
    font-weight: normal;
    margin-bottom: calc( 100vw * 70 / 1920 );
}
#page_ttl .ttl33 .exp_03 {
    font-size: calc( 100vw * 64 / 1920 );
    font-weight: bold;
}
#page_ttl .ttl33 .exp_04 {
    font-size: calc( 100vw * 50 / 1920 );
    font-weight: bold;
    line-height: 1.3;
}

#page_ttl .ttl33 .exp_04:first-child {
    margin-bottom: 40px;
    margin-bottom: calc( 100vw * 10 / 1920 );
}

#page_ttl .ttl33 .exp_05 {
    font-size: calc( 100vw * 30 / 1920 );
    font-weight: 600;
    margin-bottom: calc( 100vw * 70 / 1920 );
}

#page_ttl .ttl33 .exp_06 {
    font-size: calc( 100vw * 24 / 1920 );
    font-weight: 600;
    margin-bottom: calc( 100vw * 70 / 1920 );
}

#page_ttl .ttl33 span.yoyaku {
    line-height: normal;
}
@media print, screen and (max-width: 768px) {
    #page_ttl .ttl33 {
        font-size: calc( 100vw * 94 / 768 );
        font-weight: 500;
    }
    #page_ttl .ttl33 span:first-child {
        margin-bottom: calc( 100vw * 40 / 768 );
    }
    #page_ttl .ttl33 .exp_01 {
        font-size: calc( 100vw * 30 / 768 );
    }
    #page_ttl .ttl33 .exp_02 {
        font-size: calc( 100vw * 30 / 768 );
        margin-bottom: calc( 100vw * 70 / 768 );
    }
    #page_ttl .ttl33 .exp_03 {
        font-size: calc( 100vw * 60 / 768 );
        font-weight: 500;
    }
    #page_ttl .ttl33 .exp_04 {
        font-size: calc( 100vw * 45 / 768 );
        font-weight: 500;
    }
    #page_ttl .ttl33 .exp_05 {
        font-size: calc( 100vw * 30 / 768 );
        margin-bottom: calc( 100vw * 70 / 768 );
    }
    #page_ttl .ttl33 .exp_06 {
        font-size: calc( 100vw * 20 / 768 );
        margin-bottom: calc( 100vw * 70 / 768 );
        font-weight: 500;
    }
    #page_ttl .ttl33 span.yoyaku {
        line-height: normal;
    }
}

/***************************************************************************
.reserve_btn .btn a ( index.css line 186 )
****************************************************************************/
.reserve_btn .btn a {
    font-size: calc( 100vw * 27 / 1920 );
    padding: calc( 100vw * 25 / 1920 ) calc( 100vw * 80 / 1920 );
}
@media print, screen and (max-width: 768px) {
    .reserve_btn .btn a {
        font-size: calc( 100vw * 30 / 768 );
        padding: calc( 100vw * 30 / 768 ) calc( 100vw * 100 / 768 );
    }
}

/***************************************************************************
.btn a:before ( parts_btn.css line 186 )
****************************************************************************/
.btn a:before {
    width: calc( 100vw * 30 / 1920 );
}
@media print, screen and (max-width: 768px) {
    .btn a:before {
        width: calc( 100vw * 40 / 768 );
    }
}



/***************************************************************************
#page_nav .box ( index.css line 1174 )
****************************************************************************/
#page_nav .box {
    height: auto;
    margin: 0;
}
@media print, screen and (max-width: 768px) {
}

/***************************************************************************
#page_nav .box .bg_img ( index.css line 1182 )
****************************************************************************/
#page_nav .box a.bg_img {
    display: block;
}
#page_nav .box .bg_img {
    position: relative;
    top: auto;
    left: auto;
    height: calc( 100vw * 1060 / 1920 );
}
@media print, screen and (max-width: 768px) {
    #page_nav .box .bg_img {
        position: relative;
        top: auto;
        left: auto;
        height: calc( 100vw * 540 / 750 );
    }
}

/***************************************************************************
#page_nav .box .contents ( index.css line 1202 )
****************************************************************************/
#page_nav .box .contents {
    max-width: calc( 100vw * 1400 / 1920 );
    height: auto;
}
@media print, screen and (max-width: 768px) {
    #page_nav .box .contents {
        width: 100%;
        max-width: none;
        height: auto;
        padding: 0 calc( 100vw * 40 / 768 );
    }
}

/***************************************************************************
#page_nav .info_box ( index.css line 1209 )
****************************************************************************/
#page_nav .info_box {
    max-width: none;
    width: 100%;
    height: auto;
    padding: calc( 100vw * 60 / 1920 ) 0 calc( 100vw * 170 / 1920 ) 0;
}
@media print, screen and (max-width: 768px) {
    #page_nav .info_box {
        margin-top: 0;
        padding: calc( 100vw * 60 / 750 ) 0;
    }
}

/***************************************************************************
#page_nav .info_box .ttl ( index.css line 1224 )
****************************************************************************/
#page_nav .info_box .ttl, 
#page_nav .info_box .txt {
    max-width: none;
    width: 100%;
}
#page_nav .info_box .txt {
    font-size: calc( 100vw * 26 / 1920 );
}
@media print, screen and (max-width: 768px) {
    #page_nav .info_box .ttl {
        margin-bottom: calc( 100vw * 40 / 750 );
    }
}

/***************************************************************************
#page_nav .info_box .ttl img ( index.css line 1232 )
****************************************************************************/
#page_nav .info_box .ttl img {
    margin-left: 0;
    width: calc( 100vw * 412 / 1920 );
}

/***************************************************************************
#page_nav .info_box .txt
****************************************************************************/
#page_nav .info_box .txt div {
}
@media print, screen and (max-width: 768px) {
    #page_nav .info_box .txt {
        font-size: calc( 100vw * 28 / 768 );
        margin-bottom: 4vw;
    }
}

/***************************************************************************
#page_nav .info_box .txt div
****************************************************************************/
#page_nav .info_box .txt div {
    display: inline-block;
    margin: 0;
}
@media print, screen and (max-width: 768px) {
    #page_nav .info_box .txt div {
        display: block;
    }
}

/***************************************************************************
#page_nav .info_box .morebtn
****************************************************************************/
#page_nav .info_box .morebtn {
    width: calc( 100vw * 170 / 1920 );
}
#page_nav .info_box .morebtn.en span {
    font-size: calc( 100vw * 16 / 1920 );
    letter-spacing: 0.15em;
}
#page_nav .info_box .morebtn.en span::before {
    width: calc( 100vw * 200 / 1920 );
    right: calc( 100vw * -30 / 1920 );
}
#page_nav .info_box:hover .morebtn.en span::before {
  right: calc( 100vw * -60 / 1920 );
}
@media print, screen and (max-width: 768px) {
    #page_nav .info_box div.morebtn {
        width: calc( 100vw * 250 / 768 );
        margin: 4vw 0 0 auto;
    }
    #page_nav .info_box .morebtn.en span {
        font-size: calc( 100vw * 20 / 768 );
    }
    #page_nav .info_box .morebtn.en span::before {
        width: 200px;
        bottom: -100%;
        right: -30px;
    }
}


/***************************************************************************
#page_nav #design
****************************************************************************/
#page_nav #design .info_box .ttl img {
    width: calc( 100vw * 412 / 1920 );
}
#page_nav #design .txt {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
@media print, screen and (max-width: 768px) {
    #page_nav #design .bg_img {
        height: calc( 100vw * 540 / 750 );
    }
    #page_nav #design .bg_img .notes {
        text-align: right;
        bottom: 1vw;
        padding-right: 2vw;
    }
    #page_nav #design .info_box .ttl img {
        width: calc( 100vw * 309 / 750 );
    }
    #page_nav #design .txt {
        display: block;
    }
}


/***************************************************************************
#page_nav #commonspace
****************************************************************************/
#page_nav #commonspace .info_box .ttl img {
    width: calc( 100vw * 859 / 1920 );
}
#page_nav #commonspace .txt {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
@media print, screen and (max-width: 768px) {
    #page_nav #commonspace .bg_img {
        height: calc( 100vw * 540 / 750 );
    }
    #page_nav #commonspace .bg_img .notes {
        text-align: right;
        bottom: 1vw;
        padding-right: 2vw;
    }
    #page_nav #commonspace .info_box .ttl img {
        width: calc( 100vw * 661 / 750 );
    }
    #page_nav #commonspace .txt {
        display: block;
    }
}



/***************************************************************************
#page_nav #access
****************************************************************************/
#page_nav #access.box {
    display: flex;
    margin: 0 0 calc( 100vw * 100 / 1920 ) 0;
    width: 100%;
    height: calc( 100vw * 687 / 1920 );
}
#page_nav #access .bg_img {
    width: 50%;
    height: calc( 100vw * 687 / 1920 );
}
#page_nav #access .bg_img .notes {
    text-align: left;
}
#page_nav #access .contents {
    width: calc( 100vw * 620 / 1920 );
    height: calc( 100vw * 687 / 1920 );
    margin: 0 auto 0 calc( 100vw * 150 / 1920 );
}
#page_nav #access .info_box .ttl img {
    width: calc( 100vw * 307 / 1920 );
}
#page_nav #access .info_box .morebtn {
    margin: 0 0 0 auto;
}
@media print, screen and (max-width: 768px) {
    #page_nav #access.box {
        display: block;
        height: auto;
        margin: 0;
    }
    #page_nav #access .bg_img {
        width: 100%;
        height: calc( 100vw * 540 / 750 );
    }
    #page_nav #access .bg_img .notes {
        text-align: right;
        bottom: 1vw;
        padding-right: 2vw;
    }
    #page_nav #access .contents {
        width: 100%;
        max-width: none;
        height: auto;
        padding: 0 calc( 100vw * 40 / 768 );
        margin: 0 auto;
    }
    #page_nav #access .info_box .ttl img {
        width: calc( 100vw * 312 / 750 );
    }
    #page_nav #access .info_box .morebtn {
        width: calc( 100vw * 250 / 768 );
        margin-bottom: 4vw;
    }
}



/***************************************************************************
#page_nav #location
****************************************************************************/
#page_nav #location.box {
    display: flex;
    flex-direction: row-reverse;
    margin: 0 0 calc( 100vw * 100 / 1920 ) 0;
    width: 100%;
    height: calc( 100vw * 687 / 1920 );
}
#page_nav #location .bg_img {
    width: 50%;
    height: calc( 100vw * 687 / 1920 );
}
#page_nav #location .bg_img .notes {
    text-align: right;
    color: #000;
    text-shadow: none;
}
#page_nav #location .contents {
    width: calc( 100vw * 620 / 1920 );
    height: calc( 100vw * 687 / 1920 );
    margin: 0 calc( 100vw * 220 / 1920 ) 0 auto;
}
#page_nav #location .info_box .ttl img {
    width: calc( 100vw * 420 / 1920 );
}
#page_nav #location .info_box .morebtn {
    margin: 0 0 0 auto;
}
@media print, screen and (max-width: 768px) {
    #page_nav #location.box {
        display: block;
        height: auto;
        margin: 0;
    }
    #page_nav #location .bg_img {
        width: 100%;
        height: calc( 100vw * 540 / 750 );
    }
    #page_nav #location .bg_img .notes {
        text-align: right;
        bottom: 1vw;
        padding-right: 2vw;
    }
    #page_nav #location .contents {
        width: 100%;
        max-width: none;
        height: auto;
        padding: 0 calc( 100vw * 40 / 768 );
        margin: 0 auto;
    }
    #page_nav #location .info_box .ttl img {
        width: calc( 100vw * 429 / 750 );
    }
    #page_nav #location .info_box .morebtn {
        width: calc( 100vw * 250 / 768 );
        margin-bottom: 4vw;
    }
}



/***************************************************************************
#page_nav #development
****************************************************************************/
#page_nav #development.box {
    display: flex;
    margin: 0 0 calc( 100vw * 175 / 1920 ) 0;
    width: 100%;
    height: calc( 100vw * 687 / 1920 );
}
#page_nav #development .bg_img {
    width: 50%;
    height: calc( 100vw * 687 / 1920 );
}
#page_nav #development .bg_img .notes {
    text-align: right;
}
#page_nav #development .contents {
    width: calc( 100vw * 620 / 1920 );
    height: calc( 100vw * 687 / 1920 );
    margin: 0 auto 0 calc( 100vw * 150 / 1920 );
}
#page_nav #development .info_box .ttl img {
    width: calc( 100vw * 611 / 1920 );
}
#page_nav #development .info_box .morebtn {
    margin: 0 0 0 auto;
}
@media print, screen and (max-width: 768px) {
    #page_nav #development.box {
        display: block;
        height: auto;
        margin: 0;
    }
    #page_nav #development .bg_img {
        width: 100%;
        height: calc( 100vw * 540 / 750 );
    }
    #page_nav #development .bg_img .notes {
        text-align: right;
        bottom: 1vw;
        padding-right: 2vw;
    }
    #page_nav #development .contents {
        width: 100%;
        max-width: none;
        height: auto;
        padding: 0 calc( 100vw * 40 / 768 );
        margin: 0 auto;
    }
    #page_nav #development .info_box .ttl img {
        width: calc( 100vw * 625 / 750 );
    }
    #page_nav #development .info_box .morebtn {
        width: calc( 100vw * 250 / 768 );
        margin-bottom: 4vw;
    }
}



/***************************************************************************
#page_nav .page_nav_flexbox
****************************************************************************/
#page_nav .page_nav_flexbox {
    margin: 0;
    display: flex;
    justify-content: space-between;
    width: 100%;
}
@media print, screen and (max-width: 768px) {
    #page_nav .page_nav_flexbox {
        flex-wrap: wrap;
    }
}

/***************************************************************************
#page_nav .page_nav_flexbox .box
****************************************************************************/
#page_nav .page_nav_flexbox .box {
    width: 33%;
    max-width: calc( 100vw * 623 / 1920 );
}
@media print, screen and (max-width: 768px) {
    #page_nav .page_nav_flexbox .box {
        width: 50%;
        max-width: calc( 100vw * 370 / 750 );
        margin-bottom: 8vw;
    }
}

/***************************************************************************
#page_nav .page_nav_flexbox .box .bg_img
****************************************************************************/
#page_nav .page_nav_flexbox .box .bg_img {
    height: calc( 100vw * 460 / 1920 );
}
@media print, screen and (max-width: 768px) {
    #page_nav .page_nav_flexbox .box .bg_img {
        height: calc( 100vw * 260 / 750 );
    }
}

/***************************************************************************
#page_nav .page_nav_flexbox .box .bg_img .notes
****************************************************************************/
#page_nav .page_nav_flexbox .box .bg_img .notes {
    text-align: right;
}
@media print, screen and (max-width: 768px) {
    #page_nav .page_nav_flexbox .box .bg_img .notes {
        padding-right: 1vw;
        bottom: 1vw;
    }
}

/***************************************************************************
#page_nav .page_nav_flexbox .box .contents
****************************************************************************/
@media print, screen and (max-width: 768px) {
    #page_nav .page_nav_flexbox .box .contents {
        padding: 0 calc( 100vw * 15 / 750 );
    }
}

/***************************************************************************
#page_nav .page_nav_flexbox .info_box
****************************************************************************/
#page_nav .page_nav_flexbox .info_box {
    padding: calc( 100vw * 60 / 1920 ) 0;
}

/***************************************************************************
#page_nav .page_nav_flexbox .info_box .ttl
****************************************************************************/
#page_nav .page_nav_flexbox .info_box .ttl {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 0;
}
@media print, screen and (max-width: 768px) {
    #page_nav .page_nav_flexbox .info_box .ttl {
        display: flex;
        justify-content: space-between;
        align-items: flex-end;
        margin-bottom: 0;
    }
}

/***************************************************************************
#page_nav .page_nav_flexbox .info_box .ttl div
****************************************************************************/
#page_nav .page_nav_flexbox .info_box .ttl div {
    width: 100%;
}

/***************************************************************************
#page_nav .page_nav_flexbox .info_box .ttl img
****************************************************************************/
#page_nav .page_nav_flexbox .info_box .ttl img {
    width: 100%;
}

/***************************************************************************
#page_nav .page_nav_flexbox .info_box .ttl .morebtn
****************************************************************************/
#page_nav .page_nav_flexbox .info_box .ttl .morebtn {
    width: 10px;
    margin: 0 0 0 auto;
}

/***************************************************************************
#page_nav .page_nav_flexbox .info_box .morebtn.en span:before
****************************************************************************/
#page_nav .page_nav_flexbox .info_box .morebtn.en span:before {
    width: 103px;
    right: 30px;
    content: url("../../img/common/contents/arrow_short.png");
    transition: all 0.5s;
}
/***************************************************************************
#page_nav .page_nav_flexbox .info_box .morebtn.en span:before
****************************************************************************/
#page_nav .page_nav_flexbox .info_box:hover .morebtn.en span:before {
    right: 0;
}



/***************************************************************************
#page_nav #plan
****************************************************************************/
#page_nav #plan .info_box .ttl div {
    max-width: calc( 100vw * 189 / 1920 );
}
#page_nav .page_nav_flexbox #plan.box .bg_img .notes {
    color: #000;
    text-shadow: white 1px 1px 2px, white -1px 1px 2px, white 1px -1px 2px, white -1px -1px 2px;
}
@media print, screen and (max-width: 768px) {
    #page_nav #plan .info_box .ttl div {
        max-width: calc( 100vw * 148 / 750 );
    }
    #page_nav .page_nav_flexbox #plan.box .bg_img .notes {
        color: #fff;
        text-shadow: black 1px 1px 2px, black -1px 1px 2px, black 1px -1px 2px, black -1px -1px 2px;
    }
    #page_nav .page_nav_flexbox #plan .info_box .ttl .morebtn {
        width: 10px;
        margin: 0 0 0 auto;
    }
    #page_nav .page_nav_flexbox #plan .info_box .morebtn.en span:before {
        right: 0px;
    }
}


/***************************************************************************
#page_nav #quality
****************************************************************************/
#page_nav #quality .info_box .ttl div {
    max-width: calc( 100vw * 344 / 1920 );
}
@media print, screen and (max-width: 768px) {
    #page_nav #quality .info_box .ttl div {
        max-width: calc( 100vw * 271 / 750 );
    }
    #page_nav .page_nav_flexbox #quality .info_box .ttl .morebtn {
        width: 10px;
        margin: 0 0 0 auto;
    }
    #page_nav .page_nav_flexbox #quality .info_box .morebtn.en span:before {
        right: 0px;
    }
}



/***************************************************************************
#page_nav #brand
****************************************************************************/
#page_nav #brand .info_box .ttl div {
    max-width: calc( 100vw * 257 / 1920 );
}
@media print, screen and (max-width: 768px) {
    #page_nav #brand .info_box .ttl div {
        max-width: calc( 100vw * 203 / 750 );
    }
    #page_nav .page_nav_flexbox #brand .info_box .ttl .morebtn {
        width: 10px;
        margin: 0 0 0 auto;
    }
    #page_nav .page_nav_flexbox #brand .info_box .morebtn.en span:before {
        right: 0px;
    }
}



/***************************************************************************
.movieArea
****************************************************************************/
.movieArea {
    background-image: none;
    background-color: #f0f0f0;
}
.movieArea .section_ttl .en {
    font-size: calc( 100vw * 38 / 1920 );
}
.movieArea .section_ttl .jp {
    font-size: calc( 100vw * 18 / 1920 );
}
.movieArea .section_ttl::after {
    width: calc( 100vw * 72 / 1920 );
}
.movie_contents {
    justify-content: space-between;
    max-width: calc( 100vw * 1500 / 1920 );
}
.movie_contents li {
    width: 50%;
    max-width: calc( 100vw * 690 / 1920 );
    margin-bottom: calc( 100vw * 70 / 1920 );
}
.movie_contents li p {
    font-size: calc( 100vw * 20 / 1920 );
}
.movie_contents li .ttl.en {
    font-size: calc( 100vw * 36 / 1920 );
}
.movie_contents li a {
    display: block;
    width: 100%;
}
.movie_contents li a img {
    width: 100%;
}
@media print, screen and (max-width: 768px) {
    .movieArea .section_ttl .en {
        font-size: calc( 100vw * 40 / 750 );
    }
    .movieArea .section_ttl .jp {
        font-size: calc( 100vw * 23 / 750 );
    }
    .movieArea .section_ttl::after {
        width: calc( 100vw * 60 / 750 );
    }
    .movie_contents {
        width: 100%;
        max-width: none;
        padding: 0 calc( 100vw * 25 / 768 );
    }
    .movie_contents li {
        width: 50%;
        max-width: calc( 100vw * 340 / 750 );
        margin-bottom: calc( 100vw * 60 / 750 );
    }
    .movie_contents li p {
        font-size: calc( 100vw * 20 / 750 );
        margin-bottom: calc( 100vw * 30 / 750 );
    }
    .movie_contents li .ttl.en {
        font-size: calc( 100vw * 36 / 750 );
    }
}



/***************************************************************************
.premiumbn
****************************************************************************/
@media print, screen and (max-width: 768px) {
    .premiumbn {
        margin: 0 calc( 100vw * 25 / 768 );
    }
}

