/* IMPORT RESET */
@import url("reset.css");

/* IMPORT 12 COLUMN RESPONSIVE GS */
@import url("responsive.gs.12col.css");

/* ICOMOON */
@import url("icomoon.css");


/*	EXAMPLE STYLES */
body {
	font-family: Meiryo,"メイリオ","ＭＳ Ｐゴシック",Osaka,sans-serif;
	color: #333;
	background-color:#fff;
	font-size: 13px;
}

/* ----------   header  --------------------- */
header {
	padding-bottom:0px;
	position: absolute;
	top: 0px;
	left: 0px;
	width:100%;
	z-index:500;
}

.he_top{
	background-position: center 160px;
	/*background-image:url(../common_img/bg_03.png);*/
	background-size:cover;
	/*background-attachment: fixed;*/
	background-repeat: no-repeat;
}

.he_kasou{
	background-position: center 0;
	background-image:url(../common_img/bg_02.png);
	background-size:cover;
	background-attachment: fixed;
	background-repeat: no-repeat;
}

.he_inner{
/*background:rgba(255,255,255,1.0);*/
background: #00a0e9;
box-shadow:1px 1px 3px #000;
}


@media only screen and (max-width: 768px) {

.he_kasou{background-size:1000px ;
background-image:none;
}

}

/* ----------   main  --------------------- */

main {
	padding:0px 0 0px;
	min-height:600px;
	background:#fff;
}



@media only screen and (max-width: 768px) {
main {
	padding:0px 0px 30px;
	min-height:300px;
	background:#fff;
}
}

/* ----------   section  --------------------- */
section {

}

aside {
	margin:0px 0 10px;
}

#side_bar{
}

/* ----------   footer  --------------------- */
footer {
	padding:0px 0px 0px;
}

#link_area{
text-align:center;
margin:10px 0;
}


#link_area img{
margin:5px 0;
}


/* ----------   メインイメージ系  --------------------- */

#main_img {
	text-align:center;
	margin:125px 0 0px;
	padding:120px 0 70px 0;
	background:url(../common_img/bg_03.png) no-repeat center bottom;
	background-size: cover;
	z-index: -1;

}

#main_img h2{
	text-align:center;
}

@media only screen and (max-width: 959px) {#main_img {padding:120px 0 120px 0;}}
@media only screen and (max-width: 768px) {#main_img {padding:80px 0 80px 0;margin:190px 0 0px;}}


.nak_tt{
font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

.nak_tt h2{
font-weight:normal;
padding:8% 2% 5%;
font-size:200%;
color:#fff;
margin:155px 0 0px;
text-shadow:1px 1px 1px #000,-1px -1px 1px #000,1px 1px 1px #000,-1px -1px 1px #000,1px 1px 3px #000,-1px -1px 3px #000;
}


@media only screen and (max-width: 768px) {


.nak_tt h2{
font-size:140%;
padding:8% 2% 5%;
margin:235px 0 0px;
background:#4e9000 url(../common_img/border_ptn04.png);
text-shadow:none;
}

}



/* ----------   menu  --------------------- */

#menu-box{
  margin:0px 0px 0px 0px ;
  padding:20px 0px 15px 0px ;
  position: relative;
}

#menu{
  margin: 0px 0 0px;
  padding: 0;
  font-size:100%;
  width:100%;
  display: table;
}
#menu li{
  display: table-cell;
  text-align:center;
  line-height:1.2;
  border-right:solid 1px #e1e1e1;
  margin: 0;}


#menu li a{
  display: block;
  padding: 5px 20px 5px;
  color: #fff;
  text-align: center;
  font-weight:normal;
  text-decoration: none;
	font-size: 120%
}

#menu li:first-child{
  border-left:solid 1px #e1e1e1;
}


#menu li a span{
  color: #ffb400;
  font-size:90%;
  font-weight:normal;
}

#menu li a:hover{
  color: #fff;
  background:#0985BE;
}


#menu li dd{ display:none; position: absolute; z-index:100; top:65px;padding:0; background:#0985BE;}


