@charset "UTF-8";

/*********************************************************************
 一括設定
*********************************************************************/

/* 初期値クリア系 ---------------------*/
body, ul, li, h2, h3, p, dd, dt{padding:0;margin:0;}
li{list-style-type:none;}
a{text-decoration:none;}

/*--------------------------------------
 初期値設定系
 上段に初期値を設定して、下段で上書き
---------------------------------------*/

/* rem設定用パーセント */
html{font-size:62.5%;}

/* 比率100%以上には拡大はしない */
img{max-width:100%;}

/* ベースフォントサイズ指定 -----------------*/
h2, h3{font-size:1.6rem;line-height:1.4;}

/* フォントファミリー指定 -------------*/
body{font-family:"Yu Gothic Medium", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro";}
#photo, .news_date, .blog_date, .price{font-family:'Archivo Black',sans-serif;}


/*------------------------------------------------
 ページャー
------------------------------------------------*/
.pagerArea{
margin:auto;text-align:center;
font-size:2rem;
margin-bottom:2rem;
}
.pagerArea a{margin:auto 0.5rem;}

/*------------------------------------------------
 ヘッダ
------------------------------------------------*/

/*----------------------------------------
 ヘッダ固定のため、sticky採用
 top left を指定しないと機能しない
-----------------------------------------*/
header{
width:100%;
position:sticky;
position:-webkit-sticky;
top:0;left:0;z-index: 999;
}



/* ヘッダエリア（Ｇメニュー除く）*/
.htop{width:100%;display:table}
.htop li{display:table-cell;width:50%;}
.htop li:first-child img{
max-width:calc(100% - 5rem);
padding:1rem 1rem 0.5rem;
}

.htop li:last-child{
width:calc(50% - 2rem);
padding:0 1rem 2rem;
text-align:right;
vertical-align:bottom;
}


/*
.htop{width:100%;}

/* ヘッダ左コンテンツ */
/*
.htop li:first-child{float:left;width:50%;}
.htop li:first-child img{
max-width:calc(100% - 5rem);
margin:1rem 1rem 0.5rem;
}

/* ヘッダ右コンテンツ */
/*
.htop li:last-child{
width:calc(50% - 2rem);
float:right;
margin:3rem 1rem 0.5rem;
text-align:right;
}


/*------------------------------------------------
 グローバルメニュー
------------------------------------------------*/
.gmn{display:inline-block;width:100%;border-bottom:3px solid #fff;}


.gmn li{
text-align:center;float:left;padding:auto 1rem;
width:100%;
max-width:-webkit-calc(100% / 5);
max-width:calc(100% / 5);
box-sizing:border-box;
}
.gmn a, li.thispage{padding:0.5rem;display:inline-block;font-size:1rem;box-sizing:border-box;}
.gmn img{max-width:20%;min-width:1.5rem;}
.gmn a{width:100%;}

/*------------------------------------------------
 コンテナ
------------------------------------------------*/
#container{margin-top:2rem;}

/*------------------------------------------------
 ユーティリティ
------------------------------------------------*/

/* フロート解除 */
.cf:after{content:".";display:block;visibility:hidden;height:0.1px;font-size:0.1rem;line-height:0;clear:both;}

/* ページトップリンク */
#page-top {position:fixed;bottom:10px;right:10px;z-index:999;}
#page-top a{display:block;z-index:999;padding:10px;border-radius:20px;font-size:90%;font-weight:bold;text-decoration:none;text-align:center;opacity:0.7;margin:10px;}
#page-top a:hover{text-decoration:none;opacity:1;}

/* トピックパス */
.tPath{font-size:1.2rem;margin:1rem;}
.tPath li{float:left;}
.tPath li:after{content:" > ";margin-right:0.5rem;}
.tPath li:last-child:after{content:"";}


/*********************************************************************
 TOP オリジナル
*********************************************************************/

/*-------------------
 メインイメージ
-------------------*/
.mimg{margin:auto;text-align:center;}


/*********************************************************************
 メニュー
*********************************************************************/
.category{text-align:center;margin:auto auto 1rem;}

.category li{
display: inline-block;
text-align:center;margin:1rem;
padding:1rem;
box-sizing:border-box;
border-radius: 10px;         /* CSS3草案 */  
-webkit-border-radius: 10px; /* Safari,Google Chrome用 */  
-moz-border-radius: 10px;    /* Firefox用 */
}

.category h2{
font-size:1.4rem;
margin:auto 1rem 0.5rem;
line-height:1.4;
display:inline;
}

.price{font-size:5rem;font-weight:300;margin-bottom:1rem;}
.price span{font-size:4rem;}

.menuTxt{text-align:left;font-size:1.3rem;}


/*********************************************************************
 アクセス
*********************************************************************/
#access{max-width:90%;margin:auto;}

.accinfo{width:100%;margin-bottom:3rem;}
.accinfo th,.accinfo td{font-size:1.3rem;padding:0.5rem;}
#access iframe{width:100%;height:40%;margin-bottom:4rem;}

/*********************************************************************
 blog
*********************************************************************/

#blog{width:90%;margin:1rem auto;font-size:1.4rem;}
#blog ul{margin:auto auto 2rem;padding-top:2rem;box-sizing:border-box;}
#blog li{float:left;}
#blog li:first-child{width:20%;max-width:10rem;}
#blog li:last-child{width:calc(79% - 1rem);margin-left:1rem;}
#blog span{display:block;}
#blog a{text-decoration:underline;}
#blog b{font-size:3.7rem;line-height:1;}
#blog li:last-child span{text-align:right;margin-top:1rem;}

/*********************************************************************
 Q & A
*********************************************************************/

#qanda{margin-top:2rem;}
#qanda dl{max-width:90%;margin:auto auto 1rem;font-size:1.6rem;}
#qanda dl:last-child{border-bottom:0;}
#qanda dt{
position:relative;
background:url('../img/icon_chokkin1.png') no-repeat top left;
padding:1rem 0 1rem 12rem;
background-size:12rem;
height:10rem;
}
#qanda dd{
position:relative;
background:url('../img/icon_chokkin2.png') no-repeat top right;
padding:1rem 12rem 1rem 0;
background-size:12rem;
margin-bottom:1rem;
max-width:100%;
min-height:10rem;
}

