@charset "utf-8";
/*
Theme Name:         mw_theme
Theme URI:          https://mediaworks-co.com/
Description:        HealingDetoxSalon reluckry since 2022 theme
Version:            1.0.0
Author:             MediaWorks Co.,Ltd.
Author URI:         https://mediaworks-co.com/
*/

html {
    font-size: 62.5%;
}
  
body {
    margin: 0;
/*    font-family: "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;*/
    font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
    font-style: normal;
    color: #1a1a1a;
    letter-spacing: 0.003em;
    line-height: 1.3;
    box-sizing: border-box;
    min-height: 100vh;
    -webkit-text-size-adjust:100%;
}
  
ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
  
p {
    margin: 0;
    font-size: 1.5rem;
}
@media screen and (min-width: 768px) {
    p {
        font-size: 1.8rem;
    }
}
  
a {
    text-decoration: none;
    color: unset;
}
@media screen and (-ms-high-contrast: none) {
    a {
        color: inherit;
    }
}

img {
    max-width: 100%;
    height: auto;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
}





/************************************************************
     COMMON STYLE
 ************************************************************/
/* h */
h1 {
    margin: 0;
}

h2 {
    margin: 0;
    font-size: 2rem;
    font-weight: normal;
}

/* display */
/* block */
.dis_bl {
    display: block;
}
.sp_dis_bl {
    display: block;
}

/* inline block */
.dis_ib {
    display: inline-block;
}

/* flex */
.dis_flx {
    display: flex;
}
.sp_dis_flx {
    display: flex;
}
@media ( orientation: landscape ) {
    .land_dis_flx {
        display: flex;
    }
}

/* none */
.sp_dis_none {
    display: none;
}

@media screen and (min-width: 500px) {
    .pc500_dis_flx {
        display: flex;
    }
}
@media screen and (min-width: 768px) {
    /* default */
    .sp_dis_none {
        display: initial;
    }
    
    /* block */
    .sp_dis_bl {
        display: unset;
    }
    .pc_dis_bl {
        display: block;
    }

    /* flex */
    .sp_dis_flx {
        display: unset;
    }
    .pc_dis_flx {
        display: flex;
    }
    
    /* none */
    .pc_dis_none {
        display: none;
    }
}


/* align */
.center {
    text-align: center;
}
.right {
    text-align: right;
}
.sp_right {
    text-align: right;
}
@media screen and (min-width: 768px) {
    .sp_right {
        text-align: unset;
    }
}
.left {
    text-align: left;
}


/* font color */
.foc_0000ff {
    color: #0000ff;
}

.foc_ff0000 {
    color: #ff0000;
}

.foc_fff {
    color: #fff;
}

.foc_e7e7e7 {
    color: #e7e7e7;
}

.foc_e0bfca {
    color: #e0bfca;
}

.foc_646464 {
    color: #646464;
}

.foc_ff5722 {
    color: #ff5722;
}

.foc_bfd6e1 {
    color: #bfd6e1;
}

.foc_aa9963 {
    color: #aa9963;
}

.foc_0471b6 {
    color: #0471b6;
}

.foc_8ec31d {
    color: #8ec31d;
}

.foc_b21f25 {
    color: #b21f25;
}

/* font size */
.fs_1 {
    font-size: 1rem;
}

.fs_105 {
    font-size: 1.5rem;
}

.fs_108 {
    font-size: 1.8rem;
}

.fs_2 {
    font-size: 2rem;
}

.fs_205 {
    font-size: 2.5rem;
}

.fs_3 {
    font-size: 3rem;
}

.fs_6 {
    font-size: 6rem;
}

.fs_10 {
    font-size: 10rem;
}

@media screen and (min-width: 768px) {
    .pc_fs_2 {
        font-size: 2rem;
    }
    .pc_fs_205 {
        font-size: 2.5rem;
    }
    .pc_fs_3 {
        font-size: 3rem;
    }
    .pc_fs_305 {
        font-size: 3.5rem;
    }
    .pc_fs_4 {
        font-size: 4rem;
    }
    .pc_fs_10{
        font-size: 10rem;
    }
}


/* font weight */
.fw_b {
    font-weight: bold;
}
@media screen and (min-width: 768px) {
    .pc_fw_b {
        font-weight: bold;
    }
}


