@charset "utf-8";

/* スマートフォン 横(ランドスケープ) */
@media only screen and (max-width:640px){

.box,
.box_letter{
	margin-bottom:0em !important;
}

.box li,
.box_letter li{
	margin-bottom:0em !important;
}

.box_letter li{
	border:none !important;
	border-radius:10px;
	padding:1% !important;
	display:block !important;
	overflow:hidden !important;
}

.box_letter .p_l,
.box_letter .p_r{
display: inline !important;
text-align:left !important;
font-size:100% !important;
font-weight:normal !important;
margin:0 !important;
overflow:hidden !important;
}

.box_letter .p_l{
	float:left !important;
	width:48% !important;
	margin-right:2% !important;
}

.box_letter .p_r{
	float:right !important;
	width:50% !important;
	padding:0 !important;
font-size:95% !important;
}

.rate_ttl {
	width:100% !important;
	color: #e15f00 !important;
	margin: 0 0 0.5em !important;
	line-height: 1.2 !important;
display:block !important;
overflow:hidden !important;
}

.mt1em{
	margin-top:1em !important;
}

.rate_sub{
	width:100% !important;
font-size:95% !important;
color: #666 !important;
display:block !important;
overflow:hidden !important;
}

.box_letter hr{
height: 1px !important;
background-color:#ddd !important;
border:none !important;
clear:both;
}



.star-rating{
    color: transparent !important;
    background-image: linear-gradient(orange, orange), linear-gradient(gray, gray) !important;
    background-position: left, right !important;
    background-repeat: no-repeat !important;
    background-size: var(--rate) 100%, calc(100% - var(--rate)) 100% !important;
    background-clip: text !important;
    -webkit-background-clip: text !important;
	margin: 0 !important;
	line-height: 1.8 !important;
	float:right !important;
	text-align:right !important;
display:block !important;
overflow:hidden !important;
}
.star-rating:before{
    content: "★★★★★" !important;
}

.star-rating span{
	color: #0CF !important;
	font-weight:bold !important;
	padding-left:0.5em !important;
}

.voice_article article{
padding:0px !important;
margin-bottom:10px !important;
background:#fff;
overflow:hidden;
}



ul.box{
display:block;
table-layout:none;
clear:both;
margin:0px auto 0 !important;
}


ul.box li{
display:block;
}

address{
padding:5px 5px 70px;
}






#pankuzu{
margin:5px auto 10px;
padding:0 0 5px 20px;
width:100%;
font-size:60%;
border-bottom:1px dashed #0862AA;
}

/*************
/* TOPページフォーム
*************/
#mainBanner_area{
width:100%;
height:auto;
position:relative;
margin:0 auto 20px;
padding:0px;
line-height:0;
}

#mainBanner_area img{
max-width:100%;
height:auto;
border:0 solid #0862aa;
}

.flexslider_2{
width:100%;
height:auto;
margin:0 auto;
padding:0;
background:#e3f3fa;

background-color:none;

-moz-background-size:100% auto;
background-size:100% auto;
}

.form_wrap{
width:98%;/* important */
height:auto;/* important */
margin:1% auto 10px;
padding:0;

background:url(../img/top/form_bg.png) repeat left top;

border-radius: 10px;/* CSS3草案 */
-webkit-border-radius: 10px;/* Safari,Google Chrome用 */
-moz-border-radius: 10px;/* Firefox用 */

-moz-box-shadow: 0 0 10px #000;
-webkit-box-shadow: 0 0 10px #000;
}

.form_area{
width:auto;/* important */
height:auto;/* important */
margin:0;
padding:0 0 5px;
background:url(../img/top/form_bg.png) no-repeat left center;
}

.table_wrap{
width:100%;
height:auto;
margin:0 auto;
padding:0 0 ;
background-image:none;
}

input.btn_submit01, input.btn_submit02 {
display:none;
}

input.btn_submit01_sp, input.btn_submit02_sp, input.btn_submit_mini_sp {
cursor: pointer;
display: block;
margin:0 auto;
padding:10px;
border: 2px solid #0862AA;
background-color:#fff;
border-radius: 10px;/* CSS3草案 */
-webkit-border-radius: 10px;/* Safari,Google Chrome用 */
-moz-border-radius: 10px;/* Firefox用 */
}

