@charset "UTF-8";
/* CSS Document */
*{
    padding:0;
    margin:0;
    border:0;
    color: #5F5F5F;
	box-sizing:border-box;
}
img {
    max-width: 100%;
    height: auto;
	width:auto;
}
a{
	text-decoration:none;
	}

html, body{
	width:100%;
	height:100%;
	}
html{
	font-size:62.5%;
	}
body {
    font-family: "メイリオ", Meiryo, Osaka, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size:16px;
	font-size:1.6rem;
	line-height:175%;
	background:url(../img/bg.png) repeat;
}
header#header{
	width:100%;
	padding-top:10px;
	}
.section{
	padding:20px;
	width:100%;
	}
h1{
	font-size:15px;
	font-size:1.5rem;
	padding:10px 20px 5px 20px;
	font-weight:normal;
}
h2 {
	text-indent: -9999px;
	width:130px;
	height:110px;
}
#info{
	background:url(../img/title_info.png) no-repeat;
}
#menu{
	background:url(../img/title_menu.png) no-repeat;
}
#gallery{
	background:url(../img/title_gallery.png) no-repeat;
}
#calender{
	background:url(../img/title_calender.png) no-repeat;
}
#access{
	background:url(../img/title_access.png) no-repeat;
}
#about{
	background:url(../img/title_about.png) no-repeat;
}


h3 {
    font-size: 15px;
    font-size: 1.5rem;
    text-indent: 5px;
	margin-bottom:10px;
}


ol, ul { list-style:none; }

/* Clearfix */


.clearfix:after, .section:after, .columns:after, .column:after, .section:after, #mof_top_sm:before { content:''; display:table; clear:both; }

/* Plain lists */

.plain, .plain > li { list-style:none; }

.plain > li { margin:0; }


/* Columns */



.columns { width:100%; margin:40px 0; }



.column { float:left; }



.column_right { float:right; }
.column_right img{ float:right; }



.column_xlarge  { width:100%; }

.column_large   { width:70%; padding:10px; }

.column_medium  { width:30%; padding:10px; }

.column_large2   { width:60%; padding:10px; }

.column_medium2  { width:40%; padding:10px; }

.column_half   { width:50%; }


/* text */
.text_xlarge{
	font-size:24px;
	font-size:2.4rem;
	}
.text_large{
	font-size:18px;
	font-size:1.8rem;
	}
.h_tel, .m_tel,.h_tel a, .m_tel a{
	font-size:36px;
	font-size:3.6rem;
	color:#993333;
	}
.time1, .time2{
    padding-left: 20px;
    font-weight: bold;
    color: #000;
}	
.time2{
    color: #4646d3;
}	
.h_tel{
	font-family:"Arial Black", Gadget, sans-serif;
	float:right;
	margin-right:20px;
	}
.m_tel{
	line-height:200%;
	}
.h_tel:before, .m_tel:before{
	content:"TEL ";
	color:#5F5F5F;
	font-size:18px;
	font-size:1.8rem;
	}
.no_tel:before{
	content:"";
	}
.photo_text{
	float:right;
	padding:5px 0;
	text-align:right;
	}
.points{
	font-size:22px;
	font-size:2.2rem;
	color:#993333;
	}
.comment, .commentleft{
	font-size:10px;
	font-size:1.0rem;
	}
.comment{
	float:right;
	}
#calender_text{
	line-height: 200%;
	}
.a_link{
	color:#265BFF;
	text-decoration:none;
	}
.a_link:before{
	content: "";
	display: inline-block;
	border: 8px solid transparent;
	border-left-color: #265BFF;
}
.blog_text{
	font-size:32px;
	font-size:3.2rem;
	text-align:right;
	font-weight:normal;
	}
.blog_text a{
	color:#333333;
	}
#feed ul{
	border-bottom:1px dashed #74B962;
	}
#feed li{
	border-top:1px dashed #74B962;
	font-size:16px;
	font-size:1.6rem;
	}
#feed li a{
	color:#74B962;
	text-decoration:none;
	}
#feed dd{
	font-size:12px;
	font-size:1.2rem;
	line-height:125%;
	}
p#payment{
	color:#993333;
	font-size:14px;
	font-size:1.4rem;
    padding-top: 10px;
	}
footer{
	text-align:center;
	font-size:18px;
	font-size:1.8rem;
	}
/* image */

.go_top img{
	width:100px;
	margin:	40px auto 0 auto;
	}
