@charset "UTF-8";


/*------------------------------

 共通

------------------------------*/
.room-slide{
	margin-top: 80px;
}
.enjoy-slide{
	margin: 40px auto 80px;
}
#hero{
	margin-bottom: 50px;
}
/*==== mobile スマフォ横〜用css ===*/
@media screen and (max-width: 896px){
	
}

/*==== mobile スマフォ縦用css ===*/
@media screen and (max-width: 480px){
	
}


/*------------------------------

Tab Category

------------------------------*/
.tab-category{
    width: 100%;
	max-width: 860px;
	margin: 0 auto 70px;
}
.tab-category .flex-box {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    list-style: none;
    padding: 0;
    justify-content: space-between;
	margin: 0 auto 20px;
	align-items: center;
}
.tab-category .item{
    border: solid 1px #74a599;
	background-color: #74a599;
	border-radius: 4px;
	padding: 12px;
    font-size: 12px;
    font-weight: bold;
    color: #fff;
    width: 24%;
    cursor: pointer;
    transition: all 300ms 0s ease;
    margin-bottom: 10px;
}
.tab-category .item:hover{
    opacity: .6;
}
.tab-category .item.is-active{
	background-color: #edf1f0;
	color: #74a599;
}

/*==== mobile スマフォ横〜用css ===*/
@media screen and (max-width: 896px){
	.tab-category {
		margin: 0 auto 90px;
	}
}

/*==== mobile スマフォ縦用css ===*/
@media screen and (max-width: 480px){
	.tab-category {
		width: 85%;
		margin: 0 auto 40px;
	}
	.tab-category .item {
		width: 49%;
		margin-bottom: 10px;
	}
}


/*------------------------------

Sec01

------------------------------*/
.sec01{
	width: 760px;
	margin-left: auto;
    margin-right: auto;
	margin-bottom: 170px;
}
.category-ttl{
	font-size: 18px;
    text-align: left;
    margin-bottom: 50px;
}
.sec01 .box-flex{
	display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -webkit-align-items: center;
    align-items: flex-start;
    text-align: left;
	justify-content: space-between;
}
.flex-l{
	width: 50%;
	margin-top: -10px;
    padding-right: 40px;
}
.flex-r{
	width: 50%;
    text-align: right;
}
.detail{
	text-align: left;
    padding: 20px 0;
	border-top: dashed 1px #B8B8B8;
	border-bottom: dashed 1px #B8B8B8;
	margin-top: 10px;
}
.detail dt{
	float: left;
    width: 35%;
	font-weight: bold;
}
.detail dd{
	margin-left: 35%;
	margin-bottom: 10px;
}
.sec01 .box-flex .txt{
	flex-basis: 40%;
    line-height: 2.5;
}
.pdf:before{
	content: "\f15b";
    font-family: FontAwesome;
	margin-right: 5px;
    font-size: 14px;
}
.mt30{margin-top: 30px;}
.mb220{margin-bottom: 220px;}


/*==== mobile スマフォ横〜用css ===*/
@media screen and (max-width: 896px){
	.sec01 {
		width: 65%;
	}
	.sec01 .box-lead {
		width: 100%;
	}
	.sec01 .box-flex .txt {
		flex-basis: 100%;
		margin-right: 0;
        line-height: 2;
		text-align: justify;
	}
	.sec01 .box-flex .img{
		margin: 20px auto 0;
	}
	.flex-l {
		margin-top: -6px;
	}
	.detail dt {
		width: 100%;
	}
	.detail dd {
		margin-left: 0;
	}
	.place{
	padding-top: 20px;
	}
}

/*==== mobile スマフォ縦用css ===*/
@media screen and (max-width: 480px){
	.sec01 {
		width: 85%;
		margin-bottom: 90px;
	}
	.sec01 .box-lead {
		width: 100%;
	}
	.category-ttl {margin-bottom: 20px;}
	.flex-l {
		width: 100%;
		order: 2;
		padding-right: 0;
	}
	.flex-r{
		order: 1;
		width: 100%;
		margin-bottom: 20px;
	}
	.detail{width: 100%;}
	.detail dt {width: 35%;}
	.detail dd {margin-left: 35%;}
	.mt30{margin-top: 0;}
}