@charset "UTF-8";

/* ----------------------
コンテンツ SP
------------------------*/

/* あいさつ文 SP 
---------------------------*/
.gree{padding: 50px 0 10px 0;}

.gree h2{
	padding: 0 10px;
	text-align: center;
}

.gree h2 + p{
	padding-top:20px;
	line-height: 1.4;
	letter-spacing: 2px;
	text-align: center;
}
.gree h2 + p span{padding: 5px 0;}

.gree h3{
	padding: 10px 0;
	text-align: center;
}

.gree h3 + p{
	line-height: 1.4;
	text-align: center;
}

.gree h3 + p + p{
	max-width: 550px;
	margin:0 auto;
	padding:20px 15px;
	text-align: left;
	line-height: 2;
}


/*キャンペーン SP
-------------------*/
.campH2{
	padding: 50px 0 0 0;
	text-align: center;
	font-family: 'Abel', sans-serif;
	font-size: 24px; font-size: 2.4rem;
	font-weight: bold;
}

#camp{
	max-width: 1300px;
	margin:0 auto;
	padding-top: 50px;
	background:url(../img/bg-camp-top.jpg) no-repeat center top;
}

#campbg-btm{
	padding-bottom: 90px;
	background:url(../img/bg-camp-bottom.jpg) no-repeat center bottom;
}

.camp-in{
	max-width: 1080px;
	margin:0 auto;	
	padding: 20px 0;
	background-color: #f7f7f7;
}

/* 日程タイトル部分 SP */
.camp-ttl{
	max-width: 930px;
	margin:0 auto;
	display: flex;
	flex-direction: column;
}

/* 予約不要と日程 SP */
.camp-ttl-in{
	width: auto;
	margin:0;
	display: flex;
	flex-direction: column;
}
.camp-ttl-in p{
	width: auto;
	text-align: center;
}

.camp-ttl-in p:first-child span{
	display: block;
	width: 136px;
	height: 91px;
	margin: 0 auto;
	padding-top: 45px;
	border: 1px solid #ca93cb;
	border-radius: 50%;
	font-size: 26px; font-size: 2.6rem;
	font-weight: bold;
	color: #900192;
}
.camp-ttl-in p:last-child{padding:15px 0 20px 0;}

/* open と見学会 SP */
.camp-ttl dl{
	width: auto;
	margin:0;
	border:0;
	text-align: center;
	display: flex;
	flex-direction: column;
}

.camp-ttl dl dt{
	width: auto;
	padding:0;
}

.camp-ttl dl dd{
	width: auto;
	padding:20px 0;
	text-align: center;
}


/* キャンペーン内容 SP
------------------------*/
.camp-ev{
	max-width: 1080px;
	margin: 0 auto;
	padding: 0 15px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.camp-ev article{
	width: auto;
	margin-bottom: 30px;
	padding: 30px 15px;
	text-align: center;
	border-radius: 5px;
	background-color: #fff;
}

.camp-ev article h2{padding: 20px 0;}

.camp-ev article h3{
	padding: 0 0 15px 0;
	font-size: 21px; font-size: 2.1rem;
	color: #a40000;
	background:url(../img/noto-camp-line.jpg) no-repeat center bottom;
}

.camp-ev article h3 + p{
	padding: 20px 0;
	text-align: left;
}

.camp-ev article h3 + p span{
	display: block;
	padding: 3px 0;
}

.event1{padding: 0 30px;}
.event1 span:last-child{font-size: 14px; font-size: 1.4rem;}

.camp-ev ol{
	padding: 5px 10px;
	border-top:1px dotted #aaa;
	border-bottom:1px dotted #aaa;
	text-align: left;
}

/* 注意と地図へ SP */
.gomap{
	padding: 0 30px;
	text-align: left;
	position: relative;
}

.gomap p:nth-child(2){
	padding: 10px 0;
	font-style: italic;
}

.gomap p:last-child{
	width: 100%;
	position: absolute;
	left:0;
	top:130%;
}

.gomap p:last-child span{
	display: block;
	width: 40px;
	margin: 0 auto;
}

/* ROOM SP
------------------------*/
#room{
	max-width: 1080px;
	margin:0 auto;
	padding: 50px 15px;
}