/* margin */
/** xauto **/
.mar_0auto {
    margin: 0 auto;
}
.mar_05auto {
    margin: 0.4rem auto;
}
.mar_1auto {
    margin: 0.8rem auto;
}
.mar_2auto {
    margin: 1.6rem auto;
}
.sp_mar_2auto {
    margin: 1.6rem auto;
}
.mar_3auto {
    margin: 2.4rem auto;
}
.sp_mar_3auto {
    margin: 2.4rem auto;
}
.mar_4auto {
    margin: 3.2rem auto;
}
.mar_5auto {
    margin: 4rem auto;
}
.sp_mar_5auto {
    margin: 4rem auto;
}
.mar_10auto {
    margin: 8rem auto;
}

@media screen and (min-width: 768px) {
    .pc_mar_0auto {
        margin: 0rem auto;
    }
    .pc_mar_1auto {
        margin: 0.8rem auto;
    }
    .sp_mar_2auto {
        margin: unset;
    }
    .sp_mar_3auto {
        margin: unset;
    }
    .sp_mar_5auto {
        margin: unset;
    }
    .pc_mar_2auto {
        margin: 1.6rem auto;
    }
    .pc_mar_3auto {
        margin: 2.4rem auto;
    }
    .pc_mar_5auto {
        margin: 4rem auto!important;
    }
    .pc_mar_10auto {
        margin: 8rem auto;
    }
    .pc_mar_20auto {
        margin: 16rem auto;
    }
}

/** top **/
.marT_1 {
    margin-top: 0.8rem;
}
.marT_2 {
    margin-top: 1.6rem;
}
.sp_marT_2 {
    margin-top: 1.6rem;
}
.marT_4 {
    margin-top: 3.2rem;
}
.marT_5 {
    margin-top: 4rem;
}
.sp_marT_5 {
    margin-top: 4rem;
}
.sp_marT_8 {
    margin-top: 6.4rem;
}
.marT_10 {
    margin-top: 8rem;
}
.marT_15 {
    margin-top: 12rem;
}

@media screen and (min-width: 768px) {
    .sp_marT_2 {
        margin-top: unset;
    }
    .sp_marT_5 {
        margin-top: unset;
    }
    .sp_marT_8 {
        margin-top: unset;
    }
    .pc_marT_2 {
        margin-top: 1.6rem;
    }
    .pc_marT_5 {
        margin-top: 4rem;
    }
    .pc_marT_10 {
        margin-top: 8rem!important;
    }
    .pc_marT_20 {
        margin-top: 16rem;
    }
}

/** right **/
@media screen and (min-width: 768px) {
    .pc_marR_10 {
        margin-right: 10rem;
    }
}

/** bottom **/
.marB_1 {
    margin-bottom: 0.8rem;
}
.marB_2 {
    margin-bottom: 1.6rem;
}
.marB_3 {
    margin-bottom: 2.4rem;
}
.marB_4 {
    margin-bottom: 3.2rem;
}
.marB_20 {
    margin-bottom: 16rem;
}
@media screen and (min-width: 768px) {
    .pc_marB_1 {
        margin-bottom: 0.8rem;
    }
    .pc_marB_10 {
        margin-bottom: 10rem;
    }
}

/** left **/
.marL_05 {
    margin-left: 0.4rem;
}
.marL_1 {
    margin-left: 0.8rem;
}
.marL_105 {
    margin-left: 1.2rem;
}
.marL_2 {
    margin-left: 1.6rem;
}
.marL_3 {
    margin-left: 2.4rem;
}
@media screen and (min-width: 768px) {
    .pc_marL_1 {
        margin-left: 0.8rem;
    }
    .pc_marL_3 {
        margin-left: 2.4rem;
    }
    .pc_marL_5 {
        margin-left: 4rem;
    }
}

/** left & right **/
@media screen and (min-width: 768px) {
    .pc_marLR_1{
        margin: 0 0.8rem;
    }
}

/** special margin **/
.marL_05e {
    margin-left: 0.5em;
}
.marL_05e1 {
    margin-left: calc( 0.5em + 0.8rem );
}
.marL_1e {
    margin-left: 1em;
}
.marL_1e1 {
    margin-left: calc( 1em + 0.8rem );
}
.marB_705 {
    margin-bottom: 8rem;
}

/* padding */
/** top **/
.padT_2 {
    padding-top: 1.6rem;
}
.padT_3 {
    padding-top: 2.4rem;
}
.padT_5 {
    padding-top: 4rem;
}
.padT_7 {
    padding-top: 5.6rem;
}
@media screen and (min-width: 768px) {
    .pc_padT_6 {
        padding-top: 4.8rem;
    }
    .pc_padT_8 {
        padding-top: 6.4rem;
    }
    .pc_padT_10 {
        padding-top: 8rem;
    }
}

/** right **/
@media screen and (min-width: 768px) {
    .pc_padR_10 {
        padding-right: 10rem;
    }
}

