@charset utf-8;

* {margin:0;padding:0;border:0; box-sizing:border-box;}

.clearfix:after { content: ""; display: block; clear: both; }
.clearfix {display: inline-block;} /* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;} /* End hide from IE-mac */

body{
	font-size:90%;
	-webkit-text-size-adjust:none;
	line-height:1.8em;
	font-family:Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" , "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" , Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
	background-color:#fff;
	color:#333;
}


/* webfont
---------------------------------------------------- */
.webfont{font-family: 'Lato', sans-serif;}


/* link
---------------------------------------------------- */
a:link,a:visited {color: #666; text-decoration:underline} 
a:hover,a:active {color: #666; text-decoration:none}


/* header
---------------------------------------------------- */
header{
	width:100%;
	background:url(../images/bg_header.jpg) no-repeat bottom;
	background-size:cover;
}
.header{
	height:55px;
	line-height:normal;
	position:relative;
}
header h1{
	position:absolute;
	top:0;
	left:43%;
	padding-top:5px;
}
header h1 img{width:35%;height:auto;}
header div{
	position:absolute;
	top:0;
	right:0px;
	padding-top:10px;
	padding-right:15px;
}
header div a{font-size:25px;line-height:1.0em;color:#00449b; cursor:pointer}
header div a:link,
header div a:visited,
header div a:hover{ color:#00449b;text-decoration:none} 

/*ヘッダー固定ここから（スマホの縦画面のときのみ有効）*/
@media screen and (max-width: 480px){
.header{
    -webkit-display: flex;
    -ms-display: flex;
    /*display: flex;*/
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-align-content: stretch;
    -ms-align-content: stretch;
    align-content: stretch;
    -webkit-align-items: center;
    -ms-align-items: center;
    align-items: center;
    position: absolute;
    top: 0;
    width: 100%;
    box-sizing: border-box;
    transition: all .2s ease;
	z-index:100;
	background:url(../images/bg_header.jpg) no-repeat bottom;
	background-size:cover;
}
.header.is-fixed{
    position: fixed;
    background:url(../images/bg_header.jpg) no-repeat bottom;
	background-size:cover;
    /*box-shadow: 0 2px 5px rgba(0, 0, 0, .2);*/
}
.wideslider,
.h2{ margin-top:54px;}
.store_box{ padding-top:54px;}
}
/*ヘッダー固定ここまで*/


/* nav
---------------------------------------------------- */
#category_list{
	display:none;
	width:100%;
 	position: fixed;
	z-index:999;
	top: 0px;
	left: 0px;
}
#category_list ul{
	table-layout: fixed;
	background-color:#55c3e9;
	padding:10px 30px 30px;
	list-style:none;
}
#category_list li{
	border-collapse:collapse;
	border-bottom:1px solid #aae1f4;
	line-height:normal;
}
#category_list li em:before{ content: " \f111";font-family: FontAwesome; font-size:70%; color:#00449b;line-height:1.5em; padding-right:10px} 
#category_list li span{ float:right; font-size:80%; line-height:1.8em; color:#00449b;}
#category_list li span:after{ content: " \f0da";font-family: FontAwesome; color:#00449b;line-height:1.5em;padding-left:10px}
/*最後の入れ子には線はつけない*/
/*#category_list li:last-child{
    border-right:none;
}*/
#category_list a:link,
#category_list a:visited{color:#00449b; text-decoration:none; padding:15px 0px; display:block;}

#category_list p{
	filter: alpha(opacity=100);opacity:1;
	background:#00449b;
	text-align:right;
	padding:0px 15px;
	cursor:pointer;
	font-size: 250%;
	line-height:normal;
	color:#fff;
}


/* main
---------------------------------------------------- */
.pagebody{ padding:20px 20px 30px}

/* 電話番号 */
.phone a:before{ content: " \f095";font-family: FontAwesome; font-size:90%; line-height:1.5em; padding-right:7px}
.phone a:link,
.phone a:visited,
.phone a:hover,
.phone a:active{
	text-decoration:none;
	color:#fff;
	font-size:250%;
	font-weight:bold;
}