.room-in{padding-bottom: 20px;}
/* セミナー SP */
.room-in dl{
	width: auto;
	padding: 0 0 10px 0;
	display: flex;
	flex-direction: column;
}

.room-in dl dt,.room-1 dl dd{width: auto;}

.room-in dl dt{line-height: 1.5;}
.room-in dl dt span{padding: 0 5px 0 0;}
.room-in dl dt span:first-child,
.room-in dl dt span:nth-child(2){font-size: 24px; font-size: 2.4rem;}
.room-in dl dt span:nth-child(2){font-weight: bold;}
.room-in dl dt span:last-child{display: inline;}

.room-in dl dd{padding: 10px 0;}
.room-in dl dd p:last-child{
	text-align: right;
	padding: 5px 10px;
}
.room-in dl dd p:last-child a{text-decoration:underline;}

.col1{color: #900192;}
.col2{color: #005e15;}

/*-- ROOM 内予約ボタン SP--*/
.roomRev a{
	display: block;
	max-width: 640px;
	margin:0 auto;
	padding: 15px 0 10px 0;
	text-align: center;
	border-radius: 5px;
	border:1px solid #aaa;
	line-height: 1.5;
	background: #fff;
}

.roomRev a:hover{
	color: #fff;
	background: #cb2990;
}

.roomRev span{
	display: block;
	letter-spacing: 1px;
	font-size: 21px; font-size: 2.1rem;
	font-weight: bold;
}


/* CUST SP
------------------------*/
#cust{
	max-width: 1080px;
	margin: 0 auto;
	padding: 0 15px 50px 15px;
}

.cust-in{
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
	padding: 0;
}

.cust-in ol{
	width: auto;
	margin: 0;
	padding-bottom: 50px;
}

.cust-in ol li:first-child{
	padding-bottom: 35px;	
	text-align: center;
}

.cust-in ol li:nth-child(2){
	padding-bottom: 5px;
	text-align: center;
	font-size: 18px; font-size: 1.8rem;
	background: url(../img/noto-camp-line.jpg) no-repeat center bottom;	
}
.cust-in ol li:nth-child(2) a{display: block;}
.cust-in ol li:nth-child(2) a:hover{color:#cb2990;}

.cust-in ol li:nth-child(3){
	padding: 10px 0;
	text-align: center;
}
.cust-in ol li:nth-child(3) span{
	display: block;
	color:#cb2990;
	font-size: 14px; font-size: 1.4rem;
}


/* Amenity SP
------------------------*/
#amenity{
	max-width: 1080px;
	margin: 0 auto;
	padding: 0 15px 50px 15px;	
}

#amenity h3{
	padding-bottom: 15px;
	text-align: center;
}
#amenity h3 span{padding:0 5px; line-height: 1.5;}
#amenity h3 span:first-child,#amenity h3 span:nth-child(2){font-size: 18px; font-size: 1.8rem;}
#amenity h3 span:last-child{display: block;}

.ame-in{
	border-radius: 5px;
	margin-bottom: 25px;
	padding: 20px;
}

.ame-in ol{
	display: flex;
	flex-direction: column;
	flex-wrap: wrap;
}

.ame-in ol li{
	background: #fff;
	margin:0 0 5px 0;
	padding: 10px;	
}

.ame-in ol li span{
	padding: 0 5px;
	font-size: 14px; font-size: 1.4rem;
}

.bg-col1{background-color:#f7eef7;}
.bg-col2{background-color:#e4f0e6;}

/*--- その他 other SP ---*/
#amenity dl{
	border-top: 0;
	border-bottom: 0;
	background-color: #f5f5f5;
	display: flex;
	flex-direction: column;
}

#amenity dt,#amenity dd{width:auto;}

#amenity dt{
	padding: 10px 0;
	text-align: center;
	line-height: 1.5;
	font-size: 18px; font-size: 1.8rem;
} 