/** bottom **/
.padB_2 {
    padding-bottom: 1.6rem;
}
.padB_3 {
    padding-bottom: 2.4rem;
}
.padB_5 {
    padding-bottom: 4rem;
}
.padB_7 {
    padding-bottom: 5.6rem;
}
@media screen and (min-width: 768px) {
    .pc_padB_6 {
        padding-bottom: 4.8rem;
    }
}

/** left **/
.padL_505 {
    padding-left: 4.4rem;
}
.padL_9 {
    padding-left: 7.2rem;
}
@media screen and (min-width: 768px) {
    .pc_padL_11 {
        padding-left: 8.8rem;
    }
    .pc_padL_10 {
        padding-left: 10rem;
    }
}

/** ALL **/
.padA_1 {
    padding: 0.8rem;
}
.padA_2 {
    padding: 1.6rem;
}
.padA_3 {
    padding: 2.4rem;
}
.padA_5 {
    padding: 4rem;
}
@media screen and (min-width: 768px) {
    .pc_padA_3 {
        padding: 2.4rem;
    }
    .pc_padA_5 {
        padding: 4rem;
    }
    .pc_padA_10 {
        padding: 8rem;
    }
}

/** special padding **/
@media screen and (min-width: 768px) {
    .pc_padT_805 {
        padding-top: 8.5rem;
    }
}


/* indent */
.indent {
    padding-left: 1em;
	text-indent: -1em;
}

/* position */
.ps_rl {
    position: relative;
}

.ps_ab {
    position: absolute;
}

.ps_fx {
    position: fixed;
}

.ps_un {
    position: unset!important;
}

/* background */
.bg_584b38c1 {
    background-color: #584b38c1;
}

.bg_bda590 {
    background-color: #bda590;
}

.bg_fff {
    background-color: #ffffff;
}

.bg_e7e7e7 {
    background-color: #e7e7e7;
}

.bg_8fc6a7 {
    background-color: #8fc6a7;
}

.bg_bfd6e1 {
    background-color: #bfd6e1;
}

.bg_646464 {
    background-color: #646464;
}

.bg_ff5722 {
    background-color: #ff5722;
}

.bg_0471b6 {
    background-color: #0471b6;
}

.bg_8ec31d {
    background-color: #8ec31d;
}

.bg_b21f25 {
    background-color: #b21f25;
}

.bg_c8dbe4 {
    background-color: #c8dbe4; 
}

.bg_f1b32a {
    background-color: #f1b32a;
}



/* width */
.w100 {
    width: 100%;
}
.sp_w100 {
    width: 100%;
}
@media screen and (min-width: 768px) {
    .sp_w100 {
        width: unset;
    }
    .pc_w100 {
        width: 100%;
    }
}

.w95 {
    width: 95%;
}
@media screen and (min-width: 768px) {
    .w95 {
        max-width: calc( 1000px - 5% );
    }
    .pc_w95 {
        width: 95%;
    }
}

.w75 {
    width: 75%;
}

.w50 {
    width: 50%;
}
@media screen and (min-width: 768px) {
    .pc_w50 {
        width: 50%;
    }
}

.max1000 {
    max-width: 1000px;
}

.sp_w250px {
    width: 250px;
}
@media screen and (min-width: 768px) {
    .sp_w250px {
        width: unset;
    }
}

/* height */
@media screen and (min-width: 768px) {
    .pc_hauto {
        height: auto;
    }
}

/* text decoration */
.txdc_ul {
    text-decoration: underline;
}
.txdc_lt {
    text-decoration: line-through;
}

/* flex box */
.alitm_c {
    align-items: center;
}
.aliitm_fs {
    align-items: flex-start;
}
.aliitm_fe {
    align-items: flex-end;
}
.jc_cen {
    justify-content: center;
}
.js_spbw {
    justify-content: space-between;
}
.jc_spev {
    justify-content: space-evenly;
}
.jc_spbw {
    justify-content: space-between;
}
.jc_spar {
    justify-content: space-around;
}
.flex_wrap {
    flex-wrap: wrap;
}
.flex_1 {
    width: calc( 100% / 3 );
}
.flex_2 {
    width: calc( 100% / 3 * 2 );
}
@media screen and (min-width: 768px) {
    .pc_flex_1 {
        width: calc( 100% / 3 );
    }
    .pc_flex_2 {
        width: calc( 100% / 3 * 2 );
    }
    .pc_jc_spev {
        justify-content: space-evenly;
    }
    .pc_jc_spbw {
        justify-content: space-between;
    }
    .pc_flex_wrap {
        flex-wrap: wrap;
    }
}
/* white-space */
.no_wrap {
    white-space: nowrap;
}

