@charset "utf-8";


/* main ------------- */
.mv { position: relative; }
.mv_txtBox { z-index: 5; position: absolute;left: 6%;top: 37%;
  padding: 0 30px 65px;
  /* background: url("../img/top/deco_frame.png") no-repeat bottom center ; */
  font-size: 2.4em; font-weight: 600; color: #fff;
  font-family: fot-tsukuardgothic-std, sans-serif;
  transform: translate(0,-50%); -webkit-transform: translate(0,-50%);
  filter: drop-shadow(0 0 20px rgba(0,0,0,0.8)); }
.mv_txtBox>p { position: relative; margin: 0 auto; line-height: 1.6; letter-spacing: .05em;}
.mv_txtBox>p::before { content: "#"; font-size: .8em; margin-right: .2em; }

.mv_txt02 { display: inline-block; padding-right: .8em; }
.mv_txt02::after {
    content: ""; position: absolute; top: 53%; right: 0;
    transform: translate(0,-50%); -webkit-transform: translate(0,-50%);
    background: url(../img/heart_on.svg) no-repeat center;
    width: 25px; height: 25px; background-size: 25px;
}

#slide { position:relative; width:100%;min-height:87vh; }
#slide img { width: 100%; }

#slide { overflow:hidden; }
#slide [class^="slide-"] { position:relative; width:100%; height:90vh; background:no-repeat center / cover; }
#slide .slide-01 { background-image:url(/img/top/slide/mv_05.jpg); }
#slide .slide-02 { background-image:url(/img/top/slide/mv_07.jpg); }
#slide .slide-03 { background-image:url(/img/top/slide/mv_08.jpg); }
#slide .slide-04 { background-image:url(/img/top/slide/mv_02.jpg); }
#slide .slide-05 { background-image:url(/img/top/slide/mv_04.jpg); }

/* bnr */
.bnr_coupon { margin-top: 70px;}
.bnr_coupon img { margin: 0 auto;}


/*予約ボタン*/
.btn_reserve { position: absolute; bottom: 3%; right: 3%; }
.btn_reserve a { text-align: center; display: block; padding: 40px 0;
    color: #fff;
    background: url("../img/top/circle_orange.png") no-repeat center;
    width: 207px;
    height: 207px;
    font-family: fot-tsukubrdgothic-std, sans-serif; }
.btn_reserve a p {
    position: relative;
    margin: 0;
    font-size: 2.14em;
    font-weight: bold;
    line-height: 1.5;
    letter-spacing: .1em; }
.btn_reserve a p::before { content: ""; position: absolute; left: 50%; bottom:-40px;
    transform: translate(-50%,0); -webkit-transform: translate(-50%,0);
    background: url("../img/arrow.png") no-repeat center; width: 28px; height: 28px; }
.btn_reserve a p>span { display: block; }

/* スライドのドット調整 */
#slide .slick-dots li:not(:last-child) {margin-bottom: 18px;}
#slide .slick-dots {position: absolute; top: 50%; transform: translateY(-50%); right: 2em;}
#slide .slick-dots li button {
  width: 10px; height: 10px; padding: 0; background-image: none; background-color: #d8d8d8;
  text-indent: -9999px;
}
#slide .slick-dots .slick-active button {background-color: #3d2020;}

