﻿@charset "utf-8";
/* CSS Document */

/*カラースキーム
http://paletton.com/#uid=53f0u0kduID3UYk8LRKhPynlMst
font-family:'Anton',sans-serif;
font-family:'Rock Salt',cursive;
font-family:'Lora',serif;
*/

/*基本レイアウト*/
html{
height:100%;
font-size:.625em;
/*font-size:calc(100vw/64);*/
}
a{
color:#FFF;
text-decoration:none;
}
a:active{text-decoration:none;}
a:hover{text-decoration:none;}
a:visited{text-decoration:none;}

body{
font-family:'Shippori Mincho B1',"游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN","HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",serif;
font-size:1.4rem;
color:#333;
line-height:1.75em;
position:relative;
}
header{
box-sizing:border-box;
width:100%;
height:90px;
position:fixed;
top:0;
z-index:2;
}
#siteLogo{
display:block;
width:5em;
margin:.5em auto;
}

@media only screen and (min-width:768px){
header{
height:270px;
position:relative;
}
#siteLogo{
display:block;
width:10em;
margin:2em auto;
}
}
header .container{position:relative;}

h1#siteHeading{
height:3em;
line-height:3em;
background-color:#2D8D83;
color:#FFF;
text-align:center;
font-size:1rem;
}


#mainFlame{margin-top:90px;}
@media only screen and (min-width:768px){
#mainFlame{margin-top:0;}
}


footer{
position:relative;
margin-top:3em;
padding:0 0 4em 0;
background-color:#333;
}

#list-contact-01{
width:80%;
margin-left:10%;
position:fixed;
bottom:0;
z-index:5;
}
@media only screen and (min-width:768px){
#list-contact-01{
width:50%;
margin-left:25%;
}
}
#list-contact-01 li{
display:inline-block;
width:50%;
}
#list-contact-01 li a{
display:block;
width:90%;
margin:auto;
padding:.5em 0;
background-color:#2D8D83;
color:#FFF;
font-size:1.5rem;
font-weight:700;
text-align:center;
}

.menu-trigger,
.menu-trigger span {
display:inline-block;
transition:all .7s;
box-sizing:border-box;
}
.menu-trigger {
position:fixed;
right:1rem;
top:4rem;
width:3em;
height:2.5em;
background-color:transparent;
z-index:15;
cursor:pointer;
}
.menu-trigger span {
position: absolute;
left:0;
width:100%;
height:.5em;
background-color:#FFF;
border-radius:.5em;
}
.menu-trigger span:nth-of-type(1){top:0;}
.menu-trigger span:nth-of-type(2){top:1em;}
.menu-trigger span:nth-of-type(3){bottom:0;}