input.btn_submit01_sp:hover, input.btn_submit02_sp:hover, input.btn_submit_mini_sp:hover {
opacity:0.6;
filter:alpha(opacity=60);
}

/**************************
/* TOPページForm 1ページ目
**************************/

table.top_form01{
width:100%;
height:auto;
font-size: 80%;
margin:5px 0 0;
border:5px solid #fff;
border-collapse:collapse;
border-spacing:0;
}

table.top_form01 th{
font-weight:bold;
padding:15px 5px;
font-size: 11px;
color:#fff;
background-color:#0862AA;
vertical-align:middle;
text-align:center;
border-radius: 0;/* CSS3草案 */
-webkit-border-radius: 0;/* Safari,Google Chrome用 */
-moz-border-radius: 0;/* Firefox用 */
}

table.top_form01 td{
padding:5px 0;
font-size: 11px;
text-align:center;
}

table.top_form01 td img{
width:auto;
}

table.top_submit01{
width:100%;
height:auto;
border:5px solid #fff;
border-collapse:collapse;
border-spacing:0;
margin:5px 0 0;
text-align:center;
}

table.top_submit01 th{
font-weight:bold;
padding:0;
text-align:center;
}

table.top_submit01 td{
padding:0 0;
text-align:center;
}

table.top_form01 img{
margin:0 0 5px;
}

table.top_form01 input{
border: 1px solid #999;
margin:0 0 5px;
padding:3px;
text-align:center;
font-size: 13px;
}

table.top_form01 select.city, table.top_form01 select.pref{
border: 1px solid #999;
margin:0 0 5px;
padding:3px;
text-align:center;
}

input.text_zip21 {
width: 30%;
}

input.text_zip22 {
width: 40%;
}

select.pref, select.city {
width: 90%;
}


input#datepicker {
width:90%;
}

/*************
/* .area_form_wrap TOPページフォーム
*************/
.area_form_wrap #mainBanner_area{
width:100%;
height:auto;
position:relative;
margin:0 auto 20px;
padding:0px;
line-height:0;
}

.area_form_wrap #mainBanner_area img{
max-width:100%;
height:auto;
border:0 solid #0862aa;
}

.area_form_wrap .flexslider_2{
width:100%;
height:auto;
margin:0 auto;
padding:0;
background:#e3f3fa;

background-color:none;

-moz-background-size:100% auto;
background-size:100% auto;
}

.area_form_wrap .form_wrap{
width:98%;/* important */
height:auto;/* important */
margin:1% auto 10px;
padding:0;

background:url(../img/top/form_bg.png) repeat left top;

border-radius: 10px;/* CSS3草案 */
-webkit-border-radius: 10px;/* Safari,Google Chrome用 */
-moz-border-radius: 10px;/* Firefox用 */

-moz-box-shadow: 0 0 10px #000;
-webkit-box-shadow: 0 0 10px #000;
}

.area_form_wrap .form_area{
width:auto;/* important */
height:auto;/* important */
margin:0;
padding:0 0 5px;
background:url(../img/top/form_bg.png) no-repeat left center;
}

.area_form_wrap .table_wrap{
width:100%;
height:auto;
margin:0 auto;
padding:0 0 ;
background-image:none;
}

.area_form_wrap input.btn_submit01, input.btn_submit02 {
display:none;
}

.area_form_wrap input.btn_submit01_sp, input.btn_submit02_sp, input.btn_submit_mini_sp {
cursor: pointer;
display: block;
margin:0 auto;
padding:10px;
border: 2px solid #0862AA;
background-color:#fff;
border-radius: 10px;/* CSS3草案 */
-webkit-border-radius: 10px;/* Safari,Google Chrome用 */
-moz-border-radius: 10px;/* Firefox用 */
}

.area_form_wrap input.btn_submit01_sp:hover, input.btn_submit02_sp:hover, input.btn_submit_mini_sp:hover {
opacity:0.6;
filter:alpha(opacity=60);
}

/**************************
/* .area_form_wrap TOPページForm 1ページ目
**************************/