/* overflow */
.sp_of_s {
    overflow: scroll;
}

@media screen and (min-width: 768px) {
    .sp_of_s {
        overflow: unset;
    }
    .pc_of_h {
        overflow: hidden;
    }
}


/* line height */
.lh_1075 {
    line-height: 1.75;
}
.lh_2 {
    line-height: 2;
}
.sp_lh_105 {
    line-height: 1.5;
}
@media screen and (min-width: 768px) {
    .sp_lh_105 {
        list-style: unset;
    }
    .pc_lh_105 {
        line-height: 1.5;
    }
}

/* border */
.bod_1sl1a1a1a {
    border: 1px solid #1a1a1a;
}



/************************************************************
     COMMON PARTS
 ************************************************************/
/* MENU  BAR */
header {
    z-index: 999;
    padding: 0.4rem;
}
@media screen and (min-width: 768px) {
    header {
        padding: 1.6rem
    }
}

.logo_img {
    width: 5.5rem;
    height: 5.5rem;
}
@media screen and (min-width: 768px) {
    .logo_img {
        width: 7.5rem;
        height: 7.5rem;
    }
}

.name_img {
    height: 5.5rem;
}
@media screen and (min-width: 768px) {
    .name_img {
        height: 7.5rem;
    }
}

/** DRAWER **/
#nav_input {
    display: none;
}

#nav_open {
    position: fixed;
    left: calc( 100vw - 25px - 1rem);
    display: flex;
    width: 30px;
    height: 47px;
    align-items: center;
    z-index: 90;
}

#nav_open span,
#nav_open span:before,
#nav_open span:after {
    content: '';
    display: block;
    height: 3px;
    width: 25px;
    border-radius: 3px;
    background: #747070;
    position: absolute;
}
  
#nav_open span:before {
    bottom: 8px;
}
  
#nav_open span:after {
    top: 8px;
}

#nav_input:checked ~ #nav_open span {
    background-color: rgba(255, 255, 255, 0);
}
#nav_input:checked ~ #nav_open span::before {
    bottom: 0;
    transform: rotate(45deg);
}
#nav_input:checked ~ #nav_open span::after {
    top: 0;
    transform: rotate(-45deg);
}
  
header #nav-drawer nav {
    width: 100%;
    height: 53rem;
    position: fixed;
    top: 0;
    left: 100%;
    z-index: 80;
    background-color: #e7e7e7;
    transition: all 1.8s;
    overflow: auto;
    max-height: 90vh;
    -webkit-overflow-scrolling: touch;
}

header #nav-drawer nav li {
    font-size: 1.8rem;
    color: #646464;
    line-height: 5rem;
    padding: 0.4rem 0.8rem;
    padding-top: 0.8rem;
}

header #nav-drawer nav li:after {
    content: '';
    display: block;
    width: 95vw;
    border-bottom: 1px solid #9E9E9E;
}
  
#nav_input:checked ~ nav {
    left: 0;
}

@media screen and (min-width: 768px) {
    #nav_open {
        display: none;
    }

    .menu_wrap > li:first-child {
        width: 35%;
    }

    .menu_wrap > li:last-child {
        width: 65%;
    }
    
    header #nav-drawer nav {
        position: unset;
        height: auto;
    }

    header #nav-drawer nav ul {
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-end;
        width: 90%;
        margin: 0 auto ;
        margin-right: 0;
    }

    header #nav-drawer nav li {
/*        width: calc( 100% / 4 - 2rem );*/
        width: calc( 100% / 3 - 2rem );
        text-align: center;
        line-height: 2rem;
        font-size: 1.5rem;
    }

    header #nav-drawer nav li:after {
        display: unset;
        width: auto;
        border: none;
    }
}
@media screen and (min-width: 875px) {
    header #nav-drawer nav li {
        font-size: 1.8rem;
    }
}
  

/* MAIN */
main {
    padding: 5.2rem 0 3.2rem;
}
@media screen and (min-width: 768px) {
    main {
        padding: 6.8rem 0 4.8rem;
    }
}

/** HEAD TEXT STYLE **/
.head_p {
    position: relative;
    text-align: center;
}

.head_p p:last-child {
    line-height: calc( 5rem * 1.3 );
    top: 1.5rem;
    left: 0;
    right: 0;
}
@media screen and (min-width: 768px) {
    .head_p p:last-child {
        line-height: calc( 9rem * 1.3 );
    }
}


/* FLOWTING PALET */
.reserve_fly {
    right: 0;
    z-index: 90;
}