#qanda dt p{
margin:auto 2rem auto 2rem;
border-radius: 10px;
padding:1rem 1.5rem;
display:inline-block;
}

#qanda dd p{
margin:auto 2rem auto 2rem;
border-radius: 10px;
padding:1rem 1.5rem;
display:inline-block;
width: calc(100% - 7rem);
}

#qanda dt p::before{
  position:absolute;
  content: '';
  display: block;
  width: 0;
  height: 0;
  left: 12rem;
  top: 3rem;
  border-top: 1rem solid transparent;
  border-bottom: 1rem solid transparent;
}


#qanda dd p::after{
  position: absolute;
  content: '';
  display: block;
  width: 0;
  height: 0;
  right: 12rem;
  top: 3rem;
  border-top: 1rem solid transparent;
  border-bottom: 1rem solid transparent;
}


/*********************************************************************
 フッタまわり
*********************************************************************/

footer{
text-align:center;
line-height:1.5;
padding:1rem;
}

.flink,.copyright{margin:1rem;}
.copyright{margin:1rem;}



/******************************************************************************/
/******************************************************************************/

/* デバイスの横幅が701px以上の場合 */

/******************************************************************************/
/******************************************************************************/
@media only screen and (min-width: 701px) {


.htop li:last-child{font-size:3rem;}

/*-----------------------------------------
 gmn
-------------------------------------------*/
.gmn span{font-size:1.6rem;line-height:2;}

/*-----------------------------------------
 news
-------------------------------------------*/
.news{width:90%;margin:1rem auto 3rem;font-size:1.2rem;}
.news h2{text-indent:4rem;padding:1rem 0;margin-bottom:1rem;background:url('../img/icon_news.png') no-repeat;background-size:contain;}
.news ul{margin:auto auto 2rem;padding-top:2rem;box-sizing:border-box;}
.news li{float:left;}
.news li:first-child{width:20%;max-width:10rem;}
.news li:last-child{width:calc(79% - 1rem);margin-left:1rem;}
.news span{display:block;}
.news a{text-decoration:underline;}
.news b{font-size:3.7rem;line-height:1;}


.newsArea {width:80%;margin:auto auto 3rem;}
.newsCap{font-size:1.2rem;}
.newsArea h2{width:100%;padding-bottom:1rem;font-size:2rem;margin-bottom:0.5rem;}
.newsText{font-size:1.6rem;margin:1rem auto;}
.newsGuide{}
.newsGuide a{padding:1rem;width:100%;font-weight:bold;display:block;text-align:center;}



/*-----------------------------------------
 menu
-------------------------------------------*/
.menu{text-align:center;margin:auto auto 1rem;}
.menu li{width:30%;
display: inline-block;
text-align:center;margin:1rem;
padding:1rem;
box-sizing:border-box;
border-radius: 10px;         /* CSS3草案 */  
-webkit-border-radius: 10px; /* Safari,Google Chrome用 */  
-moz-border-radius: 10px;    /* Firefox用 */  
}
.menu img{min-width:calc(20rem - 2rem);margin:1rem auto;}
.menu h2{margin:auto 1rem 0.5rem;text-align:left;}
.menu p{text-align:left;font-size:1.2rem;margin:auto 1rem 1rem;}

.category li{
width:30%;min-width:20rem;
}
/*-----------------------------------------
 staff
-------------------------------------------*/
.staff{margin:auto auto 1rem;text-align:center;}
.staff li{
width:30%;min-width:20rem;
display: block;
margin:1rem;
padding:1rem;
box-sizing:border-box;
border-radius: 10px;         /* CSS3草案 */  
-webkit-border-radius: 10px; /* Safari,Google Chrome用 */  
-moz-border-radius: 10px;    /* Firefox用 */
float:left;
font-size:1.6rem
}

.staff h2{
text-align:left;
font-size:1.8rem;
margin:1rem 1rem auto;
line-height:1.4;
display:inline-block;
}
.staff p{
text-align:left;
margin:1rem;
font-size:1.3rem;
}
.staff span{display:block;margin-bottom:0.5rem;}

/*-----------------------------------------
 blog
-------------------------------------------*/

.blogBox {width:100%;}
.blogBox > li:first-child{width:calc(69% - 4rem);float:left;margin:2rem;}
.blogBox > li:last-child{width:calc(31% - 2rem);float:right;margin:2rem 2rem 2rem 0;}

.blogBox h2{width:100%;padding-bottom:1rem;font-size:2rem;margin-bottom:0.5rem;}
.blogCap{font-size:1.2rem;text-align:right;}
.blogText{font-size:1.6rem;}

.blogBox li:last-child h3{padding:0.5rem 0.5rem 1rem;text-align:center;}

.calenderBox{margin: 0 auto;;margin-bottom: 10px;}
.calenderBox table{padding: 5px;}
.calenderBox td{text-align: center;}
.calenderBox td a{text-decoration:underline;}

.newEntryBox{text-align:left;margin-bottom: 10px;width:100%;}
.newEntryBox li, .archivesBox li{width:calc(100% - 1rem);text-align:left;padding:0.5rem;font-size:1.4rem;}
.newEntryBox li:before{content:"・";font-weight:bold;}
.newEntryBox li:last-child{border-bottom:0;}

.archivesBox{text-align:left;margin-bottom: 10px;}
.archivesBox li{text-align:center;}

.blogGuide a{padding:1rem auto;width:100%;font-weight:bold;display:block;}

}
/******************************************************************************/
/******************************************************************************/