.message_img{
	padding-left:130px;
	margin-top:-150px;
	float:right;
	}
.photo_list li, .goods_list li{
	width:23%;
	height:23%;
	float:left;
	margin:2%;
	margin-left:0;
	}
.imageplus{
	transform:rotate(5deg);
	-ms-transform: rotate(5deg);
	-moz-transform: rotate(5deg);
	-webkit-transform: rotate(5deg);
	}
.mof_info li{
	width:300px;
	height:300px;
	float:left;
	margin:10px 10px 0 0;
	}


#mof_menu div{
	margin:20px 5px 20px 0;
	background-color:#FFDFBF;
	border-radius: 10px;
    -webkit-border-radius: 10px; 
    -moz-border-radius: 10px;
	width:300px;
	height:340px;
	float:left;
	}
	
#mof_menu div img{
	width:100%;
	border-bottom:#FFF0DA 5px solid;
	}

#mof_menu ul{
	padding:20px;
	}

#mof_menu ul.nowide{
	line-height:250%;
	}

#mof_menu ul li{
	float:left;
	width:50%;
	margin:0;
	height:auto;
	text-align:left;
	}
	
#mof_menu li.wide{
	width:100%;
	}
#mof_menu ul.centerLi li{
	text-align: center;
	}
	
#price_list{
	margin:0 2%;
	width:96%;
	}
#price_list table{
	width:100%;
	padding:10px 0 20px 0;
	}

#price_list th, #price_list td{
	width:32%;
	text-align:center;
	vertical-align:middle;
	border-bottom:1px dashed #333333;
    padding: 10px 0;
	}

.pethotel{
    margin-top: 10px;
    background: url(../img/pethotel.png) no-repeat;
    padding-left: 150px;
}
p.priceMemo{
    font-size: 1.4rem;
}
#creditcard{
	margin:0 10px;
	}
#goods dt{
	background-color:#FFDFBF;
	text-align:center;
	margin:5px 0;
	font-weight:bold;
	}

#goods dd{
	text-align:center;
	font-size:14px;
	font-size:1.4rem;
	}

#access_list table{
	width:100%;
	padding:0 20px 20px 0;
	}

#access_list tr.backcolor_grey{
	background-color:#EEEEEE;
	}

#access_list th, #access_list td{
	text-align:center;
	vertical-align:middle;
	}

#access_list th{
	width:40%;
	border-right:1px dashed #333333;
	}

#access_list td{
	width:60%;
	}

.gallery_list li{
	float:left;
	width:30%;
	margin-right:5%;
	}
	
#about_list ul{
	margin:40px 30px 20px 20px;
	line-height: 300%;
	}
#about_list li{
	background-color:#EEEEEE;
	margin:20px 0;
	padding:20px;
	}	
#about_list #about_f p{
	background:url(../img/about_f.png) no-repeat;
	}	
#about_list #about_i p{
	background:url(../img/about_i.png) no-repeat;
	font-size:20px;
	font-size:2.0rem;
	}	

#about_list #about_t p{
	background:url(../img/about_t.png) no-repeat;
	font-size:20px;
	font-size:2.0rem;
	}	
#about_list #about_f p, #about_list #about_i p, #about_list #about_t p{
	padding-left:60px;
	}	

/* Menu */
.nav{
	background:url(../img/menu_bk.png) no-repeat;
	width:100%;
	height:40px;
	position:relative;
	}
.nav ul{
	 width:100%;
	 padding:0 20px;
	}
.nav li{
	float:left;
	width:120px;
	height:40px;
	margin-right:40px;
	}
.nav li a{
	display:block;
	}
.nav li span{
	visibility:hidden;
	}
#menu_info{
	background:url(../img/menu_info.png) no-repeat;
	}
#menu_menu{
	background:url(../img/menu_menu.png) no-repeat;
	}
#menu_gallery{
	background:url(../img/menu_gallery.png) no-repeat;
	}
#menu_calender{
	background:url(../img/menu_calender.png) no-repeat;
	}
#menu_access{
	background:url(../img/menu_access.png) no-repeat;
	}
#menu_about{
	background:url(../img/menu_about.png) no-repeat;
	}

#acMenu dt{
    display:block;
    width:185px;
    height:50px;
    line-height:50px;
    text-align:center;
    border:#666 1px solid;
    cursor:pointer;
    background:url(images/i_swich.png) 177px -69px no-repeat;
    padding-right:15px;
    }
