@charset "utf-8";

/*********************************************************************
CARESIS PARK
For iPhone & Smartphone
*********************************************************************/

/* BASE --------------------------------------------------------*/

body{
	padding: 0;
	width: 100%;
	-webkit-text-size-adjust: none;
	line-height: 1.5;
	font-size: 90%;
	font-family:  ArialMT, Verdana, "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3";
}

.sml1{ line-height: 1.5;}
.sml2{ line-height: 1.4;}

.img_r{ margin: 0 0 15px; float: none;}
.img_l{ margin: 0 0 15px; float: none;}
.f_l, .f_r{ float: none;}

img.f_l{ margin: 0 10px 10px 0; float: left; max-width: 40%;}
img.f_r{ margin: 0 0 10px 10px; float: right; max-width: 40%;}

.w195, .w205, .w235, .w240{ width: 48%;} 
.w50p, .w280, .w370, .w375, .w390, .w415, .w420,
.w470, .w530, .w550, .w630, .w660{ width: 100%;}

img.f_l, img.f_r{ margin: 0 0 15px;}

map{ display: none;}

.pcdsp{ display: none;}
.sphdsp{ display: inline;}

/* LAYOUT --------------------------------------------------------*/

#container{ background: none;}

#wrap{
	margin: 0;
	padding: 0;
	width: 100%;
}
.inner{
	width: auto;
	max-width: 100%;
}
header{
	margin: 0;
	width: 100%;
	height: auto;
}
#center{
	float: none;
	width: 100%;
}
#left{
	float: none;
	width: auto;
	text-align: center;
	font-size: 110%;
}
footer{
	padding: 20px 0 0;
	max-width: 100%;
	min-width: 100%;
	text-align: center;
}

/* TITLES --------------------------------------------------------*/

h1{
	margin: 0 0 20px;
	padding: 30px 1%;
	background: url(common/h1.png) repeat-x 0 50%;
	height: 50px;
}
h1 img{ max-width: 98%;}
hgroup{
	margin: 5px -10px 10px;
	padding: 0;
}
h2{
	margin: -15px 0;
	padding: 20px 2% 0;
	max-width: 96%;
	background: #fff url(common/ic_leaf_s.png) no-repeat 50% 0;
	font-size: 20px;
	font-weight: bold;
}
h3{
	margin: 0 0 0.5em;
	background-position: 0 4px;
	font-weight: bold;
	font-size: 15px;
}
h4{	background-position: 0 5px;}
h4 span{ font-weight: bold;}

/* Header --------------------------------------------------------------------------------------------*/

#description{
	height: 30px;
	overflow: hidden;
	font-size: 12px;
}

/* Articles --------------------------------------------------------------------------------------------*/

section{ padding: 20px 10px;}

section p{ margin: 0 0 0.5em;}

/* column */

.column0, .column1, .column2, .column3{ margin: 0 10px 10px; padding: 1em;}

.dl2 dl{ padding: 0; background-position: 0 5px;}
.dl2 dl dt{ margin: 0.45em 0 0; float: none; width: 100%; line-height: 1.5;}
.dl2 dl dd{ margin: 0 0 0.45em; float: none; width: 100%; line-height: 1.5;}

/* ul, ol */

section ul{ margin: 0 0 1em; padding: 0 0 0 1.5em;}
section ol{ margin: 0 0 1em; padding: 0 0 0 1.5em;}
section ul.dot li{ background-position: 0 5px;}

/* Tables **********/

th, td{
	padding: 0.2em 0.35em;
	word-break: break-all;
	width: auto;
	font-size: 80%;
}
.tbl_1 th{ white-space: normal;}

/* Forms ***********/

#contact .mg30lr{ margin: 0;}

#form_contact .Dlist{ margin: 0 0 10px;}

#form_contact .dl2 dl dt{ margin: 0.25em 0; width: 100%;}
#form_contact .dl2 dl dd{ margin: 0.25em 0; width: 100%;}

#form_contact .dl2 dl dd textarea{ max-width: 95%;}
#form_contact .dl2 dl dd input{ max-width: 200px;}

/* Entries etc ***********/

#center article th,
#center article td{ width: auto !important;}

.news_index #center article:first-of-type{ min-height: 250px;}

.alignright,.alignleft, .aligncenter{ margin: 0 0 15px; float: none;}
.notfound{ font-size: 100px;}