.reserve_div {
    background: #2c5df5;
    margin: 0.8rem;
    padding: 1.6rem;
    border-radius: 7.5px;
    border: 4px outset #2c5df5;
}

.reserve_fly:active {
    -webkit-transform: translate(0rem, 0.3rem);
    transform: translate(0rem, 0.3rem);
  }

.reserve_div p {
    text-shadow: 1px 1px 2.5px #d4deff, -1px -1px 2.5px #d4deff;
    font-size: 1.8rem;
}


/* FOOTER */
.footer {
    padding-bottom: 1.6rem;
}

.footer ul {
    justify-content: space-evenly;
}

.footer ul li img {
    height: 4rem;
}

@media screen and (min-width: 768px) {
    .footer .contact {
        display: flex;
        justify-content: center;
        width: 50%;
        margin: 1.6rem auto 0;
    }
    .footer .contact > * {
        width: 50%;
    }
}

.footer .contact div {
    width: 20rem;
    height: 4rem;
    margin: 1.6rem auto 0;
}
@media screen and (min-width: 768px) {
    .footer .contact div {
        margin: 0;
        margin-left: 1.6rem;
    }
}

.footer .contact p {
    line-height: 4rem;
}





/************************************************************
     TOP PAGE
 ************************************************************/
/* COMMON */
/** READ MORE **/
.readmore {
    position: absolute;
    right: 0;
}

.readmore p {
    text-shadow: unset;
}

.readmore a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 0 auto;
  margin-right: 0.8rem;
  padding: 0.8rem;
  width: calc( 2rem * 7 );
  background-color: #fff;
  border: 1px solid #bfd6e1;
  transition: 0.3s;
}

.readmore a::after {
  content: '';
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 6px 0 6px 10px;
  border-color: transparent transparent transparent #bcbcbc;
  transition: 0.3s;
}

.readmore a:hover {
  text-decoration: none;
  background-color: #bfd6e1;
  border: 1px solid #fff;
}

.readmore a:hover p {
    text-shadow: 1px 1px 2.5px #adc2cc, -1px -1px 2.5px #adc2cc;
    color: fff;
}

.readmore a:hover::after {
  transform: translateX(5px);
}

/** HEAD **/
.top_campaign, .top_lumix, .top_reluckry, .top_relief, .top_merit, .top_customer {
    padding: 4.8rem 0;
    margin-bottom: 4.8rem;
}
@media screen and (min-width: 768px) {
    .top_campaign, .top_lumix, .top_reluckry, .top_merit, .top_customer {
        padding: 16rem 0;
        margin: 0 auto 8rem;
    }
     .top_relief {
         padding: 8rem 0;
         margin: 0 auto 8rem;
     }
}

/* IMAGE */
.top_img {
    background-image: url(../../img/top_image.jpg);
    background-position: center;
    background-repeat: no-repeat;
    height: 25rem;
    background-size: cover;
}
@media screen and (min-width: 768px) {
    .top_img {
        height: 70vh;
        
    }
}

.top_img::after {
    content: '';
    width: 100%;
    height: 100%;
    background: #afafaf57;
    position: absolute;
    top: 0;
    left: 0;
}

.top_img ul {
    top: calc( 50% - ( 5.2rem / 2 ) );
    left: 10vw;
}
@media screen and (min-width: 768px) {
    .top_img ul {
        left: 30vw;
    }
}

.top_img li {
    flex-direction: column;
}

.top_img p {
    text-shadow: 1px 1px 2.5px #646464, -1px -1px 2.5px #646464;
    margin-top: auto;
}


/* CAMPAIGN */
@media screen and (min-width: 500px) {
    .top_campaign ul {
        justify-content: space-between;
    }   
}
@media screen and (max-width: 867px) {
    .top_campaign ul li {
        margin: 0 auto 0.8rem;
    } 
}



/* RELIEF */
.top_relief {
    background: url(../../img/top_relief.jpg);
    background-position: top;
    background-size: contain;
    background-repeat: repeat-y;
}
@media screen and (min-width: 768px) {
    .top_relief {
        background-size: cover;
    }
}

.top_relief h2 {
    text-shadow: 1px 1px 2.5px #fff, -1px -1px 2.5px #fff;
}
@media screen and (min-width: 768px) {
    .top_relief h2 {
        padding: 6rem 0 2.4rem;
    }
}

.top_relief ul {
    justify-content: space-around;
    align-items: flex-start;
    align-content: space-around;
    flex-wrap: wrap;
    flex-direction: row;
    align-items: stretch;
}
@media screen and (min-width: 768px) {
    .top_relief ul {
        padding-bottom: 8rem;
    }
}