.area_form_wrap table.top_form01{
width:100%;
height:auto;
font-size: 80%;
margin:5px 0 0;
border:5px solid #fff;
border-collapse:collapse;
border-spacing:0;
}

.area_form_wrap table.top_form01 th{
font-weight:bold;
padding:15px 5px;
font-size: 11px;
color:#fff;
background-color:#0862AA;
vertical-align:middle;
text-align:center;
border-radius: 0;/* CSS3草案 */
-webkit-border-radius: 0;/* Safari,Google Chrome用 */
-moz-border-radius: 0;/* Firefox用 */
}

.area_form_wrap table.top_form01 td{
padding:5px 0;
font-size: 11px;
text-align:center;
}

.area_form_wrap table.top_form01 td img{
width:auto;
}

.area_form_wrap table.top_submit01{
width:100%;
height:auto;
border:5px solid #fff;
border-collapse:collapse;
border-spacing:0;
margin:5px 0 0;
text-align:center;
}

.area_form_wrap table.top_submit01 th{
font-weight:bold;
padding:0;
text-align:center;
}

.area_form_wrap table.top_submit01 td{
padding:0 0;
text-align:center;
}

.area_form_wrap table.top_form01 img{
margin:0 0 5px;
}

.area_form_wrap table.top_form01 input{
border: 1px solid #999;
margin:0 0 5px;
padding:3px;
text-align:center;
font-size: 13px;
}

.area_form_wrap table.top_form01 select.city, table.top_form01 select.pref{
border: 1px solid #999;
margin:0 0 5px;
padding:3px;
text-align:center;
}

.area_form_wrap input.text_zip21 {
width: 30%;
}

.area_form_wrap input.text_zip22 {
width: 40%;
}

.area_form_wrap select.pref, select.city {
width: 90%;
}


.area_form_wrap input#datepicker {
width:90%;
}

/**************************
/* TOPページForm 2ページ目
**************************/

table.top_form02{
width:100%;
height:auto;
font-size: 80%;
margin:5px 0 0;
border:5px solid #fff;
border-collapse:collapse;
border-spacing:0;
}

table.top_form02 th{
font-weight:bold;
padding:15px 5px;
font-size: 11px;
color:#fff;
background-color:#0862AA;
vertical-align:middle;
text-align:center;
border-radius: 0;/* CSS3草案 */
-webkit-border-radius: 0;/* Safari,Google Chrome用 */
-moz-border-radius: 0;/* Firefox用 */
}

table.top_form02 td{
margin:0 0 5px;
padding:5px 0;
font-size: 11px;
text-align:center;
}

table.top_submit02{
width:100%;
height:auto;
border:5px solid #fff;
border-collapse:collapse;
border-spacing:0;
margin:5px 0 0;
text-align:center;
}

table.top_submit02 th{
font-weight:bold;
padding:0;
text-align:center;
}

table.top_submit02 td{
padding:0 0;
text-align:center;
}

table.top_form02 input{
border: 1px solid #999;
margin:0 0 5px;
padding:3px;
text-align:center;
font-size: 13px;
}

input.text_name1, input.text_name2, input.text_kana1, input.text_kana2 {
width: 40%;
}

input.text_mail {
width: 90%;
}

input.text_tel1 {
width: 20%;
}

input.text_tel2, input.text_tel3 {
width: 30%;
}

/**************************
/* TOPページForm 3ページ目
**************************/

table.top_form03{
width:100%;
height:auto;
font-size: 80%;
margin:5px 0 0;
border:5px solid #fff;
border-collapse:collapse;
border-spacing:0;
}

table.top_form03 th{
width:30%;
font-size: 11px;
font-weight:bold;
padding:10px 2px;
color:#fff;
background-color:#0862AA;
vertical-align:middle;
text-align:center;
border:1px solid #fff;
border-radius: 0;/* CSS3草案 */
-webkit-border-radius: 0;/* Safari,Google Chrome用 */
-moz-border-radius: 0;/* Firefox用 */
}

table.top_form03 td{
width:65%;
font-size: 11px;
margin:0 0 5px;
padding:10px 0;
border:1px solid #fff;
text-align:center;
}

