@charset "UTF-8";

/*------------------------------------------------------------
    基本設定 コンテンツ幅
------------------------------------------------------------*/
.content {
    margin-bottom: 60px;
}
.content_area {
	position:relative;
	padding: 0 20px;
	margin: 0 auto;
}
.content_area.nopadding_sp {
	padding:0px;
}
@media screen and (min-width: 768px) {
    .content_area, .content_area.nopadding_sp {
			padding: 0 30px;
			max-width: 1320px;
    }
		.content_area.width_small_pc{
			max-width:840px;
		}
}
@media screen and (min-width: 992px) {
    .content {
        margin-bottom: 120px;
    }
    .content_area, .content_area.nopadding_sp {
        padding: 0 60px;
    }
}
/*------------------------------------------------------------
    基本設定カラー
------------------------------------------------------------*/
.bg_lightgray{background-color:#F0F0F0;}
.bg_ivory{background-color:#F4F0E9;}
.bg_gray{background-color:#F2F0F0;}
.bg_gray2{background-color:#CACECE;}
.bg_brown{background-color:#A0967E;}
.bg_lightgreen{background-color:#D7ECE6;}
.bg_darkgreen{background-color:#0C706E;}
.bg_white{background-color:#fff;}
.bg_black{background-color:#000;}

.text_white{color:#ffffff;}
.text_red{color:var(--color-red);}
.text_blue{color:var(--color-blue);}


/*------------------------------------------------------------
    基本設定　テキスト
------------------------------------------------------------*/
.text_center{text-align:center;}
.text_right{text-align:right;}
.tategaki{writing-mode: vertical-rl;}

/*------------------------------------------------------------
    切り替え
------------------------------------------------------------*/
.visibility--s,
.visibility--m,
.visibility--l {
    display: none !important;
}
@media screen and (min-width: 768px) {
    .hidden--s {
        display: none !important;
    }
    .visibility--s {
        display: block !important;
    }
}
/* ----- media END ----- */
@media screen and (min-width: 992px) {
    .hidden--m {
        display: none !important;
    }
    .visibility--m {
        display: block !important;
    }
}
/* ----- media END ----- */
@media screen and (min-width: 1200px) {
    .hidden--l {
        display: none !important;
    }
    .visibility--l {
        display: block !important;
    }
}

/*------------------------------------------------------------
  コンテンツ
------------------------------------------------------------*/
	/*共通*/
ul.basic{
	font-size:1.4rem;
	list-style-type:disc;
	line-height:1.5;
	margin-bottom:1em;
}
ul.basic li{
	margin-left:1.5em;
}


@media screen and (min-width: 768px) {
}
@media screen and (min-width: 960px) {
}
@media screen and (min-width: 1200px) {
}

/*------------------------------------------------------------
  INDEX
------------------------------------------------------------*/
.section_title{
	font-size:6vw;
	text-align:center;
	font-weight:bold;
	margin:2em 0 1em;
	line-height:1.5;
	color:var(--color-black);
}
.section_title.underline{
	padding-bottom:0.5em;
	border-bottom:1px solid var(--color-black);
}
.section_title.scene{
	font-weight:normal;
	color:#fff;
	border-top:1px solid #fff;
	border-bottom:1px solid #fff;
	padding:0.5em 0 0.5em;
}
.section_title.comment{
	font-weight:normal;
	color:#333;
	position: relative;
}
.section_title.comment:before,
.section_title.comment:after{
  border-top: 1px solid;
  content: "";
  position: absolute;
  top: 50%;
  width: 15%;
}
.section_title.comment:before{
  left: 0;
}
.section_title.comment:after{
  right: 0;
}

@media screen and (min-width: 768px) {
	.section_title{font-size:3rem;}
	.section_title.comment:before,
	.section_title.comment:after{
		width:30%;
	}
}
@media screen and (min-width: 960px) {
}
@media screen and (min-width: 1200px) {
}


	/* mv */
.mv_copy{
	text-align:center;
	padding:60px 0% 30px;
	position:relative;
}


@media screen and (min-width: 768px) {
	.mv_copy{
		padding:60px 0% 0px;
	}
}
@media screen and (min-width: 960px) {
}
@media screen and (min-width: 1200px) {
}


	/*intoro*/
#intro{
	padding:0px 0 0px;
	color:#912E2E;
	font-weight:bold;
}
@media screen and (min-width: 768px) {
}
@media screen and (min-width: 960px) {
}
@media screen and (min-width: 1200px) {
}


	/*lineup*/
#lineup{
	padding:0px 0 40px;
}

.lineup_box{
	padding-bottom:0px;
}
.lineup_box_title{
	text-align:center;
	margin:3% 0 3%;
	font-size:4vw;
	font-weight:bold;
	line-height:1.8;
}
.charactor_box_text{
	display: flex;
	flex-direction: row;
}

@media screen and (min-width: 768px) {
	.lineup_box_title{
		margin:1em 0 1em;
		font-size:1.4rem;
	}
}
@media screen and (min-width: 960px) {
}
@media screen and (min-width: 1200px) {
}

	/*scene*/
ul.list_feature{
	font-size:1.5rem;
	line-height:1.5;
	margin-bottom:1em;
}
ul.list_feature li{
	position:relative;
	background-size:1.5em;
	margin-bottom:2em;
	padding-left:4em;
}
ul.list_feature li::before{
	content:'';
	background-position:center center;
	background-repeat:no-repeat;
	background-size:3em;
	width:3em;
	height:3em;
	position:absolute;
	display:block;
	top:50%;left:0;
	transform:translateY(-50%);
}
ul.list_feature li.party::before{
	background-image:url(../images/top/icon_party.png);
}
ul.list_feature li.house::before{
	background-image:url(../images/top/icon_house.png);
}
ul.list_feature li.outdoor::before{
	background-image:url(../images/top/icon_outdoor.png);
}

@media screen and (min-width: 768px) {
	ul.list_feature{
		font-size:2rem;
	}
}
@media screen and (min-width: 960px) {
}
@media screen and (min-width: 1200px) {
}

	/*itemabout*/
#itemabout{
	padding:60px 0 20px;
}
#itemabout h2.section_title{
	margin-top:0;
}

	/*store*/
#store{
	color:var(--color-black);
}
.shop_box, .shop_box a{
	display:flex;
	align-items:center;
	font-size:1.6rem;
}
.shop_box h3{
	padding-left:0.75em;
	width:calc(100% - 60px);
}
.shop_box .logo{
	height:60px;
	width:60px;
	vertical-align:middle;
}
@media screen and (min-width: 960px) {
	.store_inner{
		margin:0 0 40px 10vw;
	}
}
@media screen and (min-width: 1200px) {
	.store_inner{
		margin:0 0 40px 20vw;
	}
}

	/*itemdescription*/
#itemdescription{
	padding:0.1px 0 80px;
}
#itemdescription h3{
	font-size: 1.4rem;
	line-height: 1.8;
	margin-bottom: 1em;
}

	/*caution*/
#caution{
	color:var(--color-black);
}
#caution h3{
	font-size:1.6rem;
	margin:2em 0 1em;
}
@media screen and (min-width: 768px) {
	#caution h3{
		font-size:1.6rem;
	}
}
@media screen and (min-width: 960px) {
}
@media screen and (min-width: 1200px) {
}

	/*faq*/