.menu-trigger.active span:nth-of-type(1),
.menu-trigger.active span:nth-of-type(2),
.menu-trigger.active span:nth-of-type(3){background-color:#2D8D83;}
.menu-trigger.active span:nth-of-type(1){
-webkit-transform: translateY(1em) rotate(-315deg);
transform: translateY(1em) rotate(-315deg);
}
.menu-trigger.active span:nth-of-type(2){opacity:0;}
.menu-trigger.active span:nth-of-type(3){
-webkit-transform: translateY(-1em) rotate(315deg);
transform: translateY(-1em) rotate(315deg);
}


.list-guide-shop-01{
display:none;
position:absolute;
top:-1.5em;
right:0;
color:#FFF;
line-height:1.5em;
}
.list-guide-shop-01 dt,
.list-guide-shop-01 dd{}
.list-guide-shop-01 dt{font-size:1.2rem;}
.list-guide-shop-01 dd{}


.list-guide-shop-02{
color:#FFF;
text-align:center;
margin:1em auto auto 0;
}
.list-guide-shop-02 dt,
.list-guide-shop-02 dd{}
.list-guide-shop-02 dt{font-size:1.2rem;}
.list-guide-shop-02 dd{}
.list-guide-shop-02 dd a{
display:block;
margin:.25em 0;
font-size:3.5rem;
color:inherit;
}

.list-guide-shop-03{
margin:2em 0;
width:100%;
color:#2D8D83;
text-align:center;
position:absolute;
bottom:3em;
}
.list-guide-shop-03 dt,
.list-guide-shop-03 dt{}
.list-guide-shop-03 dt{font-size:1.2rem;}
.list-guide-shop-03 dd{}
.list-guide-shop-03 dd a{
display:block;
margin:.25em 0;
font-size:3rem;
color:inherit;
}

.list-anchor-sns{
margin:.5em 0;
text-align:center;
}
.list-anchor-sns li{display:inline-block;}
.list-anchor-sns a{color:#FFF;}
.list-anchor-sns a:hover{color:#999;}

/*common_styles////////////////////////////////////////////////////////////////////////////*/

.fnt01{font-family:'YuGothic','Yu Gothic','游ゴシック','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ','Meiryo',sans-serif;}
.fnt02{font-family:"游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN","HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",serif;}

#topScroll{
display:none;
width:120px;
height:30px;
position:absolute;
top:-50px;
right:0px;
}

/*page-styles////////////////////////////////////////////////////////////////////////////*/
.section-page-intro{margin:3em 0;}
.section-page-intro img{
border:#FFF solid .5rem;
box-shadow:1px 1px 3px rgba(0,0,0,.3);
transform:rotate(0deg);
}
.section-page-intro .lead-01{
margin:1em 0;
text-align:center;
}
@media only screen and (min-width:768px){
.section-page-intro .lead-01{
margin:.5em 0;
text-align:left;
}
}


/*heading-styles////////////////////////////////////////////////////////////////////////////*/
.heading-page-01{
padding:0 .5em;
margin-top:1em;
font-family:'Rock Salt',cursive;
font-size:4rem;
color:#0F3632;
text-align:center;
}
.heading-page-01>em{
display:block;
margin:1em 0;
font-weight:700;
font-size:1.3rem;
font-family:"游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN","HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",serif;
}

.heading-section-01{
width:100%;
font-size:2.5rem;
font-weight:700;
overflow:hidden;
text-align:center;
}
.heading-section-01 span{
position:relative;
display:inline-block;
margin:0 2.5em;
padding:0 1em;
text-align:left;
}
.heading-section-01 span::before,.heading-section-01 span::after{
position:absolute;
top:.5em;
content:'';
width:100%;
height:.25em;
background-color:rgba(238,238,238,1);
}
.heading-section-01 span::before{right:100%;}
.heading-section-01 span::after{left:100%;}


.heading-section-02{
padding:.5em 0 .25em 0;
font-family:'Rock Salt',cursive;
font-size:2.5rem;
text-align:center;
color:#0F3632;
line-height:1.25em;
}
.heading-section-02>em{
display:block;
font-family:"游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN","HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",serif;
font-weight:700;
font-size:1.2rem;
}

.heading-section-03{
margin:0 0 1em 0;
padding:0 0 0 .25em;
font-size:2rem;
font-weight:700;
border-bottom:#EEE solid .25em;
color:#2D8D83;
text-align:center;
}
.heading-section-03 span{
display:block;
margin:1em 0;
font-size:1.2rem;
font-family:'Lora',serif;
vertical-align:middle;
}

.heading-section-04{
width:100%;
font-size:1.7rem;
font-weight:700;
color:#C00;
overflow:hidden;
text-align:center;
}
.heading-section-04 span{
position:relative;
display:inline-block;
margin:0 2.5em;
padding:0 1em;
text-align:left;
}
.heading-section-04 span::before,.heading-section-04 span::after{
position:absolute;
top:.5em;
content:'';
width:5em;
height:.25em;
background-color:#FEE;
}
.heading-section-04 span::before{right:100%;}
.heading-section-04 span::after{left:100%;}


.heading-section-05{
padding:1em 0;
font-size:1rem;
text-align:center;
background-color:#FFF;
}
.heading-section-05 span{
display:block;
margin:0 0 .5em 0;
font-family:'Rock Salt',cursive;
font-size:1.6rem;
}

/*lead-styles////////////////////////////////////////////////////////////////////////////*/
.lead-01{
font-size:2.5rem;
font-weight:700;
color:#FFF;
text-shadow:0 0 1px #FFF,0 0 1px #2D8D83,0 0 5px #2D8D83;
}
.lead-02{
padding:.5em 0;
font-weight:700;
font-size:2.1rem;
color:#2D8D83;
border-bottom:#EEE solid 5px;
}
.lead-03{
font-weight:700;
font-size:1.6rem;
}
.lead-04{
font-size:1.8rem;
line-height:2em;
font-weight:700;
text-align:center;
}
/*text-styles////////////////////////////////////////////////////////////////////////////*/
.text-01{line-height:2em;}

.text-02{
line-height:2em;
font-size:1.5rem;
}
.text-03{
display:block;
padding:.25em 0;
font-size:1.2rem;
text-align:right;
}

/*background-styles////////////////////////////////////////////////////////////////////////////*/
.bgclr01{
background: #a5e3dc;
background: -moz-linear-gradient(-45deg,  #a5e3dc 0%, #74c8bf 100%);
background: -webkit-linear-gradient(-45deg,  #a5e3dc 0%,#74c8bf 100%);
background: linear-gradient(135deg,  #a5e3dc 0%,#74c8bf 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a5e3dc', endColorstr='#74c8bf',GradientType=1 );
}

.bgclr02{
background: #f9f9f9;
background: -moz-linear-gradient(-45deg,  #f9f9f9 0%, #ffffff 50%, #f9f9f9 100%);
background: -webkit-linear-gradient(-45deg,  #f9f9f9 0%,#ffffff 50%,#f9f9f9 100%);
background: linear-gradient(135deg,  #f9f9f9 0%,#ffffff 50%,#f9f9f9 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f9f9f9', endColorstr='#f9f9f9',GradientType=1 );
}


/*メインメニュー*/
#nav-main-01{display:none;}
#nav-main-01 .menuList{}
#nav-main-01 .menuList li{
display:inline-block;
/*width:calc(100%/6); Edgeエラー対策のため*/
width:16.66%;
}
#nav-main-01 .menuList li a{
display:block;
padding:2em 0;
font-weight:700;
text-align:center;
color:#0F3632;
transition:color .2s ease-in;
}
#nav-main-01 .menuList li a:hover{color:#2D8D83;}
#nav-main-01 .menuList small{
display:block;
font-family:'Lora',serif;
}


#nav-main-03{
position:fixed;
top:3rem;
z-index:10;
width:100%;
height:100%;
background-color:#FFF;
display:none;
}
#nav-main-03 .menuList{margin:6rem 0 0 0;}
#nav-main-03 .menuList li{
display:inline-block;
width:50%;
}
#nav-main-03 .menuList li a{
display:block;
padding:.75em 2em;
font-weight:700;
text-align:center;
color:#2D8D83;
border-bottom:#EEE solid 1px;
}
#nav-main-03 .menuList li a:hover{
background-color:#2D8D83;
color:#FFF;
}
#nav-main-03 .menuList li a small{
display:inline-block;
margin-left:.5em;
font-size:1.2rem;
}