/* iframe ***********/

iframe{ height: 250px;}

/* Index ||||||||||||||||||||||||*/

#index h1{
	margin: 0;
	padding: 10px 1%;
	background: url(index/h1.png) repeat-x 0 50%;
	height: auto;
	overflow: hidden;
}
h1 span{
	display: inherit;
	width: auto;
}

/* Banner **********/

#index #banner_staff{ display: none;}

/* index_fee **********/

#index_fee{ margin: 20px 10px;}
#index_fee img{
	margin: 0;
	float: none;
}
#index_fee .f_r{
	margin: 0 10px 10px;
	width: auto;
}
#index_fee .dl2 dl dt{
	width: 100%;
	font-size: 14px;
}
#index_fee .dl2 dl dd{
	width: 100%;
	font-size: 14px;
}
#index_fee li{
	padding: 0 14px;
	display: inherit;
	float: none;
	width: auto;
}
#index_fee li:first-child{ padding: 0 0 0 14px;}

/* topics **********/

#topics .dl2{ margin: 0;}
#topics .dl2 dl dt, #topics .dl2 dl dd{ width: 100%;}
#topics .btns{ display: none;}

/* about **********/

#about .mg30t{ margin: 0;}
#about .read{ line-height: 1.6; font-size: 100%;}
#about img{ margin: 10px 0 0;}

/* torikumi3 **********/

#torikumi3 h2 .sml2{ display: none;}
#torikumi3 li{
	float: none;
	width: auto;
}
#torikumi3 li:first-child{ margin: 0;}
#torikumi3 li:last-child{ float: none;}
#torikumi3 li p{ margin: 0 0 1em;}
#torikumi3 h3{
	text-align: left;
	font-size: 110%;
}
#torikumi3 h3 span{
	padding: 0 0 0 10px;
	background: url(common/dot_s_1.png) no-repeat 0 50%;
}

/* facility ||||||||||||||||||||||||*/

body[id^="facility"] article{ padding: 0 0 20px;}

body[id^="facility"] .dl2 dl{ padding: 0 0 20px;}
body[id^="facility"] .dl2 dl dt,
body[id^="facility"] .dl2 dl dd{ width: 100%; text-align: center;}
body[id^="facility"] .dl2 dl dt img{ max-width: 50%;}

body[id^="facility"] #photo p{ line-height: 1.5; font-size: 90%;}

body[id^="facility"] #photo ul.clrfx li{ width: 100%;}
body[id^="facility"] #photo #photo_living ul.clrfx li{ width: 49%;}
body[id^="facility"] #photo #photo_living ul.clrfx{ margin: 10px 0 0;}
body[id^="facility"] #photo #photo_living ul.clrfx li:nth-child(odd){ margin: 0 0 10px;}
body[id^="facility"] #photo #photo_living ul.clrfx li:nth-child(even){ float: right;}
body[id^="facility"] #photo #photo_bath .w375{ margin: 0 0 10px;}
body[id^="facility"] #photo #photo_bath .w240{ width: 49%; float: left;}
body[id^="facility"] #photo #photo_bath .w205{ width: 49%; float: right;}
body[id^="facility"] #photo #photo_toilet .w415{ margin: 0 0 10px;}
body[id^="facility"] #photo #photo_private .w390 img{ margin: 0;}
body[id^="facility"] #photo #photo_private .w195{ width: 49%; float: left;}
body[id^="facility"] #photo #photo_private .w235{ width: 49%; float: right;}

/* service ||||||||||||||||||||||||*/

body[id^="service"] #all .dl2 dt{ width: 100%; line-height: 1.8;}
body[id^="service"] #all .dl2 dl:first-child{ display: none;}

body[id^="service"] #option td:nth-child(1){ width: 30%;}
body[id^="service"] #option td:nth-child(2){ white-space: nowrap;}
body[id^="service"] #option td:nth-child(3){ width: 55%;}

body[id^="service"] #option .f_l table td:nth-child(1),
body[id^="service"] #option .f_l table td:nth-child(2){ white-space: normal;}

/* guide ||||||||||||||||||||||||*/

body[id^="guide"] #fee td:nth-child(1),
body[id^="guide"] #fee td:nth-child(3){ width: auto;}
body[id^="guide"] #fee td:nth-child(2){ white-space: nowrap;}