#menu li ul.sub_nav { padding:0 0 0;display:block; overflow: hidden;margin:0;font-size:90%;}
#menu li ul.sub_nav li { width:300px;display:block; color:#fff; padding:0 0px; margin-bottom:0px; height:auto; list-style:none;border:solid 1px #e1e1e1;}
#menu li ul.sub_nav li a { border-right:none;background:none!important;color:#fff; text-align:left; padding:10px 20px 10px 20px; height:auto;text-decoration:none;}
#menu li ul.sub_nav li a:hover { background:#ffb400!important;color:#fff; text-align:left;}
#menu li ul.sub_nav li a:before { content:'\e910'; margin-right:15px;font-family:'icomoon';color:#fff;}

#menu li ul.sub_nav li a {
	opacity:0.9;
	filter: alpha(opacity=90);
	-ms-filter: "alpha( opacity=90 )";
}

#menu li ul.sub_nav li a:hover {
	opacity:1;
	filter: alpha(opacity=100);
	-ms-filter: "alpha( opacity=100 )";
	-webkit-transition: opacity linear 0.4s; -moz-transition: opacity linear 0.4s; transition: opacity linear 0.4s;
}


#toggle{
 display: none;
}


@media only screen and (max-width: 960px) {

#menu-box{
  margin:0px 0px 0px 0px ;
}

#menu{
  margin: 0px 0 0px;
  padding: 0;
  font-size:100%;
}

#menu li a{
  padding: 15px 0 15px;
}

#menu li a br{
  display:none;
}

#menu li a span{
display: none;
}

}

@media only screen and (max-width: 768px) {

#menu{
  margin: 0px auto 0px;
  padding:0px 0px 0px 0px ;
}

#menu li dd{ display:none; position: absolute; z-index:100; top:90px;padding:0; background:#002c53;}
#menu li ul.sub_nav { padding:0 0 0;display:block; overflow: hidden;margin:0;font-size:100%;}
#menu li ul.sub_nav li { width:100%;float: none; color:#fff; padding:0 0px; margin-bottom:1px; height:auto; list-style:none; }
#menu li ul.sub_nav li a { color:#fff; text-align:left; padding:10px 20px 10px 20px; height:auto;text-decoration:none;}
#menu li ul.sub_nav li a:hover { background:#0058a8!important;color:#fff; text-align:left;}
#menu li ul.sub_nav li a:before { content:'\e910'; margin-right:15px;font-family:'icomoon';color:#fff;}

}
@media only screen and (max-width: 480px) {
  #menu{
    display: none;
  }

#menu-box{
  background:none;
  margin:0px 0px 0px 0px ;
	padding-bottom: 0;
}



  #menu li{
    width: 100%;
    display:block;
    background:#fff;
    border-bottom:dotted 1px #ccc;
  }

  #menu li a{
    display: block;
    padding: 10px 0 10px;
    background:#0985BE;
    color:#fff;
  }

	#menu li a:hover { background:#ffb400!important;color:#fff;}

  #menu li.nak{
    width: 100%;
    border-bottom:dotted 1px #fff;
    background:none;
  }
  #menu li.hom{
    width: 100%;
    border-bottom:dotted 1px #fff;
  }


  #toggle{
    display: block;
    position: relative;
    width: 100%;
    background:#0985BE;
    border-bottom:solid 1px #fff;
  }

  #toggle a{
    display: block;
    position: relative;
    padding: 13px 0 10px;
    color: #fff;
    text-align: center;
    text-decoration: none;
  }
  #toggle:before{
    display: block;
    content: "";
    position: absolute;
    top: 50%;
    left: 10px;
    width: 20px;
    height: 20px;
    margin-top: -10px;
    background: #fff;
  }
  #toggle a:before, #toggle a:after{
    display: block;
    content: "";
    position: absolute;
    top: 50%;
    left: 10px;
    width: 20px;
    height: 4px;
    background: #0985BE;
  }
  #toggle a:before{
    margin-top: -6px;
  }
  #toggle a:after{
    margin-top: 2px;
  }

#menu li dt{ position: relative;}
#menu li dd{ display:none; position: absolute; z-index:100; top:140px;padding:0; border:none;width:100%;}
#menu li ul.sub_nav { padding:0 0 0;display:block; overflow: hidden;margin:0;font-size:100%;border:none;}
#menu li ul.sub_nav li { float: none; color:#fff; padding:0 0px; margin-bottom:1px; height:auto; list-style:none; }
#menu li ul.sub_nav li a { background:#ecf6ff!important;color:#815828; text-align:left; padding:10px 20px 10px 20px; height:auto;text-decoration:none;border:none;}
#menu li ul.sub_nav li a:hover { background:#815828!important;color:#fff; text-align:left;}
#menu li ul.sub_nav li a:before { content:'\e910'; margin-right:15px;font-family:'icomoon';color:#815828;}

}