/**************************
/* TOPページForm サンクスページ
**************************/

table.form_thanks{
width:100%;
height:auto;
font-size: 15px;
border-collapse:collapse;
border-spacing:0;
margin:10px auto;
border-collapse: separate;
border-spacing:2px;
clear:both;
}

table.form_thanks th{
width:100%;
height:auto;
line-height:1.2;
font-weight:bold;
margin:2px;
padding:20px 10px;
color:#fff;
background-color:#0862AA;
vertical-align:middle;
text-align:center;
border-radius: 5px;/* CSS3草案 */
-webkit-border-radius: 5px;/* Safari,Google Chrome用 */
-moz-border-radius: 5px;/* Firefox用 */
}

table.form_thanks td{
width:100%;
height:auto;
line-height:1.2;
font-size: 13px;
padding:20px 5px;
text-align:center;
}

input.text_street {
width: 99%;
clear:both;
margin:1em 0 0;
}

/*************
/* 下層ページフォーム
*************/
nav#mainNav2{
clear:both;
width:100%;
margin:-8px auto 10px;
padding:0;
background: -webkit-gradient(linear, left top, left bottom, color-stop(1, #fff), color-stop(0.00, #f7f7f7));
background: -webkit-linear-gradient(top, #f7f7f7 0%, #fff 100%);
background: -moz-linear-gradient(top, #f7f7f7 0%, #fff 100%);
background: -o-linear-gradient(top, #f7f7f7 0%, #fff 100%);
background: -ms-linear-gradient(top, #f7f7f7 0%, #fff 100%);
background: linear-gradient(top, #f7f7f7 0%, #fff 100%);
border-top:1px solid #e4e4e4;
border-bottom:1px solid #e4e4e4;
background:#ae0303;
}

nav#mainNav2 a.menu{
width:100%;
height:40px;
line-height:40px;
font-weight: bold;
text-align:left;
text-align:center;
color:#fff;
}

nav#mainNav2 a#menu span{padding-left:10px;}
nav#mainNav2 a.menu span:before, nav#mainNav2 a.menu span:after{content: " ▶";}
nav#mainNav2 a.menuOpen span:before, nav#mainNav2 a.menuOpen span:after{content: " ▼";}

nav#mainNav2 a#menu:hover{cursor:pointer;}

nav#mainNav2 .panel{
display: none;
width:100%;
position: relative;
right: 0;
top:0;
z-index: 1;
background:#fff;
}

nav#mainNav2 ul li{
float: none;
clear:both;
width:100%;
height:auto;
line-height:1.2;
background:#fff;
}

nav#mainNav2 ul li a,nav#mainNav ul li.current-menu-item li a{
display: none;
padding:15px 10px;
text-align:left;
border-bottom:1px dashed #ccc;
}

nav#mainNav2 ul li a span{padding-left:10px;}

nav#mainNav2 ul li:first-child a{
border-top:1px solid #e4e4e4;
}

nav#mainNav2 ul li:last-child a{border:0;}

nav#mainNav2 ul li.active a{color:#006699;}

nav#mainNav2 div.panel{float:none;}

nav#mainNav2 a#menu{display:block;}

.form_mini_wrap{
width:100%;
height:auto;
margin:0 auto 10px;
padding:10px 0;
background:#fff;
border-bottom:1px solid #ccc;
}

.table_wrap_mini{
width:90%;
height:auto;
margin:0 auto;
padding:0;
}

table.form_mini01{
width:100%;
height:auto;
font-size: 12px;
border-collapse:collapse;
border-spacing:0;
margin:0 3px 0 0;
}

table.form_mini01 th{
width:auto;
font-weight:bold;
padding:3px 5px;
color:#fff;
background-color:#0862AA;
vertical-align:middle;
text-align:center;
border-radius: 5px;/* CSS3草案 */
-webkit-border-radius: 5px;/* Safari,Google Chrome用 */
-moz-border-radius: 5px;/* Firefox用 */
}

table.form_mini01 td{
padding:5px 0;
text-align:center;
}

input.btn_submit_mini {
display:none;
}

input.btn_submit_mini_sp {
width:100%;
display:block;

}

input.text_zip21mini, input.text_zip22mini, select.select_mini, input#datepicker_mini {
font-size:95%;
text-align:center;
padding:5px 0;
}