/* デバイスの横幅が700px以下の場合 */

/******************************************************************************/
/******************************************************************************/

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

.htop li:last-child{font-size:1.8rem;}


/*-----------------------------------------
 gmn
-------------------------------------------*/
.gmn span{font-size:1.3rem;line-height:2;padding:1rem 0;}

/*-----------------------------------------
 news
-------------------------------------------*/
.news{width:90%;margin:1rem auto 3rem;font-size:1.4rem;}
.news h2{text-indent:4rem;padding:1rem 0;background:url('../img/icon_news.png') no-repeat;background-size:contain;}
.news ul{margin:auto auto 2rem;padding-top:2rem;box-sizing:border-box;}
.news li{float:left;}
.news li:first-child{width:20%;max-width:10rem;}
.news li:last-child{width:calc(79% - 1rem);margin-left:1rem;}
.news_date{font-size:1.2rem;}
.news span{display:block;}
.news b{font-size:3.7rem;line-height:1;}
.news a{text-decoration:underline;}

.newsArea {width:90%;margin:auto auto 3rem;}
.newsCap{font-size:1.2rem;}
.newsArea h2{width:100%;padding-bottom:1rem;font-size:2rem;margin-bottom:0.5rem;}
.newsText{font-size:1.6rem;margin:1rem auto 5rem;}
.newsGuide a{padding:1rem 0;width:100%;font-weight:bold;display:block;text-align:center;}