.top_relief li {
    padding: 0.8rem;
    background-color: #ffffff99;
    height: 10rem;
}
@media screen and (min-width: 500px) {
    .top_relief li {
        width: calc( 50% - 4rem );
    }   
}

.top_relief li::before{
    position:absolute;
    top: calc( 50% - 128px );
    left: -4.8rem;
    color: #fff;
    margin: auto;
    opacity: 0.8;
    transform: scale(0.3);
}

.top_relief li:nth-of-type(1)::before{
    content: url(../../img/relief_01.png);
}
.top_relief li:nth-of-type(2)::before{
    content: url(../../img/relief_02.png);
}
.top_relief li:nth-of-type(3)::before{
    content: url(../../img/relief_03.png);
}
.top_relief li:nth-of-type(4)::before{
    content: url(../../img/relief_04.png);
}
.top_relief li:nth-of-type(5)::before{
    content: url(../../img/relief_05.png);
}
.top_relief li:nth-of-type(6)::before{
    content: url(../../img/relief_06.png);
}

@media screen and (min-width: 768px) {
    .top_relief li p:last-child {
        font-size: 1.5rem
    }
}


/* MERIT */
.top_merit h2 {
    line-height: 3;
    background: #646464;
}
@media screen and (min-width: 768px) {
    .top_merit h2 {
        line-height: 4;
    }
}

.top_merit li {
    border-bottom: 1px solid #646464;
    padding-bottom: 0.8rem;
}
@media screen and (min-width: 768px) {
    .top_merit li {
        margin: 3.2rem auto;
        padding-bottom: 1.6rem;
    }
}

.top_merit .check {
    margin: 0.4rem;
    padding-left: 1.6rem;
    text-indent: -1.6rem;
}

.top_merit .check:before {
    content: '';
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
    background: url(../../img/top_merit.png);
    background-size: cover;
    margin-right: 0.4rem;
}

.top_merit div {
    width: calc( 95% - 4rem );
    padding: 2.4rem;
}
@media screen and (min-width: 768px) {
    .top_merit div {
        max-width: calc( 1000px - 5% - 4rem );
    }
}


/* CUSTMORE */
/** CUSTMORE VOICE **/
.top_customer .top_customervoice h2 {
    margin-top: 6.4rem;
}
@media screen and (min-width: 768px) {
    .top_customer .top_customervoice h2 {
        margin-top: 12.8rem;
    }
}

/** SLIDER **/
/*** ARROW ***/
.top_customer .slider .slide-arrow {
    z-index: 80;
    width: 3rem;
    top: calc( 50% - 1.5rem );
}

.top_customer .slider .slide-arrow.next-arrow {
    right: 0
}

/*** DOTS ***/
.top_customer .slider .slick-dots {
    display: flex;
    bottom: -2rem;
    width: 10rem;
    left: 0;
    right: 0;
    margin: 0 auto;
    justify-content: space-evenly;
}

.top_customer .slider .slick-dots li {
    width: 1rem;
    margin: 0 0.4rem;
}

.top_customer .slider .slick-dots button{
    width: 1rem;
    height: 1rem;
}

.top_customer .slider .slick-dots button::before {
    width: 1rem;
    height: 1rem;
}

/*** BODY ***/
.top_customer .slider li {
    display: flex;
    height: auto;
    margin: auto 0.4rem;
}

.top_customer .slider li img {
    width: 50%;
}

.top_customer .top_customervoice .slider li img {
    width: 100%;
}


/* LUMIX A9 */
.top_lumix {
    padding: 1.6rem 0 4rem;
}

.top_lumix ul {
    width: calc( 95% - 4rem );
    padding: 1.6rem;
}
@media screen and (min-width: 500px) {
    .top_lumix li:first-child {
        width: 65%;
    }
    .top_lumix li:last-child {
        width: 35%
    }
}

 /* RELUCKRY */
@media screen and (min-width: 500px) {
    .top_reluckry ul {
        justify-content: space-between;
    }

    .top_reluckry li {
        width: calc( 50% - 2rem );
    }
    .top_reluckry li:first-child {
        margin-right: 0.8rem;
    }
    .top_reluckry li:last-child {
        margin-left: 0.8rem;
        position: relative;
    }
    .top_reluckry li:last-child img {
        position: absolute;
        bottom: 0;
    }
}

.top_reluckry .readmore {
    bottom: -0.5rem;
}





/************************************************************
     FLOW
 ************************************************************/
.flow_title {
    height: 12rem;
}