.faq_box{
	padding-bottom:10px;
	display: flex;
	flex-direction: column;
	height: 100%;
}
.faq_box h3{
	color:var(--color-black);
	font-size:1.6rem;
	padding-left:2.5em;
	padding-bottom:0.75em;
	margin-bottom:0.75em;
	border-bottom:1px solid #ACACAC;
}
.faq_box h3 span {
  display: inline-block;
  background: var(--color-black);
  border-radius: 50%;
  width: 40px;
  height: 40px;
  color: #fff;
  font-size: 24px;
  text-align: center;
  line-height: 40px;
	margin-left:-2em;
	margin-right:0.5em;
}
.faq_box p{
	background:#D2E3EA;
	padding:1em;
	margin-bottom:0;
	height: 100%;
}
@media screen and (min-width: 768px) {

}
@media screen and (min-width: 960px) {
}
@media screen and (min-width: 1200px) {
}


	/*inquiry*/
#inquiry{
	padding:0px 0 80px;
	color:var(--color-black);
}
#inquiry .lineup_box_title{
	font-size:4.5vw;
}
.inquiry_phone{
	border-top:2px solid var(--color-black);
	border-bottom:2px solid var(--color-black);
	padding:0.5em 0;
	font-weight:bold;
	font-size:8vw;
}
.btn{
	background-color:var(--color-black);
	border:2px solid var(--color-black);
	border-radius:.5em;
	color:#fff;
	transition:.4s;
	font-size:4vw;
}
.btn a{
	display:block;
	padding:1em;
}
.btn:hover{
	transition:.4s;
	background-color:#fff;
	color:var(--color-black);
}

@media screen and (min-width: 768px) {
	#inquiry .lineup_box_title{
		font-size:2rem;
	}
	.inquiry_phone{
		font-size:4rem;
	}
	.btn{
		font-size:1.8rem;
	}
}

	/*foot sns*/
.foot_sns_icon img{width:80px;}

/*youtube*/
.youtube_bg{
  padding:0px 0 0px;
}
.youtube{
  position:relative;
  width:100%;
  padding-top:56.25%;
}
.youtube iframe{
  position:absolute;
  top:0;
  right:0;
  width:100%;
  height:100%;
}

