@charset "utf-8";

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

/* style */
    
    body{
        background-size: 314%;
    }    
    
.only_pc{
    display: none;
}
.only_sp{
    display: block;
}
   
p,dl,ul{
    font-size: 3.74vw;
    letter-spacing: 0.01rem;
    }    
    
.box {
    flex-direction: column;
}
    
.wrapper {
    width: 89%;
    padding-top: 10vw;
    margin-top: -10vw;
    }
h4 {
    margin-bottom: 2.7vw;
}    

h5 {
    margin-bottom: 7vw;
}
    
.bg_border {
    padding: 5vw 3vw;
}
    
    

/*==================================================
　ハンバーガーメニュー
===================================*/
.btn img{
	width: 80px;
	position: fixed;
	right: 0;
    top: 0;
    z-index: 9;
}

#nav-content {
    z-index: 900;
    overflow: auto;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    text-align: center;
    opacity: 0;
    transition: opacity .6s ease, visibility .6s ease;
    visibility: hidden;
}
#nav-content ul {
  list-style: none;
}
#nav-content a {
  display: block;
  text-decoration: none;
  padding: 15px 0;
  transition: opacity .6s ease;
  pointer-events: none;
    line-height: 1.4;
    text-align: center;
}

.is-open {
    overflow: hidden;
}
.is-open #nav-content {
  z-index: 999;
  visibility: visible;
  opacity: 1;
}
.is-open #nav-content a {
  pointer-events: auto;
}    
    
header .menu_content li.line img,header .menu_content li.insta img {
    width: 7.5vw;
    padding-top: 0;
    margin-left: 0;
}


/*====================================================
                  header
====================================================*/
header{
    width: 100%;
    background: url(../img/header_bg_sp.png);
    background-size: cover;
    background-repeat: no-repeat;
    margin-left: 0;
    height: 20vw;
    }    
    
header .logo img {
    width: 44vw;
    margin-left: 3vw;
    padding-top: 3vw;
}
    
header .line img {
    width: 7.5vw;
    padding-top: 2.5vw;
    margin-left: 13.5vw;
}
header .insta img {
    width: 7.5vw;
    padding-top: 2.5vw;
    margin-left: 4.5vw;
}
    
header .box {
    flex-direction: row;
    align-items: center;
    }
    
#nav-content {
    width: 101vw;
    height: 100vh;
    background: url(../img/SVG/menu_bg.svg);
    background-repeat: no-repeat;
    background-size: cover;
    left: -0.1vw;
    
    }
    
    
.btn img {
    width: 8.2vw;
    right: 5vw;
    top: 5.7vw;
}
    
.menu_content li img {
    width: 47vw;
    }
    
    
.menu_content li:first-child img{
    width: 53vw;
    margin-bottom: 11vw;
    }
    
nav .menu_content li {
    font-size: 5.4vw;
    margin-bottom: 5vw;
    
    }
nav .menu_content {
    width: 100%;
    margin: 0 auto;
}
    
#nav-content a {
    padding: 0;
    }
.is-open #nav-content a {
    width: 100%;
}
    
nav .menu_content {
    width: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);

    }


nav .menu_content li.logo img {
    width: 53vw;
    margin-bottom: 3vw;
    margin-left: 0;
    padding-top: 0;
}    
    
#nav-content nav .menu_content .box{
    justify-content: center;
    margin-top: 12vw;
    }
    
header nav .menu_content li.line img, header nav .menu_content li.insta img {
    width: 10vw;
    padding-top: 0;
    margin-left: 0;
    margin-bottom: 0;
}
    
header nav .menu_content li.line{
    margin-bottom: 0;
    margin-right: 5vw;
    }
    
header nav .menu_content li.insta{
        margin-bottom: 0;
    }
    
.bg_wh {
    margin: 5vw auto 9.5vw;
    padding: 3vw;
    width: 89.5%;
}    
    
.main .logo {
    width: 14.5vw;
    margin-bottom: 4.3vw;
}
    
    
.img_txt{
    width: 70vw;
    margin: 0 auto;
}

    
/*====================================================
                  main
====================================================*/
.main ul {
    margin: 10vw auto 15vw;
}
    
.main .img01 {
    width: 40vw;
    margin-bottom: 6vw;
}
    
.main .img02 {
    width: 49vw;
}
    
.main .img03 {
    width: 70vw;
    margin: 7.5vw auto 0;
}

    
/*====================================================
                  point
====================================================*/
    
.point h5 img {
    width: 46vw;
}
    
    
/*====================================================
                  merit
====================================================*/
    
.merit {
    margin-top: 14vw;
    }
    
.merit h5 img {
    width: 55.5vw;
}
    
    
/*====================================================
                  check_list
====================================================*/    
    
    
.check_list {
    margin: 12.5vw auto 14vw;
}    
    
.check_list h5 img {
    padding-top: 6.7vw;
    width: 60vw;
}
    
.check_list .img_txt {
    width: 92%;
    padding-bottom: 6vw;
}
    
/*====================================================
                  list
====================================================*/    
    
.list h4 img {
    width: 100%;
}    
    
.list .img_txt {
    margin: 6vw auto 13vw;
}
    
/*====================================================
                  price
====================================================*/       
    
    
.price h4 img {
    width: 31vw;
    margin-left: 1vw;
}
    
.price .img_txt {
    width: 72vw;
    margin: 7vw auto;
}
    
/*====================================================
                  message
====================================================*/       
    
.message {
    margin: 10.5vw auto 8vw;
}  
    
.message .logo {
    width: 20vw;
    }
.message .img_txt {
    margin: 6.5vw auto 9vw;
    width: 70vw;
}
.message p {
    font-size: 3.74vw;
    line-height: 1.7;
    letter-spacing: 0;
    width: 71vw;
}
    
.message p.text_left {
    margin-top: 5vw;
}    
    
    
/*====================================================
                  fotter
====================================================*/    
   
footer .tel, footer .tel img {
    width: 53vw;
    margin: 2.5vw auto 0;
}    
    
footer .mail, footer .mail img {
    width: 57vw;
    display: block;
    margin: 3.5vw auto 0;
}
    
footer p {
    font-size: 3.2vw;
    margin-top: 2.3vw;
}    
    
footer .company {
    width: 35vw;
}
    
footer .copyright {
    margin:0;
    padding-bottom: 9vw;
}
footer .copyright p {
    font-size: 2.6vw;
    margin: 8.5vw 0 5vw;
    padding-bottom: 4vw;
    letter-spacing: 0.05rem;
}
    
}