@charset "utf-8";
/*
Theme Name: My theme
Description: オリジナルテーマ
Version: 1.0
*/


/* ▼PC用のスタイル */
*{margin:0;padding:0;}

html{background:#ffffff;}

body{
	font: 14px/1.7 "メイリオ","Meiryo",arial,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",Sans-Serif;
	color:#252525;
	background-color: #cbe6f3;

}

a{color:#1cb8e0;}
a:hover{color:#66759c;text-decoration:none;}
a:active, a:focus {outline: 0;}
img{border:0;}
p{
	margin-bottom: 20px;
	margin-right: 10px;
	margin-left: 10px;
}
.red{
	color: #da6272;
	}


#header, #container{
	margin: 0 auto;
	width: 960px;
	padding-right: 10px;
	padding-left: 10px;
}


#header{
	position:relative;
	height: 150px;
	background-image: url(http://www.hula-girl.jp/images/header.png);
	background-repeat: repeat-x;	
}

#header h1, #header img{
font-weight:normal;
position:absolute;
top:0;
color: #333;
font-size: 10px;
line-height: 21px;
}


#header img{top: 30px;}

#guide{
	position: absolute;
	height: 150px;
	width: 170px;
	left: 988px;
	top: 36px;
	}


#container{
	padding: 20px 10px;
	background-color: #FFF;
}

#main {
float: left;
width: 715px;
padding-bottom:40px;
}

#sidebar {
float: right;
width: 225px;
padding-bottom:40px;
font-size:14px;
}


#sidebar .box1{
width:209px;
margin: 0 0 20px;
padding: 10px 7px;
border:1px solid #dadada;
background: #fff;
}

table{
	width: 600px;
	margin-bottom: 20px;
	border-collapse: collapse;
	font-size: 14px;
	margin-left: 10px;
	}
th{
	padding: 5px 5px;
	border: 1px solid #59bae3;
	}
td{
	padding: 10px 5px;
	border: 1px solid #59bae3;
	}

#next {
text-align: center;
padding-top: 30px;
padding-bottom: 30px;
}
#next a:hover{
	position: relative;
	left: 1px;
	top: 1px;
}



#container h3{
	margin-bottom:10px;
	color: #252525;
	font-weight: normal;
	border-bottom: 1px solid #dddddd;
	margin-right: 10px;
	margin-left: 10px;
font-size: 15px;	
}

#container h2{
padding: 0 5px 0 24px;
margin-bottom:10px;
line-height:37px;
font-size: 15px;
font-weight: normal;
color:#252525;
background:url(http://www.hula-girl.jp/images/h2bg.png) no-repeat 0 100%;
}



#sidebar ul{margin-left:3px;}
#sidebar ul li{
	list-style: none;
margin-bottom: 20px;
padding: 0 5px 0 12px;
background:url(http://www.hula-girl.jp/images/bullet.gif) no-repeat 0 5px;
}

#sidebar ul li ul {padding-top:10px;}
#sidebar ul li ul li{

	margin-bottom: 10px;
}





#footer{
clear:both;
padding: 10px;
text-align:center;
border-top:1px solid #7e7e7e;
background:#5d5d5d;
}

address{
color: #fff;
font-style:normal;
font-size:13px;
}
address a:hover{
color: #fff;
font-style:normal;
font-size:13px;
}
/* ▲PC用のスタイル */




/* ▼スマホ用のスタイル */
@media screen and (max-width: 640px) {
	body {
		width: 100%;
	}

	* {
		float: none;
		word-break: break-all;
	}

	#guide{
		width: 30px;
		height: auto;
		left: 10px;
		top: 160px;
		visibility:hidden;
	}

	#guide img{
		width: 30px;
		height: auto;
		visibility:hidden;
	}

	#header, 
	#container,
	#main,
	#sidebar,
	#sidebar .box1,
	table {
		width: 100%;
		box-sizing: border-box;
	}

	#header img{
		width:100%;
		height:auto;
		padding:0px;
		position: static;
		margin-top: 30px;
	}

	#header{
		position: relative;
	}

	#container h2{
		background-size: cover;
		line-height: 25px;
	}
	
	table{
		margin-left: 0px;
	}
}
/* ▲スマホ用のスタイル */