body[id^="guide"] #fee tr:nth-child(n+6) td:nth-child(1){ padding: 0.2em 0.35em;}

/* flow ||||||||||||||||||||||||*/

.flow_nyukyo dl{ background: none;}
.flow_nyukyo dl dt{
	margin: 0;
	padding: 0.3em 2% 0;
	float: none;
	width: 96%;
}
.flow_nyukyo dl dt span{ font-size: 150%;}
.flow_nyukyo dl dd{
	margin: 0 0 1em;
	padding: 0.5em 0;
	float: none;
	width: 100%;
	border-top: none;
	border-bottom: dotted 1px #ccc;
}

/* rooms ||||||||||||||||||||||||*/

body[id^="rooms"] article{
	width: auto;
	float: none;
}
body[id^="rooms"] article:last-child{ float: none;}

/* Footer --------------------------------------------------------*/

#f_content{
	 margin: 0 10px;
	 float: none;
	 width: auto;
}
#copy br{ display: inherit;}

/* NAVIGATION --------------------------------------------------------------------------------------------*/

/* Logo **********************************/

#logo{
	margin: 10px auto;
	padding: 0 5%;
}
#logo img{ max-width: 90%;}

/* Global Navi **********************************/

#g_navi{
	padding: 0;
	height: 160px;
	background: url(common/g_navi_sph.png) 0 0;
}
#g_navi li{
	padding: 10px 0;
	width: 50%;
}
#g_navi li:first-child{ width: 100%;}
#g_navi a{
	padding: 0;
	border: none;
	font-size: 15px;
	font-weight: bold;
}
#g_navi li:first-child a{ border: none;}
#g_navi li:nth-child(even) a{ border-right: solid 1px #c6af74;}

/* Top Navi **********************************/

.t_navi{
	margin: 0 0 5px;
	height: auto;
	text-align: center;
}
.t_navi li{
	margin: 0 10px 0 0;
	display: inline;
	float: none;
	line-height: 1.5;
	text-align: center;
	font-size: 12px;
	font-weight: bold;
}
header .t_navi{
	position: inherit;
	top: auto;
	left: auto;
}
footer .t_navi{
	margin: 20px 10px;
	float: none;
	width: auto;
}

/* tel_no ****************/

header .tel_no{ display: none;}
footer .tel_no .no{ line-height: 1.1;}

/* LEFT navigation ---------------------------------------------*/

#left ul{ text-align: left;}
#left a{ padding: 0.7em 15px 0.7em 10px; width: auto;}

#left li, #left li.nolink{ width: 100%;}
#left li.s, #left ul ul li{
	font-size: 12.5px;
	font-weight: bold;
}
#left a,
#left li.s a,
#left ul ul li a,
#left a:hover,
#left li.s a:hover,
#left ul ul li a:hover{
	background-position: 95% center;
}
/* CONTENT BTNS -----------------------------------------------------------------------------*/

/* anchor ***************************/

#anchor{ padding: 0;}
#anchor li, #anchor li a{ display: block;}
#anchor li a{
	padding: 0.3em 0 0.3em 32px;
	border-right: 0;
	border-bottom: dotted 1px #ccc;
	font-weight: bold;
	font-size: 110%;
}
#anchor li:first-child a{ margin: 0;}
#anchor li:last-child a{ border-bottom: none;}

/* li float navi **********************************/

.li_fl3, .li_fl4{
	margin: 0;
}
.li_fl3 li, .li_fl4 li{
	margin: 0;
	float: none;
	width: auto;
}

/* Footer --------------------------------------------------------------------------------------------*/

/* BTN Pagetop(ID) ****************/

#pagetop{
	padding: 0 10px;
	width: auto;
	max-width: 100%;
	font-weight: bold;
}
#pagetop a{ float: right;}

/* Footer Navi ****************/

#f_content .btn{ margin: 0 auto;}

#f_navi{
	float: none;
	width: auto;
}
#f_navi ul{
	margin: 0;
	float: none;
	width: 100%;
}
#f_navi ul:last-child{ margin: 0;}
#f_navi ul li a{
	padding: 0 10px 0 30px;
	border-bottom: solid 1px #009844;
	background-position: 10px 50%;
	text-align: left;
	font-size: 17px;
}
#f_navi ul ul li a{
	margin: 0;
	padding: 0 10px 0 35px;
	background-position: 20px 50%;
	font-size: 15px;
	font-weight: bold;
}