/* h2
---------------------------------------------------- */
.h2{
	padding:30px 0px;
	text-align:center;
	background:url(../images/bg_h2.jpg) no-repeat center;
	background-size:cover;
}
.h2 h2{
	font-size:140%;
	line-height:1.0em;
	color:#00449b;
}


/* footer
---------------------------------------------------- */
footer{
	background-color:#00449b;
	padding:15px;
	font-size:90%;
	line-height:1.5em;
	color:#fff;
}

footer div{text-align:center; margin-bottom:10px;}
footer div img{ width:30%; height:auto;}
footer p{ text-align:center; font-size:110%;}

small{
	margin-top:10px;
	display:block;
	text-align:center;
	font-size:80%;
	font-style:normal;
}


/* footer_btn
---------------------------------------------------- */
#footer_btn li{
	list-style:none;
	float:left;
	width:25%;
	text-align:center;
	font-size:11px;
	line-height:1.0em;
	margin-bottom:5px;
}
#footer_btn li a{
	display:block;
	border-right:1px solid #aae1f4;
	padding:10px 0px;
	background-color:#55c3e9;
	color:#fff;
	text-decoration:none;
	cursor:pointer;
}
#footer_btn i{ display:block; font-size:18px; font-weight:normal; margin-bottom:5px}


/* index.html
---------------------------------------------------- */
.top_news{
	border:2px solid #f4cff4;
	border-radius:15px;
	background:url(../../images/bg_news.jpg) repeat;
	padding:10px 15px 15px 15px;
}
.top_news2{
	border:2px solid #e91c2c;
	border-radius:15px;
	padding:13px 15px 15px 15px;
}
.top_news h2{ text-align:center;margin-bottom:10px;}
.top_news h2 img{ width:75%; height:auto;}
.top_news dl{
	width:100%;
	margin-bottom:10px;
}
.top_news dt{
	font-size:90%;
	font-weight:bold;
}
.top_news dt img{ vertical-align:middle; margin-left:5px;}

.top_event{
	background-color:#fffcc7;
	border-radius:10px;
	padding:15px;
	margin-bottom:30px;
}
.top_event div{ line-height:normal; margin-top:10px;}


/* news.html,event.html
---------------------------------------------------- */
#category{
	list-style:none;
	margin-bottom:10px;
}
#category li{
	width:29%;
	float:left;
	font-size:90%;
	position: relative;
	padding: .2em;
	border:1px solid #00449b;
	border-radius:7px;
	margin-right:5px;
	margin-bottom:5px;
}
#category li a{
	display:block;
	text-align:center;
	text-decoration:none;
}
#category li span {
	display: block;
	padding: .50em 1em;
	border: 1px dashed #00449b;
	border-radius:7px;
}
#category li a:link,
#category li a:visited{ color:#00449b;}

.event_box{
	border:1px solid #ccc;
	border-radius:10px;
	padding:15px;
	margin-bottom:20px;
}
.event_img{
	background-color:#eee;
	text-align:center;
	margin-bottom:15px;
}


/* event_detail.html,news_detail.html
---------------------------------------------------- */
.detail dl{
	width:100%;
	margin-bottom:15px;
}
.detail dt{
	font-size:90%;
	font-weight:bold;
}
.detail dl img{ vertical-align:middle; margin-left:5px;}

.detail .line{ vertical-align:top; float:left;margin-right:1px;}
.detail .twitter{ vertical-align:top; float:left;margin-right:1px;}
.detail .facebook{ vertical-align:top;float:left; }

.detail_img{
	list-style: none;
	margin-bottom:20px;
}
.detail_img li{
	background-color:#eee;
	text-align:center;
	margin-bottom:1px;
}