.btn01 {margin:20px auto;}

.btn01 a:before { content:'\e910'; margin-right:10px;font-family:'icomoon';color:#fff;font-size: 100%; }

.btn01 a{
	color:#fff;
	font-weight:bold;
	text-decoration:none;
	font-size:120%;
	display:block;
	padding:15px 0px;
	background:#0048ff;
	text-align:center;
	-webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;
}

.btn01 a:hover{
	background:#007c1a;　/* Firefox用 */
}

.btn02 {}

.btn02 a:before { content:'\e910'; margin-right:10px;font-family:'icomoon';color:#fff;font-size: 100%; }

.btn02 a{
	color:#fff;
	font-weight:bold;
	text-decoration:none;
	font-size:100%;
	display:block;
	padding:3px 10px;
	background:#ef0000;
	text-align:center;
	-webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;
}

.btn02 a:hover{
	background:#ff7800;　/* Firefox用 */
}


/* ----------   右サイド  --------------------- */

.side_box{
border:solid 1px #00a0e9;
border-top:solid 3px #00a0e9;
background:#f8f8f8;
}

.side_box h3{
background:#00a0e9;
text-align:center;
padding:8px 5px;
margin:0px auto 5px;
}

.add{
padding:10px 0 5px;
border-bottom:solid 1px #ccc;
}

.tel{
text-align:center;
padding:10px 0 10px;
}

.cont{
}

.cont a{
display:block;
-webkit-border-radius:60px; -moz-border-radius:60px; border-radius:60px;
padding:5px 10px 5px;
text-align:center;
background:#f06600;
}

.cont a:hover{
background:red;
}

@media only screen and (max-width: 768px) {

.side_box{
width:70%;
margin:10px auto 10px;
}

}

@media only screen and (max-width: 480px) {

.side_box{
width:90%;
margin:10px auto 10px;
}

}

.side_btn{
margin:15px 0;
}

.side_btn li{
margin:10px 0;
text-align:center;
}

/* ----------   フッターナビ  --------------------- */

#page_up{width:62px;
margin:10px auto 0;
text-align:center;
}
#page_up img{width:100%;}


.f_bg{
background:#00a0e9;
}

.fnav {
margin:15px 0 0px 0px;
}

.fnav li{
float:left;
margin:10px 15px 10px 0;
color:#fff;
font-size:95%;
}

.fnav li a:before  { content:'>'; float:left;margin-right:1px;font-size:80%;padding:0px 1px;}

.fnav li a{
display:block;
color:#fff;
}

.fnav li a:hover{
text-decoration:none;
}

.f_info{padding:15px 0px 0px 0px ;}

.f_info img{
padding-bottom: 10px;
}


@media only screen and (max-width: 768px) {

.f_logo{
text-align:center;
margin-bottom:20px;
}

.f_info{
width:280px;
margin:20px auto 0px;
}

.f_info img{
padding-bottom: 10px;
}

.fnav {
margin:15px 0 0px 0px;
padding: 0 10px;
text-align: center;
}

}

#link_img{
text-align:center;
padding:20px 0;
margin:0px 0 0 0;
}

#link_img img{
margin:0px 10px 0 10px;
}

#site_copy{
text-align:center;
margin:0px 0 0 0;
padding:10px;
color:#fff;
background:#0051ac;
}

/* ----------   デバイス毎の振り分け  --------------------- */


/*PC960px以上 */


.pagetop {
	display: none;
	position: fixed;
	bottom: 130px;
	right: 2%;
}
.pagetop a {
	display: block;
	width: 60px;
	height: 60px;
	text-align: center;
}

.logo{float:left;width:410px;padding:15px 0px 0px 0px ;
}


.h_info{float:right;width:280px;padding:35px 0px 0px 0px ;}


@media only screen and (max-width: 959px) {

.logo{
float:left;
width:300px;
padding:15px 0px 0px 0px ;
}


}

@media only screen and (max-width: 768px) {

.logo{
float:none;
width:300px;
margin:0 auto 0;
}

.h_info{float:none;width:250px;margin:0 auto 10px;}


#side_bar{display:none;}
#pan {display:none;}

#page_up{width:25%;
margin:0px auto 0;
}
#page_up img{width:100%;}

}