.flow_title p,
.flow_title h3 {
    left: 0;
    right: 0;
}

.flow_title h3 {
    bottom: 2rem;
}

section:not(:nth-of-type(2)) .flow_ul {
    padding-top: 100px;
}

section:not(:nth-of-type(8)) .flow_ul:after {
    content: '';
    position: absolute;
    width: 100%;
    height: 100px;
    bottom: -99px;
    clip-path: polygon(0 0, 50% 100%, 100% 0%);
    background-color: #fff;
    z-index: 1;
}
.flow_ul.bg_bfd6e1:after {
    background-color: #bfd6e1!important;
}

@media screen and (min-width: 768px) {
    .flow_ul img {
        margin: 3.2rem 4.8rem 4.8rem;
    }
    .flow_ul .reserve_div {
        width: 50%;
        margin: 3.2rem auto;
    }
}

 .arrow img {
    width: 5rem;
}





/************************************************************
     INTRODUCTION
 ************************************************************/
.intro_listyle::before {
    content: '▼';
    height: 1.8rem;
    color: #ff5722;
}

.intro_listyle:hover {
    text-shadow: 
		0 0 0.05em #ff5722,
		0 0 0.06em #FFF59D,
		0 0 0.07em #FFF59D,
		0 0 0.08em #FFF59D,
		0 0 0.09em #FFF59D,
		0 0 0.20em #FFF59D,
		0 0 0.20em #FFF59D,
		0 0 0.20em #FFF59D,
		0 0 0.50em #FFF59D;
}
@media screen and (min-width: 768px) {
    .shr_ul > li {
        width: calc( 100% / 3 );
    }
    .shr_ul > li p.bg_646464 {
        border-left: 1px solid #e7e7e7;
    }
    .shr_ul > li:not(:first-child) p.bg_fff {
        line-height: calc( 1.8rem * 1.3 * 2 );
    }
    .shrul_in_ul {
        margin: auto 1.6rem;
    }
}

h4.fs_108.intro::after {
     content: '';
     display: block;
     height: 0.5rem;
     border-bottom: 3px solid #ff5722;
}

#sectionid_0 p.fs_2::before {
    content: '◆';
    display: inline-block;
    margin-right: 0.4rem;
}

.intro_li::before {
    content: '◆';
    display: inline-block;
}

.intro_tbl {
    border-collapse: collapse;
    table-layout: fixed;
}

.intro_tbl,
.intro_tbl th,
.intro_tbl td {
    border: 1px solid #646464;
}

.intro_power {
    flex-wrap: wrap;
}

@media screen and (min-width: 768px) {
    .intro_power {
        align-items: center;
    }

    .intro_power .intro_power_title {
        width: calc( 1.8rem * 7 );
    }
    .intro_power .intro_power_img,
    .intro_power .intro_power_discription {
        width: calc(( 100% - ( 1.8rem * 7 )) / 2 );
    }

    .intro_power > div:nth-child(1){
        order: 1;
    }
    .intro_power > div:nth-child(2){
        order: 2;
    }
    .intro_power > div:nth-child(3){
        order: 4;
    }
    .intro_power > div:nth-child(4){
        order: 5;
    }
    .intro_power > div:nth-child(5){
        order: 7;
    }
    .intro_power > div:nth-child(6){
        order: 8
    }
    .intro_power > div:nth-child(7){
        order: 3;
    }
    .intro_power > div:nth-child(8){
        order: 6;
    }
    .intro_power > div:nth-child(9){
        order: 9;
    }
}

@media screen and (min-width: 768px) {
    .intro_speed li:first-of-type{
        width: calc( 100% / 3 );
    }
    .intro_speed li:last-of-type{
        width: calc( 100% / 3 * 2 );
    }
}

@media screen and (min-width: 768px) {
    .intro_melanin li:first-of-type {
        width: calc( 100% / 3 * 2 );
    }
    .intro_melanin li:last-of-type {
        width: calc( 100% / 3 );
    }
}