/* store.html
---------------------------------------------------- */
/*---- 日本地図 ----*/
.store_map{ margin-bottom:20px}
.store_area{
	position: relative;
}
.store_area li{
	list-style:none;
	font-weight:bold;
	font-size:90%;
	position: absolute;
}
.store_area li a{
	background-color: #fff;
	border:1px solid #55c3e9;
	padding: 5px 10px;
	border-radius: 30px;
	color:#00449b;
	text-decoration:none
}
.store_area li a:hover{
	background-color:#00449b;
	border:1px solid #00449b;
	color:#fff;
	opacity:1;filter: alpha(opacity=100);
}
.store_area .area_1 { top: 20%; right: 0%; /* 北海道・東北 */}
.store_area .area_2 { top: 52%; right: 0%; /* 関東 */}
.store_area .area_3 { top: 40%; left: 10%; /* 北陸・甲信越 */}
.store_area .area_4 { top: 65%; right: 15%; /* 東海 */}
.store_area .area_5 { top: 77%; right: 30%; /* 近畿 */}
.store_area .area_6 { top: 55%; left: 0%; /* 中国・四国 */}
.store_area .area_7 { top: 90%; left: 0%; /* 九州・沖縄 */}

/*---- エリアナビ ----*/
.works_anchorlinks{ margin-bottom:15px;}
.works_anchorlinks ul{
	list-style:none;
	background-color: #00449b;
	border-radius:10px;
}
.works_anchorlinks ul li a {
	color: #fff;
	text-decoration: none;
	padding: 10px;
	display: block;
	font-size:90%;
	position: relative;
	margin-bottom: 1px;
}
.works_anchorlinks ul li+li{border-top:1px solid #fff}
.works_anchorlinks ul li a:after {
	content: "\f0d7";
	font-family: FontAwesome;
	position: absolute;
	right: 15px;
}


/* store.html
---------------------------------------------------- */
#photo_container {
  margin: 15px -10px 0px;
}
#photo_container:after {
  content: "";
  display: table;
  clear: both;
}
#photo_container .item {
  float: left;
  width: 50%;
  padding: 0 10px;
  margin-bottom: 10px;
	text-align: center;
}
#photo_container .item a {
  font-size: 12px;
  text-align: center;
  text-decoration: none;
  border: solid 1px #ccc;
  border-radius: 4px;
  display: block;
	height: 0;
	padding-top: 75%;
	overflow: hidden;
  position: relative;
}
#photo_container .item a img {
	max-width: 100%;
	max-height: 100%;
	width: auto;
	height: auto;
	padding: 2px;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	-o-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}

.store_detail_ico{
	clear:both;
	list-style: none;
	margin: 20px -2px 20px;
	overflow: hidden;
}
.store_detail_ico li {
	float: left;
	width: 23%;
	margin: 0px 2px 4px;
}
.store_detail_ico li img{ width:100%; height:auto;}