/*rightColumn********************************************/
#aside-sign-list{
padding:1em;
margin-top:3rem;
background-color:#F6F6F6;
}

.list-sign-01{}
.list-sign-01 li{margin:1em 0;}
.list-sign-01 li a:hover{opacity:.8}

/*bottomColumn********************************************/
#nav-main-02{}
#nav-main-02 .menuList{
padding-top:2rem;
display:flex;
align-items:center;
justify-content: center;
flex-wrap:wrap;
}
#nav-main-02 .menuList li{
padding:.5rem 0;
width:calc(100%/8);
text-align:center;
}
#nav-main-02 .menuList a{
color:#FFF;
font-size:1.2rem;
font-weight:700;
}
#nav-main-02 .menuList a:hover{color:#EEE;}

.copyright{
color:#FFF;
text-align:center;
}


a.anchor-generic-01{
display:block;
width:100%;
margin:1em auto;
padding:.75em 0;
background-color:#74C8BF;
color:#FFF;
font-size:1.5rem;
font-weight:700;
text-align:center;
}

a.anchor-generic-02{
display:block;
width:70%;
margin:1em auto;
padding:.75em 0;
background-color:#FFF;
border:#2D8D83 solid 1px;
color:#2D8D83;
font-family:'Anton',sans-serif;
/*font-family:'Lora',serif;*/
font-size:1.5rem;
text-align:center;
}
a.anchor-generic-03{
display:block;
width:100%;
margin:.25em 0; 
padding:.25em 0;
border:#FFF solid 1px;
font-family:'Anton',sans-serif;
font-size:1.5rem;
color:#FFF;
text-align:center;
}

a.anchor-generic-04{
position:fixed;
right:-7em;;
display:block;
width:10em;
padding:.5em 0;
background-color:#74C8BF;
background-color:#2D8D83;
color:#FFF;
transition:all .2s linear;
font-size:1.5rem;
font-weight:700;
}

a.anchor-generic-04 svg{margin:0 .5em;}

a.anchor-generic-04.ver01{bottom:6em;}
a.anchor-generic-04.ver02{bottom:9em;}
a.anchor-generic-04.hover{right:0;}

a.anchor-tel-01{
display:block;
margin:.25em 0;
font-size:3.5rem;
color:inherit;
}

/*パンクズ
#nav-breadcrumb{
display:none;
width:100%;
margin-top:1em;
overflow:hidden;
background-color:#FFF;
border:#EEE solid 1px;
font-size:1.3rem;
}
#nav-breadcrumb li{
line-height:1em;
display:inline-block;
}
#nav-breadcrumb a{
padding:.7em 1em .7em 3em;
text-decoration:none;
color:#FFF;
position:relative;
background-color:#2D8D83;
}
#nav-breadcrumb li:first-child a{padding-left:1.5em;}
#nav-breadcrumb a:after,
#nav-breadcrumb a:before{
content:"";
position:absolute;
top:50%;
margin-top:-1.5em;
border-top:1.5em solid transparent;
border-bottom:1.5em solid transparent;
border-left:1.5em solid;
}
#nav-breadcrumb a:after{
border-left-color:#2D8D83;
right:-1.5em;
z-index:3;
}
#nav-breadcrumb a:before{
border-left-color:#FFF;
right:-1.6em;
z-index:2;
}
#nav-breadcrumb a:hover{color:#FFF;}
#nav-breadcrumb strong{
padding:.7em 1em .7em 3em;
color:#333;
display:block;
}
*/

