@charset "UTF-8";
/* CSS Document */

/*----- 共通部分 -----------*/
html, body, header, nav, article, section, aside, footer,
div, span, p, h1, h2, h3, h4,
ul, ol, li, dl, dt, dd,
table, tr, th, td, tbody, thead, tfoot {
  margin: 0;
  padding: 0;
}
ol, ul {
  list-style: none;
}
img {
  max-width: 100%;
  height: auto;
  border: 0;
}

p {
  margin: 10px 0 10px 0;
  line-height: 1.5;
  letter-spacing: 0.05em;
}




/*******************************************
　　　スマートフォン向けのスタイル 
*******************************************/
@media only screen and (max-width: 480px) {

html {
font-size: 62.5%;
}

#wrap2 {
  width: 100%;
  overflow: hidden;
  background: url(../img/gr.png) repeat;
}

#contents2 {
  margin: 0px 7px 10px 7px;
  background-color: #ffffff;
  border: solid 1px #d9d9d9;
  box-shadow: 0 2px 6px rgba(0, 0, 0, .20);
}

body {
  width: 100%;
  font: 87.5% 'ヒラギノ角ゴ pro W3', "Hiragino KaKu Gothic Pro", "メイリオ", Meiryo, Osaka, sans-serif;
  color: #333333;
  letter-spacing: 0.05em;
  -webkit-text-size-adjust: 100%;
}

/*--------------------------------------------- 
          ヘッダー　【スマホ用】
---------------------------------------------**/

#header2 {
  width: 100%;
  margin: 0 auto 0 auto;
  background-color: #030301;
  border-top: solid 4px #030301; 
}

#header {
   height: 125px;
}

h1 {
  display: none;
}
#h_logo {
  padding-top: 10px ; 
 text-align: center;
}
#h_logo2 {
  padding-top: 10px ; 
  text-align: center;
}


#h_info {
  padding: 0px 10px 0px 0px;
  text-align: center;
}

#h_info2 {
  padding: 0px 10px 0px 0px;
  text-align: center;
}

/*----------------------------------------------- 
     グローバルナビ【スマホ用】
 -----------------------------------------------*/

#header-menu {
 display: none;
}

a.menu {
	display: block;
	height: 20px;
	line-height: 20px;
	font-weight: bold;
	text-align: left;;
 background: -webkit-linear-gradient(top, #030301 0%, #404040 100%);
background: linear-gradient(to bottom, #030301 0%, #404040 100%);
 background-color:#030301  ;
color: #fff;
text-shadow: 1px 1px 1px rgba(0, 0, 0, .3);
	border: 0px solid #FFF;
	padding: 10px 10px 10px 20px;
}
a.menu span {
	     font-size: 1.4rem;
}
a.menu span:after {
  content: "▼";
}
a.menuOpen span:after {
  content: "▲";
}
a.menu:hover {
   cursor: pointer;
   background-color: #F7E33E;
}

#g_navi .gl_menu {
  background-color: #FFF;
  padding-top: 2px　10px　2px　30px;
  margin-right: 5px　50px　0px　70px;
}

#g_navi .gl_menu li {
	padding: 1px;
	border-bottom-width: 2px;
	background-color: #FFF;
	     font-size: 1.4rem;
	line-height: 15px;
}
#g_navi .gl_menu li span {
	 font-size: 1.0rem;
}

#g_navi .gl_menu li a {
	background-color: #D8D8F2;
	display: block;
	padding: 10px 0px 10px 30px;
	text-decoration: none
}

#g_navi .gl_menu li a:hover {
	background-color: #F7E33E;
}

#g_navi .gl_menu li strong {
	color: #0089BD;
	padding-top: 5px;
	padding-bottom: 0px;
	display: block;
}




/*--------------------------------------------
　　　　　　　　 main 【スマホ用】
 ---------------------------------------------*/
#main {
  margin: 15px 15px 15px 15px; 
}

/*---スマホhhome用メイン画像 -------*/

#header-img3 {
  width: 100%;
  margin: 0px 0 5px 0;
}
.main_photo {
  display: block;
  margin: 0 auto 0 auto;
}



/*-----------リンク／サイトマップ【スマホ用】--------*/
.fram2{
 float:left;
 width:100%;
 margin-top: 0px;
 margin-left: 0px;
 margin-right: 0px;
}
/*-----広域地図のボックス------*/
.boxside2 {
 display: none;
}---*/


/*----------------*/

.listbox {
        width: auto;
    }
    img {
        max-width: 100%;
        height: auto;
    }


/*-----H３内の文字部分【スマホ用】--------*/
.h3box {
 padding:0 0 0px 5px;
 font-size: 1.6rem;
}