.intro_melanin .diagonal_line {
    background-image: linear-gradient(to right top, transparent calc(50% - 0.5px), #646464 50%, #646464 calc(50% + 0.5px), transparent calc(50% + 1px))
}

.intro_bbl_2 {
    flex-wrap: wrap;
}
.intro_bbl_2 li:first-child {
    order: 2;
}
.intro_bbl_2 li:last-child {
    order: 1;
}
@media screen and (min-width: 768px) {
    .intro_bbl_2 > li:first-of-type {
        order: 1;
        width: calc( 100% / 3 );
    }
    .intro_bbl_2 > li:last-of-type {
        order: 2;
        width: calc( 100% / 3 * 2 );
    }
}

.ewjf_img {
    width: 2rem;
    margin: 0 0.4rem auto;
}




/************************************************************
     BEFORE AFTER
 ************************************************************/
@media screen and (min-width: 768px) {
    .gallery {
        flex-wrap: wrap;
    }
    .gallery li {
        width: calc( 50% - 1rem );
    }
    .gallery li:nth-of-type(odd){
        margin-right: 0.8rem;
    }
    .gallery li:nth-of-type(even){
        margin-left: 0.8rem;
    }
}





/************************************************************
     GUEST'S VOICE
 ************************************************************/
@media screen and (min-width: 768px) {
    .voice_ul {
        flex-wrap: wrap;
    }
    .voice_ul li {
        width: calc( 100% / 3 - 0.7rem );
    }
 }
 




/************************************************************
     FAQ
 ************************************************************/
.question,
.answer {
    align-items: center;
}

.link {
    text-decoration: underline;
}
 




/************************************************************
     ACCESS
 ************************************************************/
.acc_just {
    width: calc(1.5rem * 5);
    display: inline-block;
    text-align: justify;
    text-align-last: justify;
}

.btn {
    position: relative;
    padding: 1rem;
    text-decoration: none;
    color: #000;
    transition: .4s;
}

@media screen and (min-width: 768px) {
    .btn:hover {
        background-color: #fff;
    }
}

.btn:before, .btn:after {
  position: absolute;
  top: 0;
  content:'';
  width: 8px;
  height: 100%;
  display: inline-block;
}
.btn:before {
  border-left: solid 1px #FF5722;
  border-top: solid 1px #FF5722;
  border-bottom: solid 1px #FF5722;
  left: 0;
}
.btn:after {
  content: '';
  border-top: solid 1px #FF5722;
  border-right: solid 1px #FF5722;
  border-bottom: solid 1px #FF5722;
  right: 0;
}

.parking_ul {
    flex-direction: row;
    flex-wrap: wrap;
    align-content: space-around;
    justify-content: space-around;
    align-items: center;
}

.parking_ul img {
    height: calc( 1.5rem * 1.3 );
}
@media screen and (min-width: 768px) {
    .parking_ul img {
        height: calc( 1.8rem * 1.3 );
    }
}

@media screen and (min-width: 768px) {
    .parking_ul > li:first-child {
        order: 2;
    }
    .parking_ul > li:last-child {
        order: 1;
    }
}




/************************************************************
     RESERVE
 ************************************************************/
 .reserve_ul li {
    max-width: 60rem;
}

.reserve_ul li:not(:last-child)::after {
    content: '';
    display: block;
    border-bottom: 1px solid #d0d0d0;
    margin-top: 4rem;
}

.reserve_ul img {
    max-width: 270px;
    min-width: 270px;;
    height: auto;
}




/************************************************************
     MENU
 ************************************************************/
@media screen and (min-width: 768px) {
    .menu_ul li p:last-child {
        height: calc( 1.8rem * 1.3 * 5 );
    }
    .menu_ul > li img {
        width: 85%;
        object-fit: cover;
        object-position: center;
    }
}
@media screen and (min-width: 782px) {
    .menu_ul li p:last-child {
        height: calc( 1.8rem * 1.3 * 4 );
    }
}
@media screen and (min-width: 986px) {
    .menu_ul li p:last-child {
        height: calc( 1.8rem * 1.3 * 3 );
    }
}




/************************************************************
     CAMPAIGN
 ************************************************************/
.camp_parts,
.camp_discription  {
    position: relative;
}
 
.camp_parts > p:before,
.camp_parts > p:after,
.camp_discription > p:before,
.camp_discription > p:after {
    content: '';
    width: 3rem;
    border-top: 1px solid #000;
    position: absolute;
    top: 1rem;
    left: 0;
}
@media screen and (min-width: 768px) {
    .camp_parts > p:before,
    .camp_parts > p:after,
    .camp_discription > p:before,
    .camp_discription > p:after {
        width: calc( 50% - ( 2.5rem * 7.5 ) );
    }
}
  
.camp_parts p:after,
.camp_discription > p:after {
    left: unset;
    right: 0;
}





/************************************************************
     INSTA LIST
 ************************************************************/
 .insta_list li {
    width: calc( ( 100% - ( 0.8rem * 4 )) / 2 );
    padding: 0 0.8rem;
}
@media screen and (orientation: landscape) and (min-width: 768px) {
    .insta_list li {
        width: calc( ( 100% - ( 0.8rem * 8 )) / 4 );
    }
}