#amenity dt span{	
	display: block;
	color: #cb2990;
}

#amenity dd{
	padding:10px;
	background: #fff;	
	box-sizing: border-box;
}

#amenity dd p:first-child{padding: 5px 0;}


/* ADD SP 
---------------------------*/
#add{
	max-width: 1080px;
	margin:0 auto;
	padding-bottom: 30px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

/*--- Access　SP ----*/
.acc{
	width: auto;
	padding-bottom: 30px;
}

address{padding: 15px;}
address p:first-child span{padding:0 5px 0 0; display: block;}

/*--- グーグルマップ　SP ----*/
.map-b{
	padding:0;
	width:auto;
	float:none;
}

.ggmap {
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
}
 
.ggmap iframe,
.ggmap object,
.ggmap embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/*--- SNS　SP ----*/
.sns{
	width: auto;
	padding: 0 25px;
}

.sns dl{
	border-radius: 5px;
	border:1px solid #ccc;
	text-align: center;
}

.sns dl a{
	display: block;
	padding: 2em 35px;
	background-color: #fff;
}
.sns dl a:hover{background-color: #a40000;}

.sns dl dd{
	padding-top: 15px;
	font-size: 18px; font-size: 1.8rem;
}
.sns dl a:hover dd{color:#fff;}

/*--- contact　SP ----*/
.contact{padding: 0 25px;}

.contact section a{
	display: block;
	max-width: 640px;
	margin:0 auto;
	padding: 15px 0 10px 0;
	text-align: center;
	border-radius: 5px;
	border:1px solid #aaa;
	line-height: 1.5;
	background: #fff;
}

.contact section p{
	font-size: 24px; font-size: 2.4rem;
	font-weight: bold;
}

.contact section a:hover{background: #a40000;}
.contact section a:hover h2,.contact section a:hover p{color: #fff;}


/* 新着銃砲 SP
----------------------*/
.newsBox{
	max-width: 1080px;
	margin:0 auto;
	border-radius: 5px;
	box-sizing: border-box;
}
.newsBoxIn{
	padding: 20px 15px;
	height: 250px;
	overflow-y: scroll;
	background-color: #f5f5f5;
}

.newsBoxIn dl{
	display: flex;
	flex-direction: column;
	padding: 10px 0;
	border-bottom:1px dotted #aaa;
}

.newsBoxIn dl dt + dd{padding: 5px 0}
.newsBoxIn dd + dd{padding:0;}

.noto-1 span,
.noto-2 span{
	display: block;
	width: 80px;
	height: 25px;
	color: #fff;
	text-align: center;

	border-radius: 5px;
	font-size: 13px; font-size: 1.3rem;
}
.noto-1 span{background-color: #228b22;}
.noto-2 span{background-color: #cb2990;}

/*----------------------------------------------------
タブレット/ PC用 768- 
----------------------------------------------------*/
@media print, screen and (min-width: 768px) {

	/* ----------------------
	コンテンツ PC
	------------------------*/

	/*-- あいさつ文 PC 
	-------------------------*/
	.gree{padding:40px 0;}
	.gree h2{padding:0;}

	.gree h2 + p{padding-top:30px;}

	.gree h3 + p + p{
		padding:20px 0;
		text-align: center;
	}


	/*-------- キャンペーン pc ----------*/
	.camp-in{
		margin: 50px auto 0 auto;
		background:#fff;
	}

	.camp-ttl{flex-direction: row;}

	/* 予約不要と日程 PC */
	.camp-ttl-in{
		width: 40%;
		box-sizing: border-box;
		margin: 0 50px 0 0;
		flex-direction: row;
	}
	.camp-ttl-in p:first-child{
		width: 40%;
		margin:0;
		text-align: center;
	}
	.camp-ttl-in p:last-child{
		width: 60%;
		padding:40px 0 0 20px;
	}

	/* open と見学会 PC */
	.camp-ttl dl{
		width: 50%;
		margin:0;
		padding: 0 30px;
		box-sizing: border-box;
		border-left: 1px solid #ccc;
		border-right: 1px solid #ccc;
		text-align: left;
		flex-direction: row;
	}
	.camp-ttl dl dt{
		width: 60%;
		padding: 54px 0 0 0;
	}
	.camp-ttl dl dd{
		width: 40%;
		padding: 40px 0 0 0;
		text-align: right;
	}


	/*------- キャンペーン内容 PC ---------------*/
	.camp-ev{
		padding: 30px 0;
		flex-direction: row;
	}

	.camp-ev article{
		width: 30%;
		margin-bottom: 0;
		padding:0;
		text-align: center;
	}

	.camp-ev ol{text-align:right;}

	/* 注意と地図へ PC */
	.gomap{text-align: center;}

	/* ROOM PC
	------------------------*/
	#room{padding: 70px 0 50px 0;}

    .room-in{padding-bottom:0;}
	/* セミナー PC */
	.room-in dl{
		padding: 0px 10px 20px 10px;
		flex-direction: row;
	}

	.room-in dl dt{width: 25%;}
	.room-in dl dt span:first-child,.room-in dl dt span:nth-child(2){font-size: 36px; font-size: 3.6rem;}
	.room-in dl dt span:last-child{display: block; padding:0;}

	.room-in dl dd{
		width: 71%;
		padding: 10px 0;
	}

	.room-in dl dd p:last-child{padding: 10px;}	

	/* CUST PC
	------------------------*/
	#cust{padding: 0 0 70px 0;}

	.cust-in{
		flex-direction: row;
		padding: 0 10px;		
	}

	.cust-in ol{
		width: 30%;
		margin: 0 5% 0 0;
	}
	.cust-in ol:nth-child(3n){
		margin: 0;
	}



	/* Amenity PC
	------------------------*/
	#amenity{padding: 0 0 50px 0;}

	.ame-in{
		border-radius: 5px;
		margin-bottom: 50px;
		padding: 20px 30px 0 30px;
	}

	.ame-in ol{flex-direction: row;}

	.ame-in ol li{
		margin:0 10px 20px 10px;
		padding: 10px;
	}

	.ame-in ol li span{
		padding: 0 5px;
		font-size: 14px; font-size: 1.4rem;
	}

	#amenity dl{
		border-top: 1px solid #ddd;
		border-bottom: 1px solid #ddd;
		flex-direction: row;
	}

	#amenity dt{
		width: 18%;
		margin-bottom: 0;
		padding:30px 0; 
	} 

	#amenity dd{
		width: 82%;
		padding:10px 20px;
	}


	/* ADD PC
	---------------------------*/
	#add{flex-direction: row;}

	/*--- Access　PC ----*/
	.acc{
		width: 70%;
		padding-bottom: 0;
	}
	address{padding: 15px 10px;}
	address p:first-child span{display: inline;}

	/*--- SNS　PC ----*/
	.sns{
		width: 28%;
		padding: 0;
	}

	.sns dl a{padding: 2em 35px 6em 35px;}


	/*--- NEWS　PC ----*/
	.newsBoxIn{padding: 20px;}
	.newsBoxIn dl{flex-direction: row;}

	.newsBoxIn dl dt{width: 12%;}
	.newsBoxIn dl dt + dd{
		width: 10%;
		padding: 5px 0 0 0;
	}
	.newsBoxIn dd + dd{width: 73%; padding:0 15px;}



}


/*----------------------------------------------------
タブレット/ PC用 960- 
----------------------------------------------------*/
@media print, screen and (min-width: 960px) {

	/* ADD PC 960-
	---------------------------*/
	.sns dl a{padding: 5em 35px 7em 35px;}

	.cust-in{padding:0;}

}

/*----------------------------------------------------
タブレット/ PC用 960- 
----------------------------------------------------*/
@media print, screen and (min-width: 1080px) {

	/* ADD PC 1080-
	---------------------------*/
	.sns dl a{padding: 5em 35px 10em 35px;}

}