@charset "utf-8";
/*
	
theme Name: HMIホームページリニューアル
	
Author: 八木
	
Description: original theme
	
version： 1.0.0
	
*/

.crownpalais {}
.creston {}
.pearlcity {}
.resort {}
.ryokan {}
wellness {
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#009a53+0,00160c+100 */
	background: #009a53; /* Old browsers */
	background: -moz-linear-gradient(top,  #009a53 0%, #00160c 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #009a53 0%,#00160c 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #009a53 0%,#00160c 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#009a53', endColorstr='#00160c',GradientType=0 ); /* IE6-9 */
	}
	
.top-wellness {}

body { line-height: 25px;}

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

h1 { font-size: 180%;}
h2 { font-size: 90%;}
h3 { font-weight:bold; margin-bottom: 3%;}
h3:hover { color: #0071be;}

.cp #rogo , .cr #rogo {
	width:50%;
	margin: 0 auto;
	padding: 20px 0 0 ;
	}

.re #rogo {
	width:40%;
	margin: 0 auto;
	padding: 20px 0 0 ;
	}
	
.ry #rogo , .pc #rogo , .we #rogo {
	width:30%;
	margin: 0 auto;
	padding: 20px 0 0 ;
	}
	

#main {
	max-width: 1500px;
	margin: 0 auto;
	line-height:27px;
	color:#fff;
	background-size:cover;
	}

.cp #main { background: url("../img/list/main-cp.jpg") }

.cr #main { background: url("../img/list/main-cr.jpg") }

.pc #main { background: url("../img/list/main-pc.jpg") }

.ry #main { background: url("../img/list/main-ry.jpg") }

.re #main { background: url("../img/list/main-re.jpg") }

.we #main { background: url("../img/list/main-we.jpg") }

#main dl {
	padding: 0 5% 5% 5%;
	margin: 0 auto;
	}
	
#main dl dt {
	font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
	margin-bottom: 10px;
	line-height:30px;
	}
	
#main dl dd {
	font-size: 15px;
	}

#main dl dd ul {
	margin: 7% 0 2% ;
	}
	
#main dl dd ul li {
	float:left;
	margin: 0 5px 5px;
	padding-right: 10px;
	border-right: 1px #999 solid;
	font-size: 80%;
	}

.conA .container {
	margin: 0 3%;
	padding-top: 3%;
	}

.item { flex:1;}

.list {
	display:flex;
	flex-direction: column;
	margin-bottom: 3%;
	font-size: 95%;
	line-height: 140%;
	background-color:#fff;
	border: #CCC 1px solid;
	}

.item dl.text { padding: 4%;}
.item dl.text dt{
	font-size: 110%;
	padding:0 0 2%;
}
.address {
	display: flex;
	flex-direction: column;
	margin-top: auto;
	padding: 4%;
	}
	
.contTel { margin: 2% 0 0 ;}
	
.contTel dt, .contTel dd {
	float:left;
	margin-right: 2%;
	}
	
.icon{
	clear:both;
	display:flex;
	}
	
.icon div { margin: 30px auto 0; border:#CCC 1px solid; padding: 5%;}
.icon div a { color:#333;}
.icon div:hover { background-color:#eee;}
	
.icon img{ width: 100%;}

.icon a	{ text-decoration:none;}
	
.url, .inquiry {
	flex: 0 0 49%;
	text-align:center;
	}
	
.url p, .inquiry p {
	line-height: 13px;
	font-size: 80%;
	color:#666;
	}
	

@media (min-width: 620px) {

.conA .container {
	width:98%;
	display:flex;
	flex-direction: row;
	flex-wrap :wrap;
	margin: 0 auto;
	padding-top: 2%;
	}
	
.item {
	flex: 0 0 48%;
	margin: 0 1% 2%;
	}
	
}

 @media screen and (min-width : 767px) {

.cp #rogo , .cr #rogo {
	width:300px;
	margin: 0 0 0;
	padding: 20px 0 10px 5%;
	}

.re #rogo {
	width:280px;
	margin: 0 0 0;
	padding: 20px 0 10px 5%;
	}
	
.ry #rogo , .pc #rogo , .we #rogo{
	width:220px;
	margin: 0 0 0;
	padding: 20px 0 10px 5%;
	}
}

@media (min-width: 1000px) {
	
.item { flex: 0 0 31.3%;}

}

@media (min-width: 1300px) {

.item { flex: 0 0 24%; margin: 0 0.5% 1%}

}

@media (min-width: 1500px) {
	
.conA .container { width:100%; max-width:1500px;}

}