/*---レスポンシブイベント用 表【スマホ用】---*/
.respo th{
  width:100%;
  text-align: left ;
  display:block;
  margin: 0 auto;
  border:none;
  border-radius: 3px;
    text-align: left;
}
.respo td{
  padding: 4px 7px 4px 7px;
  display: list-item;
  width: 100%;
  border-top: none !important;
}
}

/*------------ ご案内のトップリスト【スマホ用】--------------*/
ul.listbox2 li a{
padding: 4px;
margin: 1px 1px 3px 1px;
width: 60px; 
height: 50px;
}

/*--------上部画像かぶせタイトル文字【スマホ用用】--------*/
.ptcopyright{
   position: absolute;
    padding: 5px 10px 5px 10px;
    top:10px;
    right:10px;
    color: #fff;
    background: #000;
    filter:alpha(opacity=50);
    -moz-opacity: 0.5;
    opacity: 0.5;
    text-align: left;
   font-size: 1.4rem;;
}

.ptcopyright2,.ptcopyright3{
   position: absolute;
    padding: 3px 8px 3px 8px;
    top:70px;
    right:10px;
    color: #fff;
    background: #000;
    filter:alpha(opacity=50);
    -moz-opacity: 0.5;
    opacity: 0.5;
    text-align: left;
    font-size: 1.5rem;
}


.boxsideli_r, {
}
.boxsideli_l {
}

.boxside_r {
 text-decoration: none;
}
.boxside_l {
 text-decoration: none;
}

.boxside_r p,.boxside_l p {
 text-decoration: none;
}

.boxsideli_l2 {
 text-decoration: none;

}


/*---サイド文字かぶせ----*/
.boxside_lcopy{
    position:absolute;
    text-decoration: none;
     font-size: 15px;
     font-size: 1.5rem;
    top:5px;
    left:10px;
    text-align:left;
    padding:0px 10px 0px 10px;
    color: #2D3235;
    line-height:120%;
    background-color:;
     text-decoration: none;
   /*- filter:alpha(opacity=70);
    -moz-opacity: 0.7;
    opacity: 0.7;-*/
}

.boxside_rcopy{
    position:absolute;
    text-decoration: none;
     font-size: 15px;
     font-size: 1.5rem;
    top:5px;
    left:10px;
    text-align:left;
    padding:0px 10px 0px 10px;
    color: #2D3235;
    line-height:120%;
    background-color:;
     text-decoration: none;
   /*- filter:alpha(opacity=70);
    -moz-opacity: 0.7;
    opacity: 0.7;-*/
}



/*-----【施設案内】写真の横並びリスト-------*/
ul.imglist li{ 
 width:97%;
}
	
ul.imglist2 li{ 
 width:47%;
}	










/*******************************************
　　　トップイベント枠立て組　【スマホ用】 330-465／330以下
*******************************************/

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

html {
font-size: 62.5%;
}

.grid2,.grid3{
 width:90%;
}
.grimg2,.grimg3{
 width:100%;
 float: center;
  position: relative;
}
.grimg3_copy,.grimg3_copyy{
    position:absolute;
     font-size: 1.5rem;   
    top:10px;
    left:12px;
    padding:4px 10px 3px 10px;
    color: #fff;
    line-height:120%;
    font: 16px #fff;
     text-decoration: none;
     border-radius:8px;
  filter:alpha(opacity=80);
    -moz-opacity: 0.8;
    opacity: 0.8;
}

.grimg3_copy{
    background-color:#D14A77;
}

.grimg3_copyy{
    background-color:#714C99;
}



}



/*--------------------------------------------
　　　　　　　　 side 【スマホ用】
 ---------------------------------------------*/
#side {
 width: 97%;
 padding-bottom: 10px;
 margin: 10px 5px 0px 5px;	
}




/*******************************************
　　　レスポンシブテーブルデザイン 表【スマホ用】
*******************************************/
@media screen and (min-width:410px) and (max-width:480px) {

.ptcopyright3{
display: none;
}
}




/*******************************************
　　　レスポンシブテーブルデザイン 表【スマホ用】
*******************************************/
@media (max-width: 450px){

.resbase th{
  width:94%;
  display:block;
  margin: 0 auto;
  text-align: left;
  border:none;
  border-radius: 0px;
}
.resbase td{
  padding: 4px 7px 4px 7px;
  display: list-item;
  width: 97%;
  border-top: none !important;
}


}

/*******************************************
　　　各章の左上タイトル 表【スマホ用】
*******************************************/
@media (max-width: 410px){
.ptcopyright{
display: none;
}

}

/*******************************************
　　　スマートフォン向けのスタイル ＜確認用　後で消去＞
*******************************************/
/**@media only screen and (max-width: 320px) {
#h_logo {
display: none;
}
}**/