@media only screen and (max-width: 480px) {

#page_up{width:35%;
margin:0px auto 0;
}
#page_up img{width:100%;}

}


/* ロールオーバーで不透明度変更
-------------------------------------------------- */
.hover_img a:hover img,
a.hover_img:hover img {
	opacity:0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha( opacity=70 )";
	-webkit-transition: opacity linear 0.4s; -moz-transition: opacity linear 0.4s; transition: opacity linear 0.4s;
}


.link_box{
-webkit-transition: opacity linear 0.4s; -moz-transition: opacity linear 0.4s; transition: opacity linear 0.4s;
}

.bl-hover{
	opacity:0.6;
	filter: alpha(opacity=60);
	-ms-filter: "alpha( opacity=60 )";
	background: #fff;
	z-index:1;
	-webkit-transition: opacity linear 0.4s; -moz-transition: opacity linear 0.4s; transition: opacity linear 0.4s;
}

/* タイトルのスタイル
-------------------------------------------------- */


.tt_style01{
	font-size: 130%;
	color: #fff;
	background: #00a0e9;
	padding: 10px 0px 10px 0px;
	font-weight: bold;
	margin: 30px 0px 20px;
	text-align: center;
	line-height: 1.1;
	box-shadow: 2px 2px 1px #fff inset, -2px -2px 1px #fff inset;
	border: solid 1px #00a0e9;
	}
}

.tt_style01 span{
color:#009cff;
font-size:80%;
font-weight:normal;
}

@media only screen and (max-width: 768px) {}


.tt_style02{
font-size: 130%;
color: #fff;
padding:3px 0 3px 10px;
margin:30px 0px 15px;
font-weight:bold;
background:#e46326;
-webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;
}

.tt_style02:before { content:'\e904'; margin-right:10px;font-family:'icomoon';color:#fff;font-size: 100%; }


.tt_style03{
font-size: 120%;
color: #fff;
padding:4px 0 4px 30px;
margin:30px 0px 15px;
font-weight:bold;
background:url(../common_img/h3_bg04.png) no-repeat 10px center,url(../common_img/bg_ptn_mono.gif) repeat 0 center;
-webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;
}


.tt_style04{
font-size: 120%;
color: #7f4c14;
text-align:center;
padding:6px 0 6px 0px;
border-bottom:dotted 2px #7f4c14;
margin:30px 0px 15px;
font-weight:bold;
}



.sikaku dt:before { content:'\e90d';margin:0px 5px 0px 0px ;font-family:'icomoon';color:red;}

.sikaku dt{ font-weight:bold;padding:5px 5px;border-bottom:dotted 1px #ccc;color:#c33700;font-size:105%;
text-indent:-20px;
padding-left:20px;
}



/* googlemap */

.google-maps {
position: relative;
padding-bottom: 75%;
height: 0;
overflow: hidden;
margin:10px 0 0 0;
}
.google-maps iframe {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100% !important;}

/*
====================================================================================================
◆画像のレフト・ライト
---------------------------------------------------------------------------------------------------- */

.fig_01{
float:right;
width:36%;
margin:0px 0px 0px 25px;
}

.fig_02{
float:left;
width:36%;
margin:0px 25px 0px 0px;
}

.fig_03{
float:right;
width:22%;
margin:0px 0px 0px 25px;
}

.fig_04{
float:left;
width:22%;
margin:0px 25px 0px 0px;
}

.fig_05{
float:left;
width:105px;
margin:0px 20px 20px 0px;
}

.fig_06{
float:right;
width:48%;
margin:0px 0px 0px 0px;
}

.fig_n01{
float:right;
width:36%;
margin:0px 0px 0px 25px;
}

.fig_n02{
float:left;
width:36%;
margin:0px 25px 0px 0px;
}

.fig_n03{
float:right;
width:20%;
margin:0px 0px 0px 25px;
}

.fig_n04{
float:left;
width:20%;
margin:0px 25px 0px 0px;
}


.figure img{width:100%;}

figucaption{text-align:center;}


@media only screen and (max-width: 768px) {

.fig_n01{
display:none;
}

.fig_n02{
display:none;
}

.fig_n03{
display:none;
}

.fig_n04{
display:none;
}


.fig_03{
width:150px;
}

.fig_04{
width:150px;
}

}