/*-----------------------------------------
 menu
-------------------------------------------*/
.menu{text-align:center;margin:auto auto 1rem;}
.menu li{width:calc(100% - 2rem);min-width:20rem;
display: inline-block;
text-align:center;margin:1rem;
padding:0.5rem 1.5rem;
box-sizing:border-box;
border-radius: 10px;        /* CSS3草案 */  
-webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
-moz-border-radius: 10px;   /* Firefox用 */  
}
.menu img{min-width:calc(20rem - 2rem);margin:1rem auto;}
.menu h2{margin:auto 1rem 0.5rem;text-align:left;}
.menu p{text-align:left;font-size:1.2rem;margin:auto 1rem 1rem;}

.category li{
width:90%;min-width:20rem;
}

/*-----------------------------------------
 staff
-------------------------------------------*/
.staff{margin:auto auto 1rem;}
.staff li{
width:calc(100% - 2rem);min-width:20rem;
display: inline-block;
margin:1rem;
padding:1rem;
box-sizing:border-box;
border-radius: 10px;         /* CSS3草案 */  
-webkit-border-radius: 10px; /* Safari,Google Chrome用 */  
-moz-border-radius: 10px;    /* Firefox用 */
box-sizing:border-box;
}

.staff h2{
font-size:2rem;
margin:1rem 1rem auto;
line-height:1.4;
display:inline-block;
text-align:left;
}
.staff p{
margin:1rem;
font-size:1.6rem;
}
.staff span{display:block;margin-bottom:0.5rem;}

/*-----------------------------------------
 blog
-------------------------------------------*/
.blogBox {width:100%;}
.blogBox > li:first-child{width:calc(100% - 4rem);margin:2rem;}
.blogBox > li:last-child{width:calc(100% - 4rem);margin:2rem;}
.blogBox h2{width:100%;padding-bottom:1rem;font-size:2rem;margin-bottom:0.5rem;}
.blogCap{font-size:1.2rem;text-align:right;}
.blogText{font-size:1.6rem;}
.blogBox li:last-child h3{padding:0.5rem 0.5rem 1rem;text-align:center;}
.calenderBox{display:none;}
.newEntryBox{text-align:left;margin-bottom: 10px;width:100%; box-sizing:border-box;}
.newEntryBox li, .archivesBox li{width:calc(100% - 1rem);text-align:left;padding:0.5rem;font-size:1.4rem;}
.newEntryBox li:before{content:"・";font-weight:bold;}
.newEntryBox li:last-child{border-bottom:0;}
.archivesBox{text-align:left;margin-bottom: 10px; box-sizing:border-box;}
.archivesBox li{text-align:center;}

.blogGuide a{
line-height:2;
padding:0 1rem;width:100%;
font-weight:bold;display:block;font-size:1.4rem;text-align:center;
box-sizing:border-box;
}



}


#access th{
  white-space: nowrap;
}