/* title
---------------------------------------------------- */
.tit01{
  font-size:140%;
  line-height:normal;
  color:#032344;
  margin-bottom:15px;
}
.tit01:before { content: "―"; color:#d22205; padding-right:5px;}

.tit02{
	font-size:130%;
	color:#00449b;
	margin-bottom:10px;
}

.tit03{
	font-size:100%;
	color:#fff;
	background-color:#7ddfe2;
	padding:10px;
	border-radius:5px;
}


/* table, dl
---------------------------------------------------- */
.dl{width:100%;m}
.dl dt{
	clear:both;
	padding-top:12px;
	font-weight:bold;
	color:#ef7db9;
	line-height:normal;
}
.dl dd{clear:both; border-bottom:1px solid #ddd;}
.dl .last{ border-bottom:none;}


/* paging
---------------------------------------------------- */
div.paging{
	margin-top:15px;
	line-height:1.0em;
	font-size:90%;
	text-align:center;
}
div.paging span.current,
div.paging span a.paging-text{
	margin:1px 1px;
	padding:7px 9px;
	color:#00449b;
	background-color:#fff;
	border:1px solid #55c3e9;
	display:inline;
	zoom:1;
	display:inline-block;
	overflow:hidden;
	text-decoration:none;
	border-radius:50%;
}
div.paging span.current{
	background-color:#00449b;
	border:1px solid #00449b;
	color:#fff;
	display:inline;
	zoom:1;
	text-decoration:none;
	display:inline-block;
}


/* link, btn
---------------------------------------------------- */
.btn{
	display:block;
	padding:10px 0px;
	background-color:#00449b;
	border-radius:30px;
	text-align:center;
	font-weight:bold;
	line-height:normal;
}
.btn:link,
.btn:visited{ color:#fff; text-decoration:none}

.btn-s{
	font-size:85%;
	padding:0px 10px;
	border:1px solid #00449b;
	text-align:center;
	border-radius:30px;
}
.btn-s:link,
.btn-s:visited{ color:#00449b; text-decoration:none}


/* common
---------------------------------------------------- */
* html .dtb { zoom: 1; } /* IE6 */
*:first-child+html .dtb { zoom: 1; } /* IE7 */
h2,h3,h4,h5,h6{ clear:both; font-size:100%;line-height:normal;}
img{ vertical-align:top}

.clear {clear:both}

.f-left{float:left}
.f-right{float:right}

.ul_style li{padding:8px 0px; margin-left:20px}
.ul_style li+li{border-top:1px dotted #aaa;}

.center-block{ margin:0px auto}

.img100{width:100%;height:auto;}
.img_circle{
	border-radius:300px;
	-moz-border-radius:300px;
    -webkit-border-radius:300px;
}

/* テキスト関係 */
.tac{ text-align:center !important}
.tar{ text-align:right}
.large{ font-size:120%;}
.small{ font-size:80%; line-height:1.5em}
.lsn{ list-style:none}
.lss{ list-style:square; margin-left:20px}
.lhn{ line-height:normal}
.red{color:#c33}
.blue{ color:#00449b}
em{ font-style:normal}

/* サイズ指定 */
.w-30{ width:30%}
.w-40{ width:40%}
.w-50{ width:50%}
.w-60{ width:60%}
.w-70{ width:70%}
.w-80{ width:80%}

.mb5{ margin-bottom:5px}
.mb10{ margin-bottom:10px}
.mb15{ margin-bottom:15px}
.mb20{ margin-bottom:20px}
.mb30{ margin-bottom:30px}
.ml10{ margin-left:10px;}
.ml20{ margin-left:20px;}

.youtube{
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;
}
.youtube iframe,  
.youtube object,  
.youtube embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.fs104 {font-size:104%;}
.gray {color:#666;}
.fwb{font-weight: bold;}







.bannerbox a:link.insta_btn2{/*ボタンの下地*/
  color: #FFF;/*文字・アイコン色*/
  border-radius: 7px;/*角丸に*/
  position: relative;
  display: inline-block;
  height: 50px;/*高さ*/
  width: 100%;/*幅*/
  text-align: center;/*中身を中央寄せ*/
  font-size: 25px;/*文字のサイズ*/
  line-height: 50px;/*高さと合わせる*/
  vertical-align: middle;/*垂直中央寄せ*/
  background: -webkit-linear-gradient(135deg, #427eff 0%, #f13f79 70%) no-repeat;
  background: linear-gradient(135deg, #427eff 0%, #f13f79 70%) no-repeat;/*グラデーション①*/
  overflow: hidden;/*はみ出た部分を隠す*/
  text-decoration:none;/*下線は消す*/
}

.insta_btn2:before{/*グラデーション②*/
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;/*全体を覆う*/
  height: 100%;/*全体を覆う*/
  background: -webkit-linear-gradient(15deg, #ffdb2c, rgb(249, 118, 76) 25%, rgba(255, 77, 64, 0) 50%) no-repeat;
  background: linear-gradient(15deg, #ffdb2c, rgb(249, 118, 76) 25%, rgba(255, 77, 64, 0) 50%) no-repeat;
}

.insta_btn2 .fa-instagram{/*アイコン*/
  font-size: 35px;/*アイコンサイズ*/
  position: relative;
  top: 4px;/*アイコン位置の微調整*/
}

.insta_btn2 span {/*テキスト*/
  color: #fff;
  display:inline-block;
  position: relative;
  transition: .5s
}