@charset "utf-8";


/* common ---------------- */
#contents {  }

#pan li { display: inline-block; font-size: .7em; }
#pan li:not(:last-child)::after { content: ">"; padding-left: 15px; padding-right: 10px; }

.bg_beige { background-color: #f4f1f0; }
.bg_wt { background-color: #fff; }

/* title */
.pagettl { margin-top: 30px; }
.pagettl .img img { width: 100%; }



/* conNav */
.conNav { margin-top: 50px; }
.conNav li { width: 48%; margin-bottom: 1em; font-family: inherit; }
.conNav.item4 li:nth-child(even) { margin-left: 4%; }
.conNav.item3 li { width: 100%; }
.conNav .btn3 { min-width: 100%; }

/* disc_list */
.disc_list li { padding-left: 20px; position: relative; }
.disc_list li::before { content: ""; position: absolute; top: 12px; left: 0;
	width: 10px; height: 10px; background: url(../img/common/list_point.png) no-repeat center / contain; }


.sub_box { padding: 1.5em 2em; background: #f4f1f0; }
.sub_box .ttl { padding-bottom: .5em; border-bottom: 1px solid #d4d2d1; }

/* contents ---------------- */

.lead { margin:2.5em auto 2em; }

/* 検索 */
.searchBox { margin:3em auto; padding:30px 10px 20px; text-align:center; background-color:#f4f1f0; }
.searchBox form { position:relative; z-index:2; }
.searchBox input[type="submit"] { margin-left:1em; font-size:1.6rem; }


/* サムネイル付きスライド */
.mainSlide { text-align:center; }
.mainSlide img { margin:0 auto; }
.thumbSlide { margin-top:10px; }


/*=== レンタルプラン ===*/
.notesBox { margin: 50px auto; padding:20px 30px 40px; }
.notesBox .txt1 { margin-bottom: 1em; }
.notesBox .txt2 { text-align: center; }

#planList { margin-top: 50px; }
#planList .list > li:nth-child(n+2) { padding-top:70px; margin-top:70px; border-top:1px solid #ccc; }
#planList .txtBox .imgBox img { max-height: 525px; margin:0 auto; }
#planList .txtBox .shop { margin-bottom:20px; }
#planList .txtBox .shop li { background-color:#f5f0e6; border-radius:3px; padding:0 15px; }
#planList .txtBox .shop li:nth-child(n+2) { margin-left:10px; }
#planList .txtBox .price { font-size: 1.1em; text-align:center; }
#planList .txtBox .price em { font-size:1.8em; }
#planList .txtBox .period { text-align:center; margin-top:10px; font-size:18px; color:#ba4242; }
#planList .txtBox .txt { margin:30px 0 20px; }
#planList .txtBox .txt p + ul { margin-top:0.5em }
#planList .txtBox .txt ul li { padding-left:1em; text-indent:-1em; }
#planList .txtBox .txt ul li:before { content:"＊"; }
#planList .list .txtBox .detailBox {
     margin-top:25px;
     padding:15px 30px 30px;
    width: 100%;
    }
#planList .list .txtBox .detailBox ul {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
}
#planList .list .txtBox .detailBox li {
    width: calc((100% - 30px) / 2);
    
}
#planList .list .txtBox .detailBox li h3 {
    background: #717a8e;
    width: 60%;
    margin: 0 auto;
    text-align: center;
    color: #fff;
}
#planList .txtBox .detailBox .ttl { text-align:center; font-size:18px; margin-top: 0; margin-bottom:20px; }


#planList .txtBox .set_notes { margin-top:0.5em; font-size:0.85em; color:#ba4242; }
#planList .txtBox .set_notes > p { position:relative; padding-left:1.3em; }
#planList .txtBox .set_notes > p:before { content:"*"; position:absolute; top:0; left:0; font-size:1.6em; line-height:1.5; }

#plan #obi { position:relative; margin-top:50px; padding-top:100px; padding-bottom:10%; }
#plan #obi .imgBox { position:absolute; top:0; left:0; max-width:380px; width:40%; z-index:3; }
#plan #obi .imgBox .fukidashi { text-align:center; margin-bottom:15px; font-size:17px; }
#plan #obi .txtBox { position:relative; width:65%; max-width:650px; margin:0 0 0 auto; padding:50px 60px; z-index:1; }
#plan #obi .txtBox .ttl { font-size:25px; margin-bottom:20px; }
#plan #obi .txtBox .ttl_s { font-size:18px; margin-bottom:10px; }
#plan #obi .txtBox .bg_wt { margin-top:15px; padding:10px; font-size:14px; }
#plan #obi .txtBox .bg_wt a { color:#da6d47; text-decoration:underline; }
#plan .btnBox{ margin-bottom:4em; }


.nameBox { align-items: center; }
.nameBox .name { max-width: 60%; padding: .5em 0 .5em .5em; font-size: 1.15em; border-left: 2px solid #dac5c4; }
.nameBox .price { font-size: 1.1em; flex: 1; -webkit-flex: 1; text-align: right; }

.option { margin-top: 50px; padding: 50px 0; }
.option > div { padding: 25px 15px; }
.option > div + div { margin-top: 40px; }
.option .kitemiruo { margin-top: 50px; }
.option .detailBox .slider { width: 100%; }



.dl_layout > div { display: flex; display: -webkit-flex; padding-bottom: 30px;}
.dl_layout dt { width: 70%; padding-left: 20px; position: relative; }
.dl_layout dt::before { content: ""; position: absolute; top: 10px; left: 0;
background: url("../img/common/list_point.png") no-repeat center / contain; width: 10px; height: 10px; }
.dl_layout dd { flex: 1; -webkit-flex:1; text-align: right; }


.faqBox { margin-top: 50px; }
.faqBox > dl { margin-top: 20px; }
.accordion dt { padding: 15px 50px 15px 15px;
    font-size: calc(1.4rem + ((1vw - 3.2px) * 1.4286));
    background: #f4f1f0;
    position: relative;
    cursor: pointer; }
.accordion dd + dt { margin-top: 1em; }
.accordion dt:before { content: "";
    position: absolute;
    top: 50%;
    right: 20px;
    -webkit-transform: translateY(-50%) rotate(45deg);
    transform: translateY(-50%) rotate(45deg);
    width: 7px;
    height: 7px;
    border-bottom: 2px solid #434343;
    border-right: 2px solid #434343; }
.accordion dt.active:before { -webkit-transform: translateY(-50%) rotate(-135deg);
    transform: translateY(-50%) rotate(-135deg); }
.accordion dd { padding: 15px 10px 20px; color: #434343; }

.faqForm { width:100%; max-width:800px; margin:3.5em auto 6em; padding:1em; text-align:center; background:#f4f1f0; }
.faqForm input[type="text"] { width:65%; margin:0; padding:.4em; font-family:inherit; font-size:1.1em; }
.faqForm > .submit { display:inline-block; vertical-align:top; }

/*=== gallery ===*/
.galleryList { margin:2em 1em 1.5em; }
.galleryList li { width:24%; margin-left:1%; margin-bottom:1%; background:#f4f1f0; }
.galleryList li:nth-child(4n+1) { margin-left:0; }
.galleryList figure { padding-top:100%; position:relative; }


/*=== ご予約 ===*/
.how,
.caution,
.terms,
.cancel,
.checkList { margin-top: 50px; }

#terms.scroll { overflow-y: scroll; max-height: 300px;}
#terms.scroll .conttl3 { margin-bottom: 1em; font-size: 1.25em;}
#terms.scroll .conttl3:not(:first-of-type){ margin-top: 3em;}

.checkList ul li + li { margin-top: .5em; }
.checkList ul li label input { margin-right: .5em; }
.btn_booking { margin: .5em auto; text-align: center; }
.btn_booking .btn3 { width: 100%; display: list-item; }
.btn_booking .btn3 .big { font-size: 1.5em; }/*
.checkList > ul :nth-child(2).btn_booking .btn3 { padding: .3em; }
.checkList > ul :nth-child(2).btn_booking .big { font-size: 1.25em; }
*/
/*=== レンタルの流れ ===*/
.flow { margin-top: 50px; }
.flow_list { counter-reset: num; }
.flow_list > li + li { margin-top: 80px; }
.flow_list li .ttl { padding: .5em 0 .5em 3.5em; font-size: 1.6em; background: #f4f1f0; position: relative; }
.flow_list li .dec { position: absolute; top: -15px; left: 10px; margin: 0; }
.flow_list li .dec_in {position: relative;
  display: inline-block;
  width: 65px;
  height: 65px;
  border-radius: 50%;
  background: #e3d0d2;
    color: #fff;}
.flow_list li .dec_in span { position: absolute;
  display: inline-block;
  left: 0;
  top: 50%;
	padding-bottom: 20px;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  width :65px;
  text-align:center;
    font-size: .5em;}
.flow_list li .dec_in span::before { counter-increment: num;
    content: "0" counter(num);
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    font-size: 20px;
    line-height: 1.2; }

.flow_list .lead_box ul li { margin-right: 20px; }
.flow_list li > div { margin-top: 30px; }

.flow_list li .txt { margin-top: 0; }
.flow_list .kome_list li { display: inline-block; }

.kome_list li { padding-left: 15px; position: relative; }
.kome_list li::before { content: "＊"; position: absolute; top: 0; left: 0; bottom: 0; }


/*=== ご注意事項 ===*/
.attention_list > li { margin-top: 50px; }
.dot_list li { padding-left: 20px; position: relative; }
.dot_list li + li { margin-top: 10px; }
.dot_list li::before { content: "";
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    margin: auto;
    background: url(../img/common/list_point.png) no-repeat center / contain;
    width: 10px;
    height: 10px; }

.covid19 { margin-top: 20px; }

/*=== アクセス ===*/
.access_intro { margin-top: 30px; position: relative; }
.access_intro .img_box { width: calc(100% - 15%); }
.access_intro .img_box::before { content: ""; position: absolute; top: -50px; right: 0; background: #f4f1f0; width: calc(100% - 20%); height: 200px; z-index: -3; }

.access { margin-top: 50px; }
.add_box { margin: 20px auto 40px; }
.add_box .tel_btn em { font-size: 1.5em; }

.access_list { max-width:400px; margin:1.5em auto; }

/*=== お問い合わせ ===*/
.c-form { margin-top: 50px; }
.c-form > div { border-bottom: 1px solid #e3d0d2; }
.c-form > div:first-child { border-top: 1px solid #e3d0d2; }
.c-form dt,
.c-form dd { padding: 15px; }
.c-form dt { font-size: 1.5rem; background: #f4f1f0; position: relative; }
.c-form dt.required::after { content: "必須"; position: absolute; right: 10px; display: inline-block; padding: 0 8px; font-size: .8em; color: #fff; background: #ba4242; }

.txtBox { margin: 30px auto; }
.btn_policy { margin-top: 30px; }

.thanks_box .btn_top { margin-top: 50px; }
.faq_underline {border-bottom: solid 1px #e3d0d2;}

/*=== サイトマップ ===*/
.sitemap_list li { width: 100%; }
.sitemap_list { margin-top: 50px; }
.sitemap_list li a { display: block; padding: .5em 1em; position: relative; border-bottom: 1px dotted #ccc; }
.sitemap_list li a::before { content: ""; position: absolute; top: 0; left: 0; bottom: 0; margin: auto; width: 5px; height: 5px;
	background-color: #e3d0d2; }



/*=== 求人情報 ===*/
.bg_be { background: #faf6f6; padding: 40px; }
.reqBox { margin-top: 80px; }


 
.reqBox .conttl4{ margin-bottom: 20px; }
.reqBox .accordion dd + dt { cursor: auto; }
.reqBox .accordion dt:before { display: none; }
.reason { margin-top: 50px; }
.reason .sec_ttl .copy { font-size: calc(1.8rem + ((1vw - 3.2px) * 3.7209)); }
.reason .sec_ttl .copy em { font-size: calc(3rem + ((1vw - 3.2px) * 3.7209)); }
.reason .head_txt { margin-top: 20px; }

.reasonList { margin-top: 30px; }
.reasonList > li + li { margin-top: 40px; }

.reasonList > li:nth-child(1) .ttl { color: #bc9393; }
.reasonList > li:nth-child(2) .ttl { color: #b393a8; }
.reasonList > li:nth-child(3) .ttl { color: #8a93a7; }
.reasonList .ttl { font-size: calc(1.6rem + ((1vw - 3.2px) * 3.7209)); line-height: 1.4; }

.reasonList .img_box { position: relative; }
.reasonList .img_box::before { content: ""; position: absolute; top: 0; left: -5%; bottom: 0; margin: auto; width: 44%;
background: no-repeat center / contain; z-index: 1; }
.reasonList > li:nth-child(1) .img_box::before { background-image: url("../img/top/txt_reason01.png?20200826"); }
.reasonList > li:nth-child(2) .img_box::before { background-image: url("../img/top/txt_reason02.png?20200826"); }
.reasonList > li:nth-child(3) .img_box::before { background-image: url("../img/top/txt_reason03.png?20200826"); }

.reasonList > li:nth-child(even) .img_box::before { right: 0; left: auto; }
.reasonList .img_box > ul { width: calc(100% - 27%); margin-left: auto; }
.reasonList .img_box > ul > li { position: relative; height: 100%; }
.reasonList .img_box > ul > li p { position: absolute; bottom: 10px; right: 10px; margin: 0; padding: 0 .5em; background: #fff; font-size: .8em; color:#5b5b5b; }

/*
.reasonList .img_box > ul > li:nth-child(1) { width: 34%; }
.reasonList .img_box > ul > li:nth-child(2) { width: 62%; margin-left: 4%; }
*/
.reasonList .img_box > ul > li:nth-child(1) { width: 48%; }
.reasonList .img_box > ul > li:nth-child(2) { width: 48%; margin-left: 4%; }


.reasonList > li:nth-child(even) .img_box > ul { margin-right: auto; margin-left: 0; }
.reasonList > li:nth-child(even) .img_box > ul > li:nth-child(1) { order: 1; }
.reasonList > li:nth-child(even) .img_box > ul > li:nth-child(2) { margin-left: 0; margin-right: 4%; }
.reasonList .img_box > ul > li img { width: 100%; }

.reasonList .lead_box { padding: 16% 0 10%; margin-top: -45px; }
.reasonList > li:nth-child(2) .lead_box { background: #e2d7de; }
.reasonList > li:nth-child(3) .lead_box { background: #d7dae4; }
.reasonList .lead_box .num { margin-top: 0; color: #fff;background: #bc9393; display: inline-block; padding: 0 1em; }
.reasonList .lead_box .sub_box {     background: #faf6f6; }

/* #recruit */
.basic.attList > li{ margin-bottom:2em;  }
.basic.attList .ttl{ margin-bottom:1.5em; font-size:1.2em; padding: 15px 50px 15px 15px;  background: #f4f1f0; }
#enquete{ margin-top:3em; }
#enquete .conttl{ margin-top: 1em; margin-bottom:1.3em; font-size:1.4em; }

.reqBox .c-form {  margin: 0 auto; }
.reqBox .c-form dt,.reqBox .c-form dd {background:#fff; }

.voiceTtl { position: relative; padding-left: 1.5em; text-align: left; font-size: 1.3em; font-weight: bold; }
.voiceTtl::before { content: ""; position: absolute; top: 53%; left: 0; width: 1em; height: 1em; border-radius: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); background: #bc9393; }

.arrowList > li { position: relative; margin-bottom:2em; }
.arrowList > li:not(:last-child)::before { content: "↓"; position: absolute; left: 0; bottom: -30px; }



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

	#contents { margin-top: 50px; }

	.lead { text-align:center; padding:0 1em; }

	/*=== よくある質問 ===*/
	#faq .faqBox { margin-top: 80px; }
	.accordion dt { font-size: 1.8rem; }
	.accordion dd { padding-bottom: 50px; }

	/*=== サイトマップ ===*/
	.sitemap_list li { width: 48%; }

	/*=== 注意事項 ===*/
	.covid19 { margin-top: 0; }
  
  .basic.attList .ttl {font-size: 1.8rem;}
  
  
  .reqBox .c-form dt,.reqBox .c-form dd { border-left: 3px solid #bc9393;}
  .reqBox .c-form dd { border-left: 1px dashed #bc9393; }
  
}

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

	/*=== 料金プラン ===*/
  #planList .list .txtBox { position:relative; min-height:670px; }
  #planList .list .txtBox > * { width:60%; }
  #planList .txtBox .imgBox { position:absolute; top:0; right:0; width:40%; }


	.option > div { padding: 20px 40px 40px; }
	.option .detailBox .slider { width: 40%; }
	.option .detailBox .lead_box { width: 55%; }

	.conNav li { width: 23.5%; text-align: center; max-width: none; }
	.conNav.item4 li:not(:nth-child(4n+1)) { margin-left: 2%; }
    .thumbSlide1 {
        display: flex;
        width: 100%;
        flex-wrap: wrap;
    }
    .thumbSlide1 li {
        width: calc(100% / 2);
    }
	/*=== よくある質問 ===*/ 
	.conNav.item3 li { width: 32%; }
	.conNav.item3 li:not(:nth-child(4n+1)) { margin-left: 0; }
	.conNav.item3 li:not(:nth-child(3n+1)) { margin-left: 2%; }

	/*=== レンタルの流れ ===*/
	.flow_list li .ttl { padding: .5em 0 .5em 4.5em; }
	.flow_list li .dec { left: 20px; }
	.flow_list li .dec_in { width: 80px; height: 80px; }
	.flow_list li .dec_in span { width: 80px; }

	.flow_list li .lead_box { width: 60%; }
	.flow_list li .lead_box.wide { width: 100%; }
	.flow_list li figure { width: 35%; }

	/*=== アクセス ===*/
	.access_intro .img_box { width: calc(100% - 30%); }
	.access_intro .img_box::before { height: 70%; }

	.root_list li { width: 32%; }

	/*=== お問合わせ ===*/
	.c-form > div { display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; }
	.c-form dt { width: 25%; }
	.c-form dd { -webkit-flex: 1; flex: 1; }

	/*=== ご予約 ===*/
	.btn_booking { width: 45%; }
	.checkList > ul { width:70%; margin: auto; }
/*	.checkList > ul .btn_booking + .btn_booking { margin-top: 0; }*/
  
  
	/*=== 求人情報 ===*/
  .reasonList .ttl { font-size: 2.8rem; }
  .reasonList { margin-top: 60px; }
	.reasonList .lead_box { padding: 8% 0 5%; }
  
}

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

}

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

}

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

	.root_list li + li { margin-top: 20px; }

  /*=== gallery ===*/
  .galleryList li { width:48%; margin-left:4%; margin-bottom:4%; }
  .galleryList li:nth-child(2n+1) { margin-left:0; }
  
  
  /*=== 求人情報 ===*/
  .reason .sec_ttl { font-size: 1.8rem; }
  .reasonList .img_box > ul > li p { right: 5px; bottom: 5px; font-size: .6em; }
  .reqBox { margin-top: 50px;}
  
  .bg_be { padding: 20px; }
  .reqBox .c-form dt  { border-top: 3px solid #bc9393;
    text-align: center;
    padding: 10px 15px; }
  .reqBox .c-form dd { border-top: 1px dashed #bc9393; }
  .reqBox .c-form > div {  margin-bottom: 0;    margin-bottom: 10px; }
  
  #recruit .accordion dt { padding: 15px!important; }
  
  .thumbSlide1 {
    display: flex;
    flex-wrap: wrap;
  }
  .thumbSlide1 li {
    width: calc(100% / 2);
  }
  #planList .list .txtBox .detailBox li {
    width: 100%;
}
}

@media screen and (min-width: 960px) {
    #planList .list .txtBox {
        min-height: auto;
    }
}
.plan-flex li a.btn3 {
	font-size: 14px;
}
@media screen and (max-width: 480px) {
	.plan-flex li a.btn3 {
}
}