#acMenu dd{
    background:#f2f2f2;
    width:200px;
    height:50px;
    line-height:50px;
    text-align:center;
    border:#666 1px solid;
    display:none;
    }
#acMenu dt.active{
    background:url(images/i_swich.png) 177px 18px no-repeat;
    }
	

#frame{
	background-color:#FFFFFA;
	position:relative;
	margin:0 auto;
	}
.section{
	width:100%;
	margin:10px auto;
	}
.secondcolor{
	background-color:#FFF0DA;
	}


#mof_top_sm{
	clear:left;
	}

#mof_top_sm nav{
	background:rgba(0,0,0,0.1);
	}

#mof_top_sm .toggle{
	float:right;
	background:url(../img/menu_sicon.png) no-repeat;
	background-size:100% auto;
	-moz-background-size:100% auto;
	width:50px;
	height:41px;
	text-indent:-9999px;
	top:10px;
	position:absolute;
	right:10px;
	}

#mof_top_sm ul.accordion ul {
    display:none;
}

#mof_top_sm ul.accordion ul li{
	border-bottom:1px dashed #333333;
	padding-left:40px;
	font-size:26px;
	font-size:2.6rem;
	line-height:225%;
}

/*===============================================
●style.css 画面の横幅が960px以上
===============================================*/
@media screen and (min-width: 960px){
	#frame{
		width: 960px;
		box-shadow: 0 0 8px rgba(0,0,0,0.3);
		-webkit-box-shadow:0 0 8px rgba(0,0,0,0.3);
		-moz-box-shadow:0 0 8px rgba(0,0,0,0.3);
	}
	.h_tel{
		margin-top:-45px;
	}
}
/*===============================================
●tablet.css 画面の横幅が959pxまで
===============================================*/
@media screen and (max-width: 959px){
	html{
		font-size:60%;
	}
	#frame{
		width: 100%;
	}
	.nav{
		background:url(../img/menu_bk.png) no-repeat top;
		background-size: 100% auto;
		-moz-background-size: 100% auto;
		width:100%;
		position:relative;
	}
	.nav li{
		width:15%;
		bottom:0;
		margin-right:2%;
	}
	#menu_info, #menu_menu, #menu_gallery, #menu_calender, #menu_access, #menu_about{
		background-position:top;
		background-size: 100% auto;
		-moz-background-size: 100% auto;
		width:15%;
	}
	
	#mof_menu div{
		margin-right:2%;
		width:32%;
		height:300px;
		float:left;
	}
			
}

@media screen and (min-width: 641px){
	#mof_top_sm, #gallery_sm{
		display:none;
		}
}
@media screen and (max-width: 959px) and (min-width: 641px){	
	h1{
		text-align:right;
		padding-right:0;
		margin-right:20px;
		}
	.mof_info li{
		width:32%;
		height:auto;
		margin:2% 2% 0 0;
	}
	.m_tel, .m_tel a{
		font-size:28px;
		font-size:2.8rem;
	}
	#mof_menu ul{
		padding:30px 20px;
		font-size:12px;
		font-size:1.2rem;
	}
	
	#mof_menu ul.nowide{
		padding-top:75px;
	}
}

/*===============================================
●smart.css  画面の横幅が640pxまで
===============================================*/
@media screen and (max-width:640px){
	html{
		font-size:50%;
	}
	.column_large, .column_medium, .column_large2, .column_medium2, .column_half{ width:100%; }
	
	.column_right { float:left; }
	
	#mof_top{
		display:none;
		}
	.mof_info li{
		width:100%;
		height:auto;
		margin:0 0 10px 0;
	}
	.message_img{
		margin-top:0;
		padding-left:0;
	}
	#calender_text{
		line-height: 180%;
	}
	.h_tel{
		display:none;
	}
	h1{
		margin-right:65px;
		height:50px;
		bottom:0;
		padding:0 0 0 10px;
		}
	#mof_menu div{
		margin:20px 0;
		width:100%;
		height:auto;
		padding-bottom:20px;
	}
	#mof_menu ul{
		padding:20px;
	}
	#mof_menu ul.nowide{
		padding-top:20px;
	}
	#price_list th.dogs, #price_list td.dogs{
		text-align:left;
		padding-left:5px;
		}

	.goods_list li{
		width:100%;
		height:auto;
		float:left;
	}
	#access_list table{
		padding-right:0;
	}
}