/*mv_scroll*/
.mv_scroll {
  z-index: 50;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translate(-50%,0);
  -webkit-transform: translate(-50%,0);
  padding-top: 60px;
  color: #fff;
  font-size: 13px;
  font-weight: 400;
  letter-spacing: .2em;
}
.mv_scroll span {
  position: absolute;
  bottom: 25px;
  left: 50%;
  width: 20px;
  height: 35px;
  transform: translate(-50%,0);
  -webkit-transform: translate(-50%,0);
  border: 2px solid #fff;
  border-radius: 50px;
  box-sizing: border-box;
}
.mv_scroll span::before {
  content: '';
  position: absolute;
  top: 10px;
  left: 50%;
  width: 6px;
  height: 6px;
  margin-left: -3px;
  background-color: #fff;
  border-radius: 100%;
  -webkit-animation: sdb 2s infinite;
  animation: sdb 2s infinite;
  box-sizing: border-box;
}
@-webkit-keyframes sdb {
  0% {
    -webkit-transform: translate(0, 0);
    opacity: 0;
  }
  40% {
    opacity: 1;
  }
  80% {
    -webkit-transform: translate(0, 20px);
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
@keyframes sdb {
  0% {
    transform: translate(0, 0);
    opacity: 0;
  }
  40% {
    opacity: 1;
  }
  80% {
    transform: translate(0, 20px);
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}

/* bn ------------- */
.bn{margin: 2em 1em;text-align: center;}

.bnBox { margin: 30px auto 0; }
.bnBox li { width: 100%; }
.bnBox li img { width:100%; }


/* news ------------- */
article>section#news { padding: 40px 0; background: rgba(255, 200, 166, .4); }
#news ul{ overflow-y: scroll; max-height: 120px; }

/*感染症対策お知らせ*/
p.corona {margin: 3em auto;}
.corona .secTtl { display: block; letter-spacing: 0; line-height: 1.5; }
.corona .lead .atten { text-align: center; color: #fd4a32;font-weight: 600;}
.corona .ttl_line { margin-bottom: .5em; }
.corona .torikumi { margin: 30px 0 20px; }
.corona .flex>* { width: 49%; }
.corona .attenBox .ttl_line { border: none; text-align: center; margin-bottom: 1.2em;}
.corona .attenBox .flex>* { width:30%; }
.corona .attenBox figucaption { display: block; color: #26b5cc; font-size: 1.2em; font-weight: 600; }

/* ---------------------------------------
9月10月キャンペーン
----------------------------------------- */
#campaign.october{ margin-top: 1em; padding-bottom: 10px; }



/* ---------------------------------------
カップルプラン（英語・中国語）
----------------------------------------- */
#en_cplan { z-index: 0; position: relative; padding: 0 0 80px; }

/* ---------------------------------------
WEB限定クーポン
----------------------------------------- */
#coupon { background: url("../img/top/deco_square.png") no-repeat left 28px top 50px; }
.couponList { margin: 30px auto; }
.couponList>li { width: 48%; margin-bottom: 20px; }
.couponList>li a { display: block; cursor: pointer;
    box-shadow: 4px 4px #f5d0ae; transition: all 0.3s ease 0s;}
.couponList>li:nth-child(2) a { box-shadow:4px 4px #fae2e5; }
.couponList>li:nth-child(3) a { box-shadow:4px 4px #eee1e9; }
.couponList>li:nth-child(4) a { box-shadow:4px 4px #aae3f1; }
.couponList>li a img { display: block; width: 100%; padding-right: 4px; padding-bottom: 4px; }
.couponList>li a:hover { box-shadow:none;transform: translateY(2px) translateX(2px); -webkit-transform: translateY(2px) translateX(2px); }

.atten_waribiki { background: url(/img/deco_hearts.png) no-repeat top 20px left 20px /20px,#fff url(/img/deco_star.png) no-repeat bottom 20px right 20px /20px; }
.atten_waribiki h3 {  margin-bottom: 1em; font-size: 1.5em; font-family: fot-tsukuardgothic-std, sans-serif; font-weight: 600; text-align: center;}
.atten_waribiki .lead { text-align: center; margin: 0 auto 2em;
    font-family: fot-tsukuardgothic-std, sans-serif;letter-spacing: .1em;
    font-size: 1.2em; font-weight: bold; }
.atten_waribiki .lead span {background: #fd4a32; color: #fff; padding: .3em 1em; }
.atten_waribiki dt { position: relative; float: left; clear: left; width: 150px; font-weight: bold; font-size: 1.2em; font-family: fot-tsukuardgothic-std, sans-serif;  }

.atten_waribiki dt::before { content: "●"; color: #efa569; font-size: .8em; margin-right: .2em;}
.atten_waribiki dl>div:nth-child(2) dt::before { color: #e45062; }
.atten_waribiki dl>div:nth-child(3) dt::before { color: #9268b8; }
.atten_waribiki dl>div:nth-child(4) dt::before { color: #5ba9ef; }

.atten_waribiki dt::after { content: "…"; position: absolute; right: 0; }
.atten_waribiki dd { margin-bottom: 1em; padding-left: 170px; }



/* ---------------------------------------
レンタルプラン
----------------------------------------- */
#plan { z-index: 0; position: relative; padding: 80px 0 60px; }
#plan::before { content: "";
    position: absolute; right: 0; top: 24%;
    background: url(../img/top/deco_square.png) no-repeat;
    transform: rotate(90deg); -webkit-transform: rotate(90deg);
    width: 174px; height: 174px;
}
#plan::after { content: "";
    z-index: -1; position: absolute; bottom:0; right: 0;
    background: rgba(255, 200, 166, .3);width: 95%;height: 72%; margin: 0 0 0 auto; }

#plan .lead { text-align: center;}

.planBox>div { position: relative; width: 30%; }
.planBox>div:nth-child(2),.planBox>div:nth-child(5) { margin-top: 30px; }
.planBox>div:nth-child(3),.planBox>div:nth-child(6) { margin-top: 60px; }

.planBox>div a { position: relative; display: block; padding-bottom: 4px; cursor: pointer;
    box-shadow: 4px 4px #fecc59; transition: all 0.3s ease 0s; }
.planBox>div a:hover { box-shadow:none!important;transform: translateY(2px) translateX(2px); -webkit-transform: translateY(2px) translateX(2px); }
.planBox>div a>div { overflow: hidden; position: relative; margin-right: 4px; }

.plan_slide { position: relative; }
.plan_slide::before,.plan_slide::after { content: ""; z-index: 30; position: absolute; }
.plan_slide::before { top: 0; right: 0;
    border-top: 30px solid #efa627;
    border-right: 30px solid #efa627;
    border-bottom:30px solid transparent;
    border-left: 30px solid transparent;}
.plan_slide::after {  top: 10px; right: 10px; background: url("../img/heart.svg") no-repeat center /15px; width: 15px; height: 15px; }
.planBox>div a:hover .plan_slide::after { background-image: url("../img/heart_on.svg"); }


.plan_slide img { width: 100%; }

.planBox>div a .txtBox { position: absolute; padding: 10px 1.5em ; bottom: 0; left: 0; right: 0; color: #fff; background: #efa627; line-height: 1.5; }
#plan .name {
    color: #fff;
    font-family: fot-tsukuardgothic-std, sans-serif;
    font-size: 1.5em;
    font-weight: bold;
}
#plan .name::before {
    content: "#";
    font-size: .8em;
    font-weight: 100;
    margin-right: .3em;
}
#plan .price { margin: 0; color: #fff; font-family: 'Josefin Sans', sans-serif;
    font-size: 1.428em; font-weight: 200; letter-spacing: .1em; }
.plan-txt { margin-top: 20px; }
#plan .price .small { font-weight: 400; }

.come-image { position: absolute; top:-16px; right: 0; margin: 0;
    font-size: .8em; color: #66c1b5; background: rgba(255, 255, 255, 0.9);
}
.planBox>div.mens .come-image { color: #1863a7; }
.planBox>div.yukata_mens .come-image { color: #67bbd2; }





/*いろどりプラン*/
.planBox>div.irodori a { box-shadow: 4px 4px #ef9da6; }
.planBox>div.irodori .plan_slide::before { border-top: 30px solid #f05365; border-right: 30px solid #f05365; }
.planBox>div.irodori a .txtBox { background: #f05365; }

/*なでしこプラン*/
.planBox>div.nadeshiko a { box-shadow: 4px 4px #e3c3e0; }
.planBox>div.nadeshiko .plan_slide::before { border-top: 30px solid #c67cbe; border-right: 30px solid #c67cbe; }
.planBox>div.nadeshiko a .txtBox { background: #c67cbe; }

/*はいからプラン*/
.planBox>div.haikara a { box-shadow: 4px 4px #ee8995; }
.planBox>div.haikara .plan_slide::before { border-top: 30px solid #ee8995; border-right: 30px solid #ee8995; }
.planBox>div.haikara a .txtBox { background: #ee8995; }

/*浴衣プラン*/
.planBox>div.yukata a { box-shadow: 4px 4px #a5ded6; }
.planBox>div.yukata .plan_slide::before { border-top: 30px solid #66c1b5; border-right: 30px solid #66c1b5; }
.planBox>div.yukata a .txtBox { background: #66c1b5; }

/*メンズプラン*/
.planBox>div.mens a { box-shadow: 4px 4px #619cd1; }
.planBox>div.mens .plan_slide::before { border-top: 30px solid #1863a7; border-right: 30px solid #1863a7; }
.planBox>div.mens a .txtBox { background: #1863a7; }

/*浴衣プラン（メンズ）*/
.planBox>div.yukata_mens a { box-shadow: 4px 4px #9edaeb; }
.planBox>div.yukata_mens .plan_slide::before { border-top: 30px solid #67bbd2; border-right: 30px solid #67bbd2; }
.planBox>div.yukata_mens a .txtBox { background: #67bbd2; }
.planBox>div.yukata_mens .name>span.small { font-size: .7em; }


#plan .btn-brown { margin: 30px auto; }


/*レンタルプラン料金に含まれるもの-------------*/
#item { overflow: hidden; z-index: 0; position: relative; padding: 80px 0; }
#item::before { content: "" ; z-index: -1; position: absolute; top: 0; right:-80px ; background: url("../img/top/rentalitem.png") no-repeat; width: 429px; height: 333px; }

#item .inBox { position: relative; }
#item .inBox::before,#item .inBox::after {
    content: "" ;
    position: absolute;
    top: -50px;
    background:rgba(253, 50, 50, .4);
}
#item .inBox::before { left: 8%; width: 10%; height: 1px;}
#item .inBox::after { left: 8%; width: 1px; height: 100%;}

.itemList { width: 65%; }
.itemList li { text-align: center; width: 21%; margin-bottom: 20px; }
.itemList li figure { border-radius: 500px; overflow: hidden; }
.itemList li figure img { width: 100%; }
#plan .itemList .name { font-size: 1.42em; color: #3b0f0f; }

#item .decoImg { position: absolute; bottom: 0; right: -40px; }
#item .decoImg img { width: 90%; }

/*レンタルプラン料金に含まれないもの*/



/*レンタルオプション -------------*/
#option { z-index: 0; position: relative; padding: 80px 0 0; }
#option::before { content: "" ; z-index: -1; position: absolute; top: -100px; left:-45px ; background: url("../img/top/rentaloption.png") no-repeat; width:515px; height: 357px; }

#option .inBox { position: relative; }
#option .inBox::before,#option .inBox::after {
    content: "" ;
    position: absolute;
    top: -50px;
    background:rgba(253, 50, 50, .4);
}
#option .inBox::before { right: 8%; width: 10%; height: 1px;}
#option .inBox::after { right: 8%; width: 1px; height: 100%;}

.optionList>li { width: 48%; margin-bottom: 40px; }
.optionList>li figure { display: block; position: relative; }
.optionList>li figure img { width: 100%; }
.opTtl { position: absolute; padding: .5em 1em; line-height: 1.5; width: 50%; margin: 0; background: #fcac20; bottom: 0; left: 0; }
.optionList>li:nth-child(2) .opTtl { background: #ed4d5f; }
.optionList>li:nth-child(2) .opTtl.all { right: 0; left: auto; border-left: 1px dashed #fff; background: #ff7484; }
.optionList>li:nth-child(3) .opTtl { background: #5aa9d1; }
.optionList>li:nth-child(4) .opTtl { background: #c67cbe; }
.opTtl>* { display: block; }
.optionList>li:nth-child(3)>p>.small { margin-top: 20px; display: block; }


#option .decoImg { position: absolute; bottom: -30px; left: 5%; }
#option .decoImg img { width: 77%; }



/* kuchikomi クチコミ ------------- */
.kuchikomi { padding: 50px 0 90px; }
.kuchikomi .subTtl { color: #633e3b; }
.kuchikomi .subTtl>span::before { background: url(../img/deco_subTtl01_brown.png) no-repeat; }
.kuchikomi .subTtl>span::after { background: url(../img/deco_subTtl02_brown.png) no-repeat;  }

.kuchikomi .lead_star { text-align: center; margin: 0 auto;}
.kuchikomi .lead_star img { vertical-align: top; }
.kuchikomi .lead_star span { display: inline-block; padding-left: .3em; line-height: .8; color: #fd3232; font-family: fot-tsukuardgothic-std, sans-serif; font-size: 2.3125em; font-weight: bold; }

/* クチコミ スライド */
.slide_kuchi { padding-top: 35px; }
.slide_kuchi li { margin: 0 10px; }
.slide_kuchi li .txtBox { text-align: left; padding: 20px; background: #fff; border-radius: 10px; font-family: fot-tsukuardgothic-std, sans-serif;}
.slide_kuchi li .ttl { margin-bottom: .5em; font-size: 1.4em; font-weight: bold;  }
.slide_kuchi li .star { margin: 0 auto .2em;}
.slide_kuchi li .star img { float: left; }
.slide_kuchi li .star span { display: inline-block; margin-left: .5em; font-size: 1.3em; font-weight: bold; color: #fd3232; line-height: .8; }
.slide_kuchi li .user { font-size: .87em; margin: 1em auto 0; }

/*背景stripe*/
.bg_stripe { background:#ffc3ce url("../img/bg_stripe.png") no-repeat center ; padding: 5px;}
.bg_stripe.yellow { background-color: #facd89; }
.bg_stripe.blue { background-color: #b9e8ff; }




/* ---------------------------------------
お客様フォトギャラリー
----------------------------------------- */
.photoList li {  width:24%; margin-bottom: 2%; }



/* ---------------------------------------
ご予約について
----------------------------------------- */
#reserve { position: relative; padding: 100px 0 0; }
/*#reserve::before { content: ""; position: absolute; top: 0; left: 0; bottom: 0; width: 95%; height: 100%; background: rgba(255, 200, 166, .2); }*/
#reserve::after { content: ""; position: absolute; top: 50px; right: 0;
background: url("../img/top/booking.png") no-repeat; width: 350px; height:240px; background-size: 350px; }


#reserve .lead {  margin: 0 auto 3em; font-size: 20px;font-weight: bold; letter-spacing: .1em; }
#reserve .lead>span>span { font-size: 1.4em; }

.reList>li { position: relative; width: 22%;  }
.reList>li:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 45%;
    right: -32px;
    width: 0;
    height: 0;
    transform: translate(0,-50%);
    -webkit-transform: translate(0,-50%);
    border-top: solid 6px transparent;
    border-right: solid 10px transparent;
    border-bottom: solid 6px transparent;
    border-left: solid 10px #e7340c;
}

.reList>li figure { position: relative; }
.reList>li .step { position: absolute; left:-20px; top:-20px;
    text-align: center;
    width: 62px; height: 61px;
    margin: 0; padding: 10px;
    font-family: 'Damion', cursive;
    color: #fff;
    background: url("../img/top/circle_red.png") no-repeat center;
    font-size: 17px;
    line-height: 0.7;
}
.reList>li .step>* { display: block; }
.reList>li .step>span:first-child { letter-spacing: .15em; }
.reList>li .step>span+span { font-size: 2.14em; }
.reList>li h4 {
    text-align: center;
    font-size: 1.5em;
    font-family: fot-tsukuardgothic-std, sans-serif;
    font-weight: 600;
}


/* ---------------------------------------
よくある質問
----------------------------------------- */
.faq { background: url(../img/top/deco_square.png) no-repeat left bottom; }
.faqList li { position: relative; margin-bottom: 1em; padding: .3em 1em .5em 3.2em; font-family: fot-tsukuardgothic-std, sans-serif; border-bottom: 1px dashed #fd4a32; }
.faqList li::before { content:"Q";
  position: absolute; top:0; left: 0;
  text-align: center; width: 40px; height: 40px;
  background: #fd4a32 ; color: #fff;
  font-size: 1.5625em; font-weight: bold; line-height: 1.5;
  border-radius: 100%;
}
.faqList li::after { content: "";
    display: inline-block;
    position: absolute; top: 50%; right: 0;
    width: 10px; height: 10px;
    border-top: 2px solid #fd4a32;
    border-right: 2px solid #fd4a32;
    transform: rotate(45deg) translate(-50%,0);
    -webkit-transform: rotate(45deg) translate(-50%,0);
}
.faqList li a { display: block; font-size: 1.25em;  font-weight: 600; color: #633e3b; }


/* ---------------------------------------
blog　instagram
----------------------------------------- */
.blog { padding: 0 0 90px;  }

.instagram { position: relative; padding: 50px 0 40px; }
/*.instagram::before { content: ""; position: absolute; top:-20%; right: 0;
    background: url(../img/top/deco_square2.png) no-repeat ; width: 174px; height: 174px; }*/
.instaList li { width: 19%; overflow: hidden; }
.instaList li a { display: block; }
.instaList li a img { object-fit: cover; }

#instaList li { margin:0 10px; }

/*.inBox { position: relative; }
.inBox::before, .inBox::after { content: "" ; position: absolute; top: -70px; background: rgba(253, 50, 50, .4); }
.inBox::before { left: -70px; width: 40%; height: 1px; }
.inBox::after { left: -70px; width: 1px; height: 100%; }*/
/*.instagram .inBox::before,.instagram .inBox::after { left: auto; right: -70px; }*/

.blogList li { width: 24%; padding-left: 10px; }
.blogList li .txt { margin: .5em auto; line-height: 1.5; font-family: fot-tsukuardgothic-std, sans-serif; }
.blogList li .day { display: block; font-size: .87em; }


.blogList li a { display: block; }
.blogList li a figure { position: relative; overflow: hidden; height: 200px; width: 100%;background: #fff; }
.blogList li a img { position: absolute;
    left: 50%; top: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%);
    width: 100%; height: auto; object-fit: cover; font-family: 'object-fit: cover;'; }



/* ---------------------------------------
アクセス
----------------------------------------- */
#access {  overflow: hidden; background: #fff; }

#access .flex>* { width: 48%; }

#access .map { position: relative; }
#access .map::before { content: ""; position: absolute; left: -80px; bottom: -20px;
background: url("../img/top/kanban.png") no-repeat; width: 113px; height: 163px; }

#access .txtBox { font-weight: 600; }
#access .txtBox .tel2 {  font-weight: bold!important; }
#access .txtBox p:not(:last-child) { margin: .5em auto; font-weight: normal; }
#access .txtBox .ttl { position: relative; font-size: 1.625em; font-weight: bold; border-bottom: 1px solid #fad6ce; }
#access .txtBox .ttl::before { content: " "; position: absolute; display: block;
  border-bottom: solid 1px #fd4a32; bottom: -1px; width: 20%; }
#access .txtBox .tel2 span { font-size: 1.625em; }
#access .button { text-align: left!important; }

/*#access .imgBox { position: relative; }
#access .imgBox .shopBox { overflow: hidden; position: relative ;width: 100%; height: 400px; }
#access .imgBox .shopBox .img01 { position: absolute; width: 45%; left: 0;  }
#access .imgBox .shopBox .img02 { position: absolute; width: 58%; right: 0; top: 20px;  }

#access .commentBox { position: absolute; right:-130px; bottom: 0; }
#access .commentBox>figure { position: relative; display: inline-block; }
#access .commentBox>figure p { position: absolute;top: 10px; right: 50px; font-weight: bold;letter-spacing: .1em; }*/



/* ================================================================
  レスポンシブ
=================================================================== */
/* 600以上(PC・タブレット) */
@media screen and (min-width: 600px) {

  .instaList li:nth-child(n+6) { margin-top: 1.25%; }
  
  .bnBox li { width: 48%; }
  .bnBox li.bnr_studio { width: 100%; padding: 1em 0 1.5em; }
  .mv_txtBox { z-index: 5; position: absolute;left: 6%;top: 37%;
    padding: 0 30px 80px;
    /* background: url("../img/top/deco_frame.png") no-repeat bottom 0% left 31% ; */
    font-size: 2.4em; font-weight: 600; color: #fff;
    font-family: fot-tsukuardgothic-std, sans-serif;
    transform: translate(0,-50%); -webkit-transform: translate(0,-50%);
    filter: drop-shadow(0 0 20px rgba(0,0,0,0.8)); }
}

/* 960px以上(PC) */
@media screen and (min-width: 960px) {

}

/* ================================================================
  タブレット
=================================================================== */
/* 1024以下 (タブレット横以下) */
@media screen and (max-width: 1024px) {
}

/* 959以下 (タブレット以下) */
@media screen and (max-width: 959px) {

  .mv_txtBox { left: 50%; top: 68%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); width: 80%;}


  .corona .attenBox .flex { justify-content: space-between; -webkit-justify-content: space-between;}

  p.corona {width:60%; margin: 2em auto;}
  /* ---------------------------------------
  レンタルプラン
  ----------------------------------------- */
  #plan::after { width: 85%; height: 82%; }

  #plan .name,#plan .price { font-size: 1em; font-weight: bold; }
  #item .decoImg { right: -10px; }
  #item .decoImg img { display: block; width: 70%; margin: 0 0 0 auto; }

  /*レンタルプラン料金に含まれるもの*/
  #item {padding: 60px 0 0;}
  #item::before { background-size: 300px; right: -510px;  width: 100%; height: 250px; }
  .itemList { width: 75%; }
  #plan .itemList .name { font-size: 1em; }

  /*レンタルプラン料金に含まれないもの*/

  #item .note h4 { text-align: left; }
  #item .note p { text-align: left; }

  /*レンタルオプション-------------*/
  #option::before {top: -30px; left: -10px; width: 100%; height: 210px; background-size: 300px; }
  #option .decoImg {  bottom: -6%; left: 35px; }
  #option .decoImg img {  width:50%; }

  .optionList { padding-bottom: 30px; }


  /* ---------------------------------------
  ご予約について
  ----------------------------------------- */
  #reserve::after { width: 200px; background-size: 200px; top: 30px}
  .reList>li:not(:last-child)::after { top: 33%; right: -27px; }
  .reList>li .step { padding: 15px 0; font-size: 14px; background-size: 80%; }
  .reList>li h4 { font-size: 1.2em; }


  /* ---------------------------------------
  アクセス
  ----------------------------------------- */
  #access .imgBox .shopBox { height: 280px }
  #access .commentBox { right: -70px; width: 45%; }
  #access .commentBox>figure p { top: 15px; right: 20px; margin: 0; font-size: 12px; letter-spacing: 0; }
  #access .map::before { background-size: 80px;  left: -60px; bottom: -60px; }

  /* ---------------------------------------
  ブログ
  ----------------------------------------- */
  .blogList li a figure { height: 150px; }

  /*.instaList li a img { width: 150px; height: 150px; }*/



}

/* ================================================================
  スマホ
=================================================================== */
@media screen and (max-width: 599px){

article>section { padding: 30px 0; }

/*mv*/
.mv_txtBox { top: 70%; text-align: center;width: 100%; background-size: 75%; font-size: 1.8em; }
.mv_txtBox>p {font-size: 0.9em;}
.mv_txt02::after { width: 20px; height: 20px; background-size: 20px;}

/* bnr */
.bnr_coupon { margin-top: 40px;}

/* インスタ */
.instagram { padding: 20px 0 40px;}

#slide { min-height:80vh; }
.btn_reserve { display: none; }

/* slide */
#slide.main_slide img:first-child {object-position: right center;}
#slide.main_slide img:nth-child(4) {object-position: right center;}
#slide [class^="slide-"] {height:80vh;}
#slide .slick-dots {right: 1em;}

/*news*/
article>section#news {  padding: 20px 0; }

.corona .secTtl { line-height: 1.5; }
.corona .lead { text-align: left; }
.corona .flex>* { width: 100%; }
.corona .flex>div:not(:last-child) { margin-bottom: 20px; }
.corona .attenBox .flex { justify-content: space-between; -webkit-justify-content: space-between; }
.corona .attenBox figucaption { font-size: 1em; }

/*バナー*/
p.corona {width:85%; margin: 0.8em auto;}

/* ---------------------------------------
WEB限定クーポン
----------------------------------------- */
#coupon {  background-position: top 8% left -20px; background-size: 100px;}
.couponList>li { width: 100%; }

.atten_waribiki dt { float: none; width: auto; }
.atten_waribiki dt::after {display: none;}
.atten_waribiki dd { padding-left: 0; }


/* ---------------------------------------
レンタルプラン
----------------------------------------- */
#plan { padding:0 0 40px; }
#plan::after {  width: 60%; }
#plan::before { display: none; }
#plan .lead { margin: 0 auto; }

.planBox { margin-top: 20px; }
.planBox>div { width: 48%; margin-bottom: 20px; }
.planBox>div:nth-child(2), .planBox>div:nth-child(5),
.planBox>div:nth-child(3), .planBox>div:nth-child(6){ margin-top: 0; }

.plan_slide::before {
    border-top: 20px solid #efa627;
    border-right: 20px solid #efa627;
    border-bottom: 20px solid transparent;
    border-left: 20px solid transparent;
}
.planBox>div.irodori .plan_slide::before {
    border-top: 20px solid #f05365;
    border-right: 20px solid #f05365;
}
.planBox>div.nadeshiko .plan_slide::before{
    border-top: 20px solid #c67cbe;
    border-right: 20px solid #c67cbe;
}
.planBox>div.yukata .plan_slide::before {
    border-top: 20px solid #66c1b5;
    border-right: 20px solid #66c1b5;
}
.planBox>div.haikara .plan_slide::before {
    border-top: 20px solid #66c1b5;
    border-right: 20px solid #66c1b5;
}
.planBox>div.mens .plan_slide::before {
    border-top: 20px solid #1863a7;
    border-right: 20px solid #1863a7;
}
#plan .price .small {font-size: .7em; }

.planBox>div.yukata_mens .plan_slide::before {
    border-top: 20px solid #67bbd2;
    border-right: 20px solid #67bbd2;
}
.plan_slide::after { top: 7px; right: 3px; background-size: 12px; }


.planBox>div a .txtBox { padding: 5px 10px;}

#plan .name,#plan .price { font-size: 1em; font-weight: bold; }
#plan .basic .name { font-size: .95em!important; }


/*レンタルプラン料金に含まれるもの-------------*/
#item { padding: 40px 0; }
#item::before { background-size: 200px; right: -210px; height: 160px; }

#item .inBox::after,#item .inBox::before { left: 6%; }

.itemList { width: 70%; }
.itemList li {  width: 45%; }


/*レンタルプラン料金に含まれないもの*/
#item .note { width: 70%; padding: 20px; }
#item .note h4 { text-align: center; }
#item .decoImg { right: -15px; }
#item .decoImg img { width: 40%; }
#item .note p { text-align: center; }


/*レンタルオプション-------------*/
#option { padding: 40px 0; }
#option::before { top: -50px; left: -20px; height: 160px; background-size: 240px; }
#option .inBox::before { right: 6%; }
#option .inBox::after { right: 6%; }
.optionList { width: 75%; padding-bottom: 0; }
.optionList>li{  width: 100%; }
#option .decoImg {left: 15px; }



/* ---------------------------------------
お客様フォトギャラリー
----------------------------------------- */
.gallery .secTtl span { right: 40px; }
.photoList li {  width:49%;}


/* ---------------------------------------
ご予約について
----------------------------------------- */
#reserve .secTtl span { top: -30px;  right: -30px; }
#reserve::after { top: -10px; width: 150px; height: 140px; background-size: 150px; }
#reserve .lead { margin: 0 auto 2em; }
.reList>li { width: 45%; margin-bottom: 20px; }
.reList>li:nth-child(2n) { margin-top: 30px; }
.reList>li:not(:last-child)::after { display: none; }
.reList>li img { width: 100%; }
#reserve .btn-brown a {padding: .5em 2em .6em 0em!important; letter-spacing: 0; }



/* ---------------------------------------
よくある質問
----------------------------------------- */
.faq {background-size: 100px;}
.faq .secTtl span { right: -20px; }
.faq .secTtl span img { height: 20px; }
.faqList li { padding: 0 1em .5em 3.5em; }
.faqList li::before { line-height: 1.7; }
.faqList li a { font-size: 1.15em; }


/* ---------------------------------------
blog　instagram
----------------------------------------- */
.inBox::before,.inBox::after { display: none; }

.blog { background-size: 100px; }
.blogList li { width: 48%; margin-bottom: 4%; }
.blogList li a figure { height: 120px; }

/*.instagram::before { top: 0; width: 80px; height: 80px; background-size: 80px;}*/
/*.instaList li { width: 49%; margin-bottom: 2%; }*/


  #instaList li { margin: 0 5px; }



/* ---------------------------------------
アクセス
----------------------------------------- */
#access .secTtl span { right: -30px; top: -30px; }

#access .imgBox .shopBox { height: auto; margin-bottom: 45%; }
#access .imgBox .shopBox>* { position: static!important; width: 100%!important; }
#access .commentBox { right: -20px; bottom: -120px; width: 80%;}
#access .commentBox>figure p { right: 18px;  }
#access .flex>* { width: 100%; }
#access .map::before { display: none; }


}





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

  #plan .name { font-size: .8em; }
  #option .inBox::before { width: 5%; right: 4%;}
  #option .inBox::after { right: 4%; }
  .optionList { width: 85%; }
  #access .commentBox { width: 90%; }
  #access .commentBox>figure p { font-size: .8em; }





}