/*パンクズ*/
#breadcrumb{
display:flex;
margin:3rem 0;
padding:.25em 1em;
background-color:#F6F6F6;
list-style:none;
font-size:1.2rem;
}
#breadcrumb a{
font-weight:700;
}
#breadcrumb li:not(:last-of-type)::after {
content: "/";
margin:0 .6em; /* 記号の左右の余白 */
color: #777; /* 記号の色 */
}
#breadcrumb a{
color:#2D8D83;
}




/*注意事項*/
.section-caution{
box-sizing:border-box;
margin-top:2em;
padding:1em;
}
.section-caution .list-caution{
margin:1em 0;
list-style:none;
font-size:1.3rem;
}
.section-caution .list-caution li{margin:.25em 0;}
.section-caution .list-caution span{font-size:1rem;}
.section-caution em{color:#C00;}
.section-caution .list-caution .list-caution{margin-left:1em;}
.section-caution .list-caution .list-caution li{
display:inline-block;
font-size:1.2rem;
font-weight:400;
margin:0 1em 0 0;
}

/*料金図*/
.gateReceiptsGuide{
margin:1em 0;
padding:1em 2em;
text-align:center;
border:#999 solid 1px;
border-radius:.25em;
background-color:#FFF;
}
.gateReceiptsGuide h7{
font-size:1.6rem;
font-weight:700;
}
.gateReceiptsGuide h7 em{
display:block;
margin:.25em 0;
font-size:1.2rem;
color:#C00;
}
.gateReceiptsGuide ul{}
.gateReceiptsGuide ul span{
display:block;
margin:.5em 0;
padding:.5em 0;
text-align:center;
border:#999 solid 1px;
border-radius:.25em;
}







/*フレキシブルボックス新旧まとめ指定*******/
.flex01{/*フレキシブルボックス指定*/
display:-webkit-box;
display:-moz-box;
display:-ms-flexbox;
display:-webkit-flex;
display:flex;
/*内部要素横位置指定*/
-webkit-box-pack:start;
-moz-box-pack:start;
-ms-flex-pack:start;
-webkit-justify-content:flex-start;
justify-content:flex-start;
/*内部要素縦位置指定*/
-webkit-box-align:center;
-moz-box-align:center;
-ms-flex-align:center;
-webkit-align-items:center;
align-items:center;
}

/*背景イメージ置換*********************/
.imageReplace{
text-indent:100%;
white-space:nowrap;
overflow:hidden;
}
/*汎用ブロックリンク*/
.boxLink{position:relative;}
.boxLink>a{
display:block;
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
}


/*animation_styles////////////////////////////////////////////////////////////////////////////*/

/*点滅*/
@keyframes pulse{
from{opacity: 1.0;/*透明度100%*/}
to{opacity: .3;/*透明度80%*/}
}
@-webkit-keyframes pulse{
from{opacity: 1.0;/*透明度100%*/}
to{opacity: .3;/*透明度80%*/}
}
@-o-keyframes pulse{
from{opacity: 1.0;/*透明度100%*/}
to{opacity: .3;/*透明度80%*/}
}
.blinking{
animation-name: pulse;/* 実行する名前 */
animation-duration: .7s;/* 0.7秒かけて実行 */
animation-iteration-count:infinite;/* 何回実行するか。infiniteで無限 */
animation-timing-function:ease-in-out;/* イーズインアウト */
animation-direction: alternate;/* alternateにするとアニメーションが反復 */
animation-delay: 0s; /* 実行までの待ち時間 */

-webkit-animation-name: pulse;/* 実行する名前 */
-webkit-animation-duration: .7s;/* 0.7秒かけて実行 */
-webkit-animation-iteration-count:infinite;/* 何回実行するか。infiniteで無限 */
-webkit-animation-timing-function:ease-in-out;/* イーズインアウト */
-webkit-animation-direction: alternate;/* alternateにするとアニメーションが反復 */
-webkit-animation-delay: 0s; /* 実行までの待ち時間 */

-o-animation-name: pulse;/* 実行する名前 */
-o-animation-duration: .7s;/* 0.7秒かけて実行 */
-o-animation-iteration-count:infinite;/* 何回実行するか。infiniteで無限 */
-o-animation-timing-function:ease-in-out;/* イーズインアウト */
-o-animation-direction: alternate;/* alternateにするとアニメーションが反復 */
-o-animation-delay: 0s; /* 実行までの待ち時間 */
}