input.text_zip21mini {
width: 30%;
margin:0 5px 0 0;
}

input.text_zip22mini {
width: 40%;
margin:0 0 0 5px;
}

select.select_mini {
width: 40%;
}

input#datepicker_mini {
width: 80%;
}

@-moz-document url-prefix() { 
input.text_zip21mini, input.text_zip22mini, select.select_mini, input#datepicker_mini {
font-size:90%;
}

select.select_mini {
padding:2px 0;
}


}

/**************************
/* 黒板（トップページ+サブページ）
**************************/
.board_area{
width:98%;
height:auto;
margin:0 auto 10px;
background:url(../img/top/board_sp.png) no-repeat left top;
background-size:cover;
}

.board_area_bottom{
width:98%;
height:auto;
margin:-10px auto 10px;
background:url(../img/top/board_sp.png) no-repeat left bottom;
background-size:cover;
}

.board_title_wrap{
width:98%;
height:auto;
margin:0 auto;
padding:80px 0 0;
}

.board_title_bottom{
width:98%;
height:auto;
margin:0 auto;
padding:50px 0 0;
}

.board_title01, .board_title02, .board_title03, .board_title04, .board_title05, .board_title06, .board_title07{
width:90%;
height:auto;
margin:0 auto 10px;
padding:45px 0 0;
color:#fff;
text-align:center;
}

a:hover .board_title01, a:hover .board_title02, a:hover .board_title03, a:hover .board_title04, a:hover .board_title05, a:hover .board_title06, a:hover .board_title07{
opacity: 0.7;/*要素の透明度を指定*/
filter: alpha(opacity=70); /*ie6、7の透明度指定*/
}

a .board_title01{
background:url(../img/top/board_sp_title01.png) no-repeat center top;
}

a .board_title02{
background:url(../img/top/board_sp_title02.png) no-repeat center top;
}

a .board_title03{
background:url(../img/top/board_sp_title03.png) no-repeat center top;
}

a .board_title04{
background:url(../img/top/board_sp_title04.png) no-repeat center top;
}

a .board_title05{
background:url(../img/top/board_sp_title05.png) no-repeat center top;
}

a .board_title06{
background:url(../img/top/board_sp_title06.png) no-repeat center top;
}

a .board_title07{
background:url(../img/top/board_sp_title07.png) no-repeat center top;
}

#header{
width:100%;
height:auto;
margin:0 auto;
padding-bottom:0px;
}

#header h1,.logo,.info{text-align:center;}

.area{
display:none;
}

#area_slide{
display:none;
}

.area_text{
width:100%;
height:auto;
font-size:110%;
font-weight:bold;
color:#0862aa;
display:block;
text-align:center;
clear:both;
margin:0 auto;
text-indent:0px;
background: none;
}

.area_slide{
display:none;
}

.logo,.info{
clear:both;
width:100%;
float:none;
margin:0 0 10px;
}

.info{
margin:0px auto;
}

.box img{
float:none;
display:block;
margin:0 auto;
}

.box h3{padding-top:0;}

.alignleft,.alignright{
float:none;
display:block;
margin:0 auto 10px;
max-width:50px;
}

#gallery .grid{float:left;}

.syobun_table{margin: 0 10px;}

.syobun_table th,
.syobun_table td{
width: 100%;
display: block;
border-top: none;
border-right:1px solid #ccc !important;
text-align:center !important;
}
}


/* スマートフォン 縦(ポートレート) */
@media only screen and (max-width:480px){
.grid{width:100%;}
.box img{max-width:100px;}
#mainBanner h2,#mainBanner p{font-size:80%;}
#mainBanner_sub h2,#mainBanner_sub p{font-size:80%;}
.mainBanner_no_border h2,.mainBanner_no_border p{font-size:80%;}
.mainBanner_request h2,.mainBanner_request p{font-size:80%;}

.logo img{
max-width:320px;
}

.slogan{
display:none;
}

.alignleft img,.alignright img{
float:none;
display:block;
margin:0 auto 5px;
max-width:20px;
}
}