@import url('https://fonts.googleapis.com/css2?family=Forum&family=Noto+Sans+JP:wght@400;700&family=Roboto:wght@400;700&family=Shippori+Antique&display=swap');

/*------------------------------------------------------------------
reset
------------------------------------------------------------------*/
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,
blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,
b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,
hgroup,menu,nav,section,summary,time,mark,audio,video,main{
   margin: 0;
   padding: 0;
   border: 0;
   outline: 0;
   font-size: 100%;
   vertical-align: baseline;
   background-color: transparent;
}
table{
   border-spacing:0;
   border-collapse:collapse;
}
address{font-style: normal;}
cite {font-style: normal;}
/*------------------------------------------------------------------
common
------------------------------------------------------------------*/
@font-face{
   font-family:'Oleo Script';
   src:url(../resources/fonts/OleoScript-Regular.woff2) format('woff2');
   src:url(../resources/fonts/OleoScript-Regular.woff) format('woff');
   font-weight:400;
   font-style:normal;
   font-display:swap;
}
/*
html{
   overflow-x: hidden;
}
*/
.bf{
   font-family: 'Oleo Script', cursive;
   font-weight:400;
}
.yu{
   font-family: 'Yu Gothic Medium', '游ゴシック Medium', YuGothic, '游ゴシック体', 'ヒラギノ角ゴ Pro W3', sans-serif;
}
.yu-m{
   font-family: '游明朝体', 'Yu Mincho', YuMincho, 'ヒラギノ明朝 Pro', 'Hiragino Mincho Pro', 'MS P明朝', 'MS PMincho', serif;
}
body{
   width:100%;
   overflow-x: hidden;
   background-repeat:no-repeat;
   font-family:'roboto','Noto Sans JP','Hiragino Kaku Gothic Pro','ヒラギノ角ゴ Pro W3', 'Yu Gothic Medium', '游ゴシック Medium', YuGothic, '游ゴシック体', sans-serif;
   -webkit-font-smoothing:antialiased;
   -webkit-text-size-adjust:100%;
   -webkit-appearance:none;
}
.body-inner{
   overflow: hidden;
}
html{
   scroll-behavior:smooth;
}

*,*::before,*:after{
   box-sizing:border-box;
}

.z-index_1{
   position:relative;z-index:1;
}
.z-index_-1{
   position:relative;z-index:-1;
}
h1,h2,h3{
   position:relative;
}
h1,h2,h3, table th{
   font-weight:700;
   line-height:1.5em;
}
h1>span.sub{
   display: block;
   font-size: .8em;
   color:#817575;
   font-family: 'Forum', '游ゴシック', 'Yu Gothic', '游ゴシック体', 'YuGothic', sans-serif;
   opacity: 0;
   padding-top: 5px;
   line-height: 1.5em;
   font-weight: 500;
}
h2.standard>span{
   position: relative;
}
h2.standard>span::before{
   content: '';
   position: absolute;
   bottom: -12px;
   left: 50%;
   transform: translateX(-50%);
   width: 50%;
   height: 1px;
   background-color: #d3d3d3;
}
h2.standard>span::after{
   content: '';
   position: absolute;
   bottom: -12px;
   left: 25%;
   width: 10%;
   height: 2px;
   background-color: #32a38c;
}
h2>span.sub{
   display:block;
   font-size:.6em;
   margin-top:.8em;
   line-height:1.3em;
   color:#765e5e;
   font-weight:600;
   font-family: '游ゴシック', 'Yu Gothic', '游ゴシック体', 'YuGothic', sans-serif
}
h2.standard.left>span::before{
   left: 0;
   transform: unset;
   width: 50%;
   height: 1px;
   background-color: #d3d3d3;
}
h2.standard.left>span::after{
   left: 0;
   animation: h2-standard 2s forwards;
}
@keyframes h2-standard{
   0%{left: 0;}
 100%{left: 3%;}  
}
h3.standard{
   margin: 70px;
   border-bottom: solid 3px rgb(197, 197, 197);
   background-color: #f3f3f3;
   padding: 10px 10px 10px 24px;
   margin: 35px 0 20px -15px;
}
h3.standard:not(:first-of-type){
   margin: 50px 0 18px;
}
h3.standard::before{
   content: "";
   position: absolute;
   display: block;
   background-color: #8ec6ba;
   width: 9px;
   height: 25px;
   top: 50%;
   left: 0px;
   transform: translateY(-50%);
}
li{
   position:relative;
}
a img, button img{
   transition:.3s;
}
a:hover img, button:hover img{
   opacity:.8;
   transform:scale(1.01);
   transition:.3s;
}
p{
   margin:.8em 0;
}
.sticky-area{
   position:sticky;
   top:0;
   width:100%;
   overflow:hidden;
}
.contents-container{
   padding:0 15px 70px;
   background-color: #fff;
   position: sticky;
   z-index: 1;
}
.contents-container.with-top-img{
   margin-top: -60px;
   padding : 0 25px 100px;
   border-radius: 0 30px 0 0;
}
.contents-container main{
   max-width:1100px;
   margin: 0 auto;
   padding: 100px 0 30px;
}
span.url{
   word-break:break-all;
}
.clear{
   clear:both;
}
.to-works-link,.to-works-link:visited{
   color:#fff;
   display:block;
   text-decoration:none;
}
.announcement .toDetail{
   color:rgb(255,242,128);
   display:block;
   margin-top:5px;
}
.announcement:hover a{
   color:#fff;
}
.to-works-link:hover{
   background-position:initial;
}
.strong{
   color:rgb(255,242,128);font-size:18px;
}
.wp-block-columns{
   justify-content:center;
}
.read-more{
   color: #4a708f;
}
/*wordpress対応*/
.max-w-800>figure,
.max-w-800>img{
   max-width: 800px!important;
}
.max-w-700>figure,
.max-w-700>img{
   max-width: 700px!important;
}
.max-w-600>figure,
.max-w-600>img{
   max-width: 600px!important;
}
.max-w-500>figure,
.max-w-600>img{
   max-width: 500px!important;
}
.max-w-400>figure,
.max-w-400>img{
   max-width: 400px!important;
}
.max-w-300>figure,
.max-w-300>img{
   max-width: 300px!important;
}
.max-w-200>figure,
.max-w-200>img{
   max-width: 200px!important;
}
.center>figure,
img.center{
   display: flex!important;
   flex-direction: column;
   align-items: center;
}
figcaption{
   margin: 5px 0;
}
cite{
   font-style: italic;
   font-size: .9em;
   text-indent: 1em;
}
.pagination-atTop{
   margin: 50px 0 0 0;
}
.pagination-atBottom{
   margin: 40px 0 60px 0;
}
/*------------------------------------------------------------------
text関連
------------------------------------------------------------------*/
@font-face{font-family:'icons';
   src:url('../resources/fonts/icons.ttf?1mxb0t') format('truetype'),
       url('../resources/fonts/icons.woff?1mxb0t') format('woff'),
       url('../resources/fonts/icons.svg?1mxb0t#icons') format('svg');
   font-weight:400;
   font-style:normal;
   font-display: swap;
}
[class^="fa-"],[class*=" fa-"]{
font-family:'icons'!important;
speak:never;font-style:normal;
font-weight:400;
font-variant:normal;
text-transform:none;
line-height:1;
-webkit-font-smoothing:antialiased;
-moz-osx-font-smoothing:grayscale;
}
.fa-chevron-down:before{
content: '\e913';
}
a[target="_blank"]::after{
   font-family:"icons";
   content:'\e922';
   font-size:90%;
   margin:0 .3em 0 .3em;
   display: inline-block;
   text-indent: 0;
}
.icon-right{
   padding-left:.5em;
}
.icon-left{
   padding-right:.5em;
}
.icon-both{
   padding: 0.5em;
}
.bold-w{font-weight:700;}
.normal-w{font-weight:400;}
.f-size0_7{font-size:.7em;}
.f-size0_8{font-size:.8em;}
.f-size0_9{font-size:.9em;}
.f-size1_0{font-size:1em;}
.f-size1_1{font-size:1.1em;}
.f-size1_2{font-size:1.2em;}
.f-size1_3{font-size:1.3em;}
.f-size1_4{font-size:1.4em;}
.f-size1_5{font-size:1.5em;}
.f-size1_6{font-size:1.6em;}
.f-size1_7{font-size:1.7em;}
.f-size1_8{font-size:1.8em;}
.f-size1_9{font-size:1.9em;}
.f-size2_0{font-size:2em;}
.line-h1_5{line-height:1.5em;}
.line-h1_6{line-height:1.6em;}
.line-h1_7{line-height:1.7em;}
.line-h1_8{line-height:1.8em;}
.line-h1_9{line-height:1.9em;}
.line-h2_0{line-height:2em;}
.line-h2_5{line-height:2.5em;}
.line-h5_0{line-height:5em;}
.t-center{text-align:center;}
.large{font-size:1.2em}
.italic{font-style:italic;}
p{
   line-height:2em;
}
p.left{
   text-align:left;
}
.center{
   text-align:center;
}
.indent-1em{
   text-indent: -1em;
   padding-left:1em;
}
.indent-mini{
   padding-left:.8em;
}
@media screen and (max-width:599px){
   .indent-mini{
      padding-left:3%;
   }
}
mark.standard{
   background-color:transparent!important;
   background:linear-gradient(transparent 60%,#d0f5f9 0%);
   font-weight:700;
}
.cmt p.t1{
   padding-left:1em;
   text-indent:-1em;
}
.cmt p.t2{
   padding-left:1.8em;
   text-indent:-1.8em;
}
.cmt p.t1::before{
   content:"※";
}
span.gray{
   color:#8b8b8b;
}
/*-----------------------------------------------------------------------
input
-------------------------------------------------------------------------*/
input,textarea,button{
   font-family:'Roboto','Noto Sans JP','Hiragino Kaku Gothic Pro','ヒラギノ角ゴ Pro W3','游ゴシック','Yu Gothic','游ゴシック体','YuGothic',sans-serif;
   font-size:1rem;
   -webkit-appearance:none;
   appearance:none;
   border-radius:0;
}
select{
   font-family:'Roboto','Noto Sans JP','Hiragino Kaku Gothic Pro','ヒラギノ角ゴ Pro W3','游ゴシック','Yu Gothic','游ゴシック体','YuGothic',sans-serif;
   font-size:14px;
   border-radius:0;
}

input[type="radio"]+label{
   position:relative;
   padding-left:23px!important;
}
input[type="checkbox"]+label{
   position:relative;
   padding-left:30px!important;
}
input[type="radio"]+label::before{
   position:absolute;
   content:'';
   display:block;
   width:15px;
   height:15px;
   border-radius:50%;
   background:#fff;
   border:1px solid #bfbfbf;
   left:0;
   top: 50%;
   transform: translateY(-50%);
}
input[type="radio"]+label::after{
   position:absolute;
   content:'';
   display:block;
   width:9px;
   height:9px;
   border-radius:50%;
   background:#20c3ac;
   left:3px;
   top: 50%;
   transform: translateY(-50%);
   opacity:0;
   transition:.3s;
}
input[type="radio"]:checked+label::after{
   opacity:1;
}
input[type="checkbox"]+label::before {
   position: absolute;
   content: '';
   display: block;
   width: 20px;
   height: 20px;
   background: #fff;
   border: 1px solid #bfbfbf;
   left: 0;
   top: 50%;
   transform: translateY(-50%);
}
input[type="checkbox"]+label>span::before {
   position: absolute;
   content: '';
   display: block;
   width: 3px;
   height: 7px;
   background: #20c3ac;
   left: 6px;
   top: calc(50% + 2px);
   transform: translateY(-50%) rotate(-39deg);
   opacity: 0;
   transition: .3s;
}
input[type="checkbox"]+label>span::after {
   position: absolute;
   content: '';
   display: block;
   width: 3px;
   height: 13px;
   background: #20c3ac;
   left: 11px;
   top: 50%;
   transform: translateY(-50%) rotate(31deg);
   opacity: 0;
   transition: .3s;
}
input[type="checkbox"]:checked+label>span::before,
input[type="checkbox"]:checked+label>span::after{
   opacity:1;
}

input[type="checkbox"]:hover,
input[type="checkbox"]+label:hover,
input[type="radio"]:hover,
input[type="radio"]+label:hover,
select:hover{
   cursor:pointer;
}
input[type="text"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
textarea:focus{
   outline:none;
   box-shadow:inset 1px 1px 1px #8eafaf,inset -1px -1px 1px #8eafaf;
}
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="password"]:focus,
textarea,
select{
   border:none;
   background-color:#ecf3f5;
   ;
   padding:.7em;
   width:100%;
}
textarea{
   height:15em;
   overflow:auto;
   resize:vertical;
}
button[type="submit"]{
   background-color:rgb(5 12 34);
   color:#fff;
   font-weight:700;
   box-shadow:0 3px 5px rgba(0,0,0,.7);
   padding:0 5px 0 5px;
}
button{
   cursor:pointer;
   border:none;
}
/*-----------------------------------------------------------------------
linkBtn
-------------------------------------------------------------------------*/
.linkBtn{
   position:relative;
}
.linkBtn span{
   position:relative;
   z-index:3;
   color:#fff;
}
.linkBtn:hover span,.linkBtn:hover span::before{
   color:#fff;
}
.linkBtn::before{
   content:'';
   position:absolute;
   top:0;
   left:0;
   z-index:2;
   background-color:rgba(255,255,255,.2);
   width:100%;
   height:100%;
   transition:transform .6s cubic-bezier(.8,0,.2,1) 0s;
   transform:scale(0,1);
   transform-origin:right top;
}
.linkBtn::after{
   content:'';
   position:absolute;
   bottom:8px;
   right:8px;
   border-top:7px solid transparent;
   border-right:7px solid #fff;
}
.linkBtn:hover::before{
   transform-origin:left top;
   transform:scale(1,1);
}
input[type="submit"]:hover,input[type="button"]:hover,button[type="submit"]:hover{
   opacity:.8;
   cursor:pointer;
   transition:.5s all;
}
.num-msg{
   position: relative;
   display: inline-block;
   width: auto;
   height: auto;
   margin: 0!important;
   background-color:rgb(70,81,100);
   color:#fff;
   z-index:10;
}
.num-msg.err{
   background-color:rgb(148,32,32);
}

/*-----------------------------------------------------------------------
responsive
-------------------------------------------------------------------------*/
html{
   font-size:16px;
   line-height:1.7em;
}
@media screen and (max-width:1024px){
   .f-size1_5-tb{
      font-size:1.5rem!important;
   }
   .f-size1_4-tb{
      font-size:1.4rem!important;
   }
   .f-size1_3-tb{
      font-size:1.3rem!important;
   }
   .f-size1_2-tb{
      font-size:1.2rem!important;
   }
   .f-size1_1-tb{
      font-size:1.1rem!important;
   }
   .f-size1_0-tb{
      font-size:1.0rem!important;
   }
}
@media screen and (max-width:599px){
   .f-size1_5-sp{
      font-size:1.5rem!important;
   }
   .f-size1_4-sp{
      font-size:1.4rem!important;
   }
   .f-size1_3-sp{
      font-size:1.3rem!important;
   }
   .f-size1_2-sp{
      font-size:1.2rem!important;
   }
   .f-size1_1-sp{
      font-size:1.1rem!important;
   }
   .f-size1_0-sp{
      font-size:1.0rem!important;
   }
}
@media screen and (max-width:1024px){
   .del-tb{
      display:none!important;
   }
}
@media screen and (max-width:767px){
   .del-767{
      display:none!important;
   }
}
@media screen and (max-width:599px){
   .del-sp{
      display:none!important;
   }
}
@media screen and (max-width:375px){
   .del-spMini{
      display:none!important;
   }
}
@media screen and (min-width:376px){
   .for-spMini{
      display:none!important;
   }
}
@media screen and (min-width:600px){
   .for-sp{
      display: none!important;
   }
}
@media screen and (min-width:768px){
   .for-768{
      display: none!important;
   }
}
@media screen and (min-width:1025px){
   .for-tb{
      display: none!important;
   }
}
.for-spDesc{
   display:none;
}
.align-change{
   text-align: center;
}
.align-change::after{
   left: 50%;
   transform: translateX(-50%);
   width: 30%;
}
.center, .align-change{
   text-align: center;
}
img{
   max-width: 100%;
   height: auto;
   vertical-align:top;
}
@media screen and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: .001dpcm) {
   body {
       image-rendering: -webkit-optimize-contrast;
   }
}

.flexbox-center{
   display: flex;
   justify-content: center;
   flex-wrap: wrap;
   align-content: center;
}
.grid{
   display: grid;
}
.grid.auto-fill{
   grid-template-columns:repeat(auto-fill,minmax(500px,1fr));
}
.grid.auto-fill{
   grid-template-columns:repeat(auto-fit,minmax(500px,1fr));
}
/*-----------------------------------------------------------------------
breadcrumbs
-------------------------------------------------------------------------*/
.breadcrumbs{
   display:flex;
   color: #333;
   font-size: 14px;
   align-items:center;
   margin-top: 60px;
   line-height:.8em;
   padding: 3.5px 0 2px;
   overflow-x:auto;
   word-break:keep-all;
   white-space:nowrap;
   -webkit-overflow-scrolling:touch;
   position: relative;
   z-index: 1;
}
.breadcrumbs>ul{
   display:flex;
   width:1200px;
   padding:.4em 15px .4em 25px;
}
.breadcrumbs li a{
   color: #333!important;
   text-decoration:underline;
}
.breadcrumbs li a:hover{
   opacity: .8;
   transition: .3s;
}
.breadcrumbs li:not(:first-child){
   position:relative;
   margin-left:2em;
}
.breadcrumbs li:not(:first-child)::before{
   content:" > ";
   position:absolute;
   top:0;
   left:-1.3em;
}
/*-------------------------------------------------
accordion
---------------------------------------------------*/
.include-accordion button{
   display:block;
   position:relative;
   width:100%;
   background-color:inherit;
   text-align:left;
   padding:10px;
}
.include-accordion button:hover{
   background-color:rgb(194,209,211);
}
.include-accordion button::before,.include-accordion button::after{
   content:"";
   position:absolute;
   top: 50%;
   width:2px;
   height:8px;
   background-color:#878787;
   transition:.5s;
}
.include-accordion button::before{
   transform: translateY(-50%) rotate(-45deg);
   right:210px;
}
.include-accordion button::after{
   right:204px;
   transform: translateY(-50%) rotate(45deg);
}
.include-accordion li.active button::before{
   transform: translateY(-50%) rotate(-135deg);
   transition:.5s;
}
.include-accordion li.active button::after{
   transform: translateY(-50%) rotate(135deg);
   transition:.5s;
}
.scroll-control.active{
   overflow-y:auto;
}
.include-accordion ul{
   height:0;
   padding:0;
   overflow:hidden;
   transition:.5s;
   background-color:transparent;
   margin:0;
}
.include-accordion>li{
   border-bottom:1px solid #cbcbcb;
}
.include-accordion li.active button{
   border-bottom:1px solid #cbcbcb;
}


/*-----------------------------------------------------------------------
blogs-list
-------------------------------------------------------------------------*/
.blogs-list.at-bottom{
   width:100%;
}
.blogs-list.at-bottom .include-accordion{
   width:100%;margin:0 auto;
}
.blogs-list.at-bottom a{
   padding:.5em 1em;
   text-decoration:none;
   color:#54687c;
   transition:.3s;
   display: block;
}
.blogs-list.at-bottom a:hover{
   color:#333;
   background-color:rgb(226,237,238);
   transition:.3s;
}
.blogs-list.at-bottom ul{
   background-color:#fdfdfd;
}

.blogs-list.at-bottom button{
   border-top:1px solid #cbcbcb;
   background-color:#cfcfcf;
   color:#333;
}
.include-accordion button::before{
   right:initial;
   left:170px;
}
.include-accordion button::after{
   right:initial;left:175px;
}
.search-box{
   display:flex;
   flex-wrap:nowrap;
   padding:3px;
}
#searchform button[type="submit"]{
   background-color:rgb(53,55,58);
   color:#fff;
   font-weight:400;
   box-shadow:none;
   width:72px;
}
#searchform{
   width:100%;
}
.search-box-inner{
   text-align:center;
   width:300px;
}

/*-------------------------
pagination
---------------------------*/
ul.page-numbers{
   display:flex;
   justify-content:center;
   gap:8px;
   margin:15px 0;
}
a.page-numbers{
   display: block;
   color:#fff!important;
   background-color:rgb(202,202,202);
   width:30px!important;
   height:30px!important;
   line-height:30px!important;
   text-align:center!important;
   transition:.3s;
}
.page-numbers.current{
   display: block;
   color:#fff;
   background-color:rgb(78,78,78);
   width:30px!important;
   height:30px!important;
   line-height:30px!important;
   text-align:center!important;
}
a.page-numbers:hover,.blogs-list a.page-numbers:hover{
   background-color:#8d8d8d;
   transition:.3s;
}

/*-----------------------------------------------------------------------
textLink
-------------------------------------------------------------------------*/
a{
   text-decoration:none;
   color: #246ab1;
   word-break: break-all;
}
a.textLink, p a,figcaption a ,a.textLink:visited ,p a:visited ,figcaption a:visited{
   text-decoration: underline;
   padding: 0 .3em;
   position: relative;
}
a.textLink::after{
   text-decoration:none;
}
a.textLink, p a, .blog main a:not(.blog main .toc-container a, .atBlog a .blog main .share a){
   transition:.3s;
   background-image:linear-gradient(to right,rgba(0,0,0,0) 50%,rgb(219,230,230) 50%);
   background-position:0 0;
   background-size:200% auto;
}
a.textLink:hover,p a:hover{
   background-position:-100% 0;
   color:#3d6baf;
}
dl.ref dt{
   font-weight: bold;
}
.ref{
   position: relative;
}
.ref>a::before,
a.ref::before{
   content: url(/wp-content/themes/bf-official/images/icons/right-arrow-simple-b.svg);
   transition: .3s;
   margin-right: 5px;
   transform: translate(0, -1px);
   display: inline-block;
}
.ref>a:hover::before,
a.ref::hover::before{
   transform: translate(2px, -1px);
}
dl.ref .textLink::before{
   content: url(/wp-content/themes/bf-official/images/icons/right-arrow-simple-b.svg);
   transition: .3s;
   margin-right: 5px;
   transform: translateY(-1px);
   display: inline-block;
}
th a{
   font-weight:400;
}
sup a.textLink,sup a.textLink:visited{
   color:#ff7474;
   text-decoration:none;
}
address a{
   color:#333;
}
@media (min-width:600px){
   a[href*="tel:"]{
      pointer-events:none;
      cursor:default;
   }
}
.view-more{
   position:relative;
   padding:5px 22px 3px 6px;
   border-bottom: 1px solid #000;
   transition:.5s;
   color:#333;
}
.view-more:hover::after{
   transform:translateX(3px);
   transition:.5s;
   border-right:6px solid #46b6b0;
}
.view-more:hover{
   color:rgb(70,182,176);
}
.view-more:hover::after{
   border-right:6px solid rgb(70,182,176);
}
.view-more:hover{
   border-bottom:1px solid rgb(70,182,176);
}
.view-more::after{
   content:'';
   position:absolute;
   bottom:10px;
   right: 6px;
   border-top:6px solid transparent;
   border-right:6px solid #333;
   z-index:1;
   transition:.5s;
}
.atBlog .view-more {
   padding:5px 22px 6px 0;
}
p.large-margin{
   margin:50px 0
}
p.note, span.note{
   padding-left: 1.5em!important;
   text-indent: -1.2em;
   line-height: 1.5em;
}
span.note{
   display:inline-block
}
a.picLink:hover img{
   opacity:.7;
   transform:scale(1.01);
   transition:.2s;
}
a.picLink img{
   width:100%;
   height:auto;
   transition:.2s;
}
.right-arrow-s{
   position:relative;
   text-align:center;
   width: 250px;
   border: 1px solid #000;
   padding: 17px 37px 17px 20px;
   color: #000;
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: 18px;
}
.right-arrow-s::after{
   position: absolute;
   content: url('/wp-content/themes/bf-official/images/icons/right-arrow-s.svg');
   right: 17px;
   transform: translateY(-50%) scale(.8);
   top: calc(50% - 2px);
   transition: .3s;
}
.right-arrow-s:hover::after{
   right: 14px;
}
.right-arrow-s:hover{
   background-color: #fefff7;
}
/*-----------------------------------------------------------------------
見出し
-------------------------------------------------------------------------*/
.page-top-wrapper {
   margin-top: -88px;
   height: 60vh;
   width: 100%;
   position: sticky;
   top: 0;
   transition:.3s;
}
.page-top-img-wrapper {
   overflow: hidden;
}
.page-top-img-wrapper img {
   width: 100%;
   height: 60vh;
   object-fit: cover;
   transition: .5s;
   transform: translateY(0);
}
.page-top-wrapper::after {
   content: "";
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background: linear-gradient(to right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, .7) 40%, rgb(191 213 175 / 40%) 70%, rgb(223 213 96 / 40%) 100%);
}
#mainVisual-overlay {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background-color: #000;
   z-index: 10;
   opacity: 0;
   transition: .3s;
   visibility: hidden;
}
h1{
   font-size: 35px;
   max-width: 1100px;
   margin: 0 auto 60px;
   padding: 0 30px 20px;
   z-index: 1;
}
.page-top-wrapper h1{
   margin: 0 auto 60px;
   position: absolute;
   top: 54%;
   transform: translate(-50%, -50%);
   left: 50%;
   width: 100%;
   padding: 0 40px 20px;
}
.page-top-wrapper h1::before {
   content: '';
   position: absolute;
   top: -8px;
   left: 12px;
   width: 12px;
   height: 12px;
   background-color: rgba(101, 221, 211, 0.3);
}
.page-top-wrapper h1::after {
   content: '';
   position: absolute;
   top: -17px;
   left: 21px;
   width: 12px;
   height: 12px;
   background-color: rgba(50, 163, 140, 0.3);
}
.contents-container h1{
   padding: 0 0px 20px;
}

.sub.line::before {
   position: absolute;
   content: "";
   display: block;
   border-top: 1px solid #aba6a6;
   width: 100%;
   top: 3px;
}
h2.enFont2{
   font-size:1.7rem;
   padding-left:0;
   color:#912716;
}
h2.lines-both-sides{
   position:relative;
   display:inline-block;
   text-align:center;
   width:100%;
}
h2.lines-both-sides::before, .lines-both-sides::after{
   content:'';
   margin-bottom:.3em;
   display:inline-block;
   width:20%;
   height:1px;
   background-color:#000;
}
h2.lines-both-sides::before{
   margin-right:20px;
}
h2.lines-both-sides::after{
   margin-left:20px;
}
h2.lines-sub{
   position:relative;
   border-top:2px solid #333;
   border-bottom:1px solid #333;
   text-align:center;
   padding:1.5em 1em 1em;
   margin:60px 0 40px 0;
}
h2.lines-sub::before{
   position:absolute;
   width:200px;
   padding: 0px 0 1px;
   color:#fff;
   border-radius:10px;
   top:calc(50% - 45px);
   left:50%;
   transform:translate(-50%, -50%);
   z-index:2;
}
h2.lines-sub::after{
   position:absolute;
   content:"";
   width:220px;
   height:30px;
   background-color:#fff;
   top:calc(50% - 45px);
   left:50%;
   transform:translate(-50%, -50%);
}
h2.square-bracket{
   text-align:center;
   width:70%;
   margin:70px auto 35px!important; 
}
h2.square-bracket::before,.square-bracket::after{
   content:'';
   position:absolute;
   display:inline-block;
   width:20px;height:20px;
}
h2.square-bracket::before{
   border-left:solid 1px #000;
   border-top:solid 1px #000;top:0;
   left:0;
}
h2.square-bracket::after{
   border-right:solid 1px #000;
   border-bottom:solid 1px #000;
   bottom:0;
   left:calc(100% - 20px);
}
.blog p.cat,
p.cat{
   position: absolute;
   background-color: rgba(255, 255, 255, .8);
   color: #464646;
   background-color: #fff;
   border: 1px solid #ccc;
   display: inline-block;
   padding: 0px 8px!important;
   line-height: 20px;
   font-weight: 600;
   font-size: 14px;
   right: -3px;
   top: -11px;
   margin: 0!important;
}
/*---------------------------------------------------
animation
----------------------------------------------------*/
.fade {
   opacity: 0;
  } 
.fade.displayed {
   animation: fade 1s ease-in-out forwards;
}
@keyframes fade{
   0%{ opacity: 0;}
 100%{ opacity: 1;}
}
.parallax{
   transition: .7s;
}
.parallaxLeft, .parallaxRight{
   position: relative;
}
.parallaxLeft::before,
.parallaxRight::before{
   content: "";
   position: absolute;
   top: 0;
   width: 100%;
   height: 100%;
   background-color: #fff;
}
.parallaxLeft.displayed::before{
   left: 0;
}
.parallaxRight.displayed::before{
   right: 0;
}
.parallaxLeft.displayed::before,
.parallaxRight.displayed::before{
   animation: parallax 1s ease-in-out forwards;
}
@keyframes parallax{
    0%{ opacity: 1; width: 100%;}
   30%{ opacity: 1;}
  100%{ opacity: 0; width: 0;}
}
.fadeInLeft {
   transform: translateX(-20px);
   opacity: 0;
}
.fadeInLeft.displayed {
   animation: fadeInLeft 2s cubic-bezier(0.1, 0.8, 0.2, 1.0) forwards;
}
@keyframes fadeInLeft{
   0%{ opacity: 0; transform: translateX(-20px);}
 100%{ opacity: 1; transform: translate(0);}
}
.fadeInRight {
   transform: translateX(20px);
   opacity: 0;
}
.fadeInRight.displayed {
   animation: fadeInRight 2s cubic-bezier(0.1, 0.8, 0.2, 1.0) forwards;
}
@keyframes fadeInRight{
   0%{ opacity: 0; transform: translateX(20px);}
 100%{ opacity: 1; transform: translate(0);}
}
.fadeUp{
  transform: translateY(30px);
  opacity: 0;
}
.fadeUp.displayed {
   animation: fadeUp 2s cubic-bezier(0.1, 0.8, 0.2, 1.0) forwards;
}
@keyframes fadeUp{
   0%{ opacity: 0; transform: translateY(30px);}
 100%{ opacity: 1; transform: translateY(0);}
}

.displayed:not(.t-02) span.char {
   animation: fade 1s ease-out forwards;
}
.textAnima.displayed span.sub{
   animation:fadeUpText 1s ease-out forwards;
}
@keyframes fadeUpText{
     0%{opacity:0;transform:translateY(10px)}
    30%{opacity:0;transform:translateY(10px)}
   100%{opacity:1;transform:translateY(0)}
}

.t-02,
.t-02 span{
   opacity: 0;
}
.t-02.displayed{
   opacity: 1;
}
.t-02.displayed span.char{
   animation: flash .1s ease-out forwards;
   display:inline-block;
}
@keyframes flash{
   0%{ opacity: 0}
 100%{ opacity: 1}
}
.delay-01.displayed{animation-delay: 0.1s;}
.delay-02.displayed{animation-delay: 0.2s;}
.delay-03.displayed{animation-delay: 0.3s;}
.delay-04.displayed{animation-delay: 0.4s;}
.delay-05.displayed{animation-delay: 0.5s;}
.delay-06.displayed{animation-delay: 0.6s;}
.delay-07.displayed{animation-delay: 0.7s;}
.delay-08.displayed{animation-delay: 0.8s;}
.delay-09.displayed{animation-delay: 0.9s;}
.delay-10.displayed{animation-delay: 1.0s;}
.delay-11.displayed{animation-delay: 1.1s;}
.delay-12.displayed{animation-delay: 1.2s;}
.delay-13.displayed{animation-delay: 1.3s;}
.delay-14.displayed{animation-delay: 1.4s;}
.delay-15.displayed{animation-delay: 1.5s;}
.delay-16.displayed{animation-delay: 1.6s;}
.delay-17.displayed{animation-delay: 1.7s;}
.delay-18.displayed{animation-delay: 1.8s;}
.delay-19.displayed{animation-delay: 1.9s;}
.delay-20.displayed{animation-delay: 1.0s;}

a.list{
   display:block;
   width:100%;
}
.inline{
   display:inline-block;
}
.order-01{ order:1 }
.order-02{ order:2 }
/*-----------------------------------------------------------------------
ul, ol
-------------------------------------------------------------------------*/
ul, ol{
   list-style-type:none;
}
ul.standard, ol.standard{
   padding:.1em 0 .1em 2.5em;
   list-style-type: none!important;
   margin: 11px 0;
   line-height: 2em;
}
.standard.wide{
   padding:20px 0 20px 50px;
}
ul.standard li>ul,ol.standard li>ul{
   padding:1em 0 .1em 3em;
}
ul.standard li{
   position:relative;
   text-indent:-.36em;
}
ul.standard.line-h-s li{
   line-height: 1.3em;
}
table ul.standard li{
   text-indent:0em;
}
ul.standard li:not(:nth-of-type(1)){
   margin-top:.4em;
}
ul.standard li::before{
   content:"";
   display:inline-block;
   position:relative;
   top:-.2em;
   left:-10px;
   width:6px;
   height:6px;
   border-radius:50%;
   background-color:#d77853;
}
ul.standard li li::before{
   content: "";
   position: absolute;
   top: calc(50% + -2px);
   transform: translate(-50%);
   left: -17px;
   width: 6px;
   height: 2px;
   border-radius: 0;
   background-color:#d77853;
}

ol.standard ol{
   padding:.5em 0em .5em 1.5em;
}
ol.standard li{
   position:relative;
   counter-increment:FirstNode;
   padding-inline-start:1em;
}
ol.standard li li{
   counter-increment:SecondNode;
   padding-inline-start:1em;
}
ol.standard li:not(ul>li):nth-of-type(-n + 9)::before{
   position:absolute;
   content:counter(FirstNode);
   font-weight:700;
   font-style: italic;
   color:#ef817c;
   left: -18px;
   top:-1px;
   font-size:1.2em;
}
ol.standard li:not(ul>li):nth-of-type(n + 10)::before{
   position:absolute;
   content:counter(FirstNode);
   font-weight:700;
   font-style: italic;
   color:#ef817c;
   left:-27px;
   top:-1px;
   font-size:1.2em;
}
ol.standard.s-01 li:not(ul>li):nth-of-type(-n + 9)::before{
   font-style:normal;
   color:#ef817c;
   left:-19px;
   top:-1px;
   font-size:1.2em;
}
ol.standard.s-01 li:not(ul>li):nth-of-type(n + 10)::before{
   font-style:normal;
   color:#ef817c;
   left:-30px;
   top:-1px;
   font-size:1.2em;
}
ol.standard li:not(ul>li)::after{
   content: '.';
   color:#ef817c;
   position:absolute;
   left: -5px;
   top: -2px;
   font-size: 1.5em;
}
ol.standard.s-01 li:not(ul>li)::after{
   content: '|';
   color:#df998e;
   left:1px;
   width: 1px;
   height: 1em;
   font-size:1.2em;
}
ol.standard li li:not(ul>li)::before, ol.standard.s-01 li li:not(ul>li)::before{
   content:counter(FirstNode) '. ' counter(SecondNode);
   position:absolute;
   left:-40px!important;
}
ul.standard.note li::before{
   content:"※";
   top:0;
   left:-21px;
   width:0;
   height:0;
   border-radius:0;
   background-color:transparent;
}
ul.standard.note li{
   text-indent:0em;
}
/*-----------------------------------------------------------------------
date
-------------------------------------------------------------------------*/
.date dl{
   display:flex;
   flex-direction:row;
   justify-content:flex-end;
   font-size:.9rem;
   margin:5px 10px 10px 10px;
   gap: 25px;
}
.date dt{
   width:auto;
   text-align:left;
   font-weight:400;
   padding:0 3px 0 0;
}
.date dd{
   width:auto;
   border:none;
}
.date div{
   display: flex;
}
div.update{
   position: relative;
}
div.update::before{
   position: absolute;
   content:"/";
   font-size: 14px;
   top: calc(50% - 1px);
   left: -14px;
   transform: translateY(-50%);
}
.preparing-link{
   position:relative;
   color:rgb(187,187,187)!important;
}
.preparing-link .msg{
   display:none;
   position:absolute;
   z-index:10000;
}
.preparing-link .msg::after{
   content:"";
   position:absolute;
   left:100px;
   bottom:-12px;
   border-top:15px solid rgb(230,230,230);
   border-right:10px solid transparent;
   border-left:10px solid transparent;
}
.preparing-link:hover .msg{
   text-align:center;
   display:inline-block;
   line-height:1.6em;
   padding:15px;
   width:270px;
   top:-90px;
   left:20px;
   border-radius:3px;
   background-color:rgb(230,230,230);
   color:#000;
}

/*-----------------------------------------------------------------------
table
-------------------------------------------------------------------------*/
table.simple{
   margin:0 auto;
   width:100%;
}
table.simple tr{
   border-bottom:1px solid #b7b7b7;
}
table.simple th{
   text-align:left;
   font-weight:700;
   padding: 15px 20px;
}
table.simple td{
   width:auto;
   padding:.8em 25px;
   line-height:1.6;
}
table.simple{
   border-top:1px solid #b7b7b7;
}
main table.simple ul{
   margin:0;
   padding:7px 0 7px 20px;
}

table.standard{
   width :100%;
}
.standard thead th{
   background-color: #3f626b;
   color : #fff;
 }
.standard th{
   background-color: #3f626b;
   color : #fff;
   font-weight: normal!important;
   text-align: left;
 }

 .standard th, .standard td{
   padding: 5px 10px;
   border: 1px solid rgb(180, 180, 180);
 }
table.standard a{
   color: #fff;
}
table.standard a:hover{
   color: rgb(231, 231, 231)!important;
}

table.multi{
   table-layout:fixed;
   width:100%;
   text-align: left;
   border-collapse:collapse;
   border-spacing:0;
   margin:0 auto;
   box-sizing:initial;
   border:solid 1px #ccc;
}

table.multi thead th{
   /*background-color:#102d3a;*/
   background-color:#203032;
   color: #fff;
}
table.multi tr{
   background-color:#fff;
}
table.multi tr:not(:last-of-type){
   border-bottom:solid 1px #ccc;
}
table.multi.stripes tr:nth-child(odd){
   background-color:#fff;
}
table.multi.stripes tr:nth-child(even){
   background-color:#f7f7f7;
}
table.multi th{
   padding:10px;
   background-color:#eef3f3;
}
table.multi tr>th:first-child{
   text-align:left;
   border-right:solid 1px #ccc;
}
table.multi thead th:first-child{
   border-right:none;
}

table.multi td{
   padding:10px;
   color:#121a04;
   vertical-align:middle;
}

table.multi th:nth-of-type(1){
   width:200px;
}
.reference{
   color:#bd3434!important;
   font-weight:700;
   text-decoration:none!important;
}
span.fa-external-link-alt{
   margin:0 5px;
}
.border-right{
   border-right:solid 1px #ccc;
}

.low table th:not(thead th),
.low table td{
   padding: 1px 7px 0!important;
}

/*-----------------------------------------------------------------------
other documents
-------------------------------------------------------------------------*/
dl.standard{
   border-top: 1px dotted #ccc;
   border-bottom: 1px dotted #ccc;
}
dl.standard dt {
   width: 100%;
   padding: 10px 0 0;
   font-weight: bold;
}
dl.standard dd {
   width: 100%;
   padding: 0 0 5px 0;
}
dl.standard dt:not(:first-of-type) {
   border-top: 1px dotted #ccc;  
}
dl.tips{
   position:relative;
   background-color: #e6ecef;
   padding:10px 40px 10px 46px;
   border-radius:5px;
   transition:.5s;
}
dl.tips dt{
   font-weight:700;
   text-align:left;
   padding:10px 15px 0 25px;
}
dl.tips dd{
   margin:auto 0 auto 1em;
   padding:.5em 0 .5em .5em;
}
dl.tips dd::before{
   position:absolute;
   font-family:"icons",sans-serif;
   content:"\e902";
   top:50%;
   transform:translateY(-50%);
   left:15px;
   font-size:1.5rem;
   color:#516a62;
}
dl.tips dd::after{
   position:absolute;
   content:"";
   top:10px;
   bottom:10px;
   width:1px;
   left:50px;
   background-color:#8fa59e;
}
dl.tips.closed{
   display:block;
   height:150px;
   overflow-y:hidden;
   transition:.5s;
}
dl.tips.closed::after{
   content:"";
   position:absolute;
   top:66%;
   left:50%;
   transform:translate(-50%);
   border-radius:0 0 5px 5px;
   width:100%;
   height:51px;
   background:linear-gradient(rgba(236, 236, 236, 0.1),rgb(236,236,236, .3),rgb(236,236,236, .5),rgb(236,236,236, .9),rgb(236,236,236, 1))
}
dl.tips+button{
   position:absolute;
   display:flex;
   align-items:center;
   justify-content:center;
   font-size:20px;
   line-height:20px;
   bottom:0;
   left:50%;
   transform:translate(-50%);
   background-color:rgba(0,0,0,.5);
   color:#fff;
   border-radius:5px;
   width:110px;
   height:25px;
   z-index:2;
   transition:.5s;
}
dl.tips+button>span{
   position:relative;
}
dl.tips+button>span::before{
   content:"";
   position:absolute;
   transition:.5s;
   top:50%;
   left:-3px;
   transform:translateY(-50%) rotate(-135deg);
   width:2px;
   height:10px;
   background-color:#fff;
}
dl.tips+button>span::after{
   content:"";
   position:absolute;
   transition:.5s;
   top:50%;
   left:3px;
   transform:translateY(-50%) rotate(135deg);
   width:2px;
   height:10px;
   background-color:#fff;
}
dl.tips.closed+button>span::before{
   transform:translateY(-50%) rotate(-45deg);
   transition:.5s
}
dl.tips.closed+button>span::after{
   transform:translateY(-50%) rotate(45deg);
   transition:.5s;
}
dl.tips.closed+button{
   transition:.5s;
}
dl.tips+button:hover{
   opacity:.7;
   transition:.5s;
}
p.code{
   background-color: #3e3e3e;
   color: #fff!important;
   padding: 7px 20px!important;
   border-radius: 3px;
   font-family: Menlo,Consolas,'DejaVu Sans Mono',monospace;
  }
code{
   overflow-x:auto;
   padding:3px 5px;
   border-radius:2px;
   margin:0 5px;
   color:rgb(70, 70, 70);
   font-family:Menlo,Consolas,'DejaVu Sans Mono',monospace;
   font-size:14px;
   line-height:1.6em;
}
code:not(pre>code){
   background-color:#e3e3e3;
}
pre{
   background-color:#eee;
   padding:1em;
   border-radius:2px;
   border:solid 1px #dbdbdb;
   color:#54687c;
   font-family:Menlo,Consolas,'DejaVu Sans Mono',monospace;
   white-space:pre-wrap;
   word-break:break-all;
}
pre ol{
   padding:1em 1em 1em .5em;
}
address.tel{
   margin-top:37px;
   font-size:46px;
   font-style:normal;
   color:#333;
}
#reception-time{
   margin-top:15px;
}
.search-highlight{
   font-weight:700;
   background:linear-gradient(transparent 0%,#d0f5f9 0%);
}
blockquote{
   position: relative;
   background-color: #eff1f1;
   border: 1px solid #ccc;
   padding: 10px 20px;
   margin: 30px 0;
}
blockquote::before,
blockquote::after{
   display: block;
   font-family: 'icons';
   font-size: 25px;
   color: #95a1a7;
}
blockquote::before{
   content: '\e924';
   text-align: left;
}
blockquote::after{
   content: '\e925';
   text-align: right;
}
blockquote p{
   margin: 0.8em 0 10px!important;
}
cite{
   display: inline-block;
   margin: .8em 0;
}
.gmap-container {
   width: 100%;
   margin: 35px auto 50px;
/* clip-path: inset(0 round 30px); 角丸を付ける場合*/
}
#gmap {
   height: 0;
   overflow: hidden;
   padding-bottom: 56.25%;
   position: relative;
   }
#gmap iframe {
   position: absolute;
   left: 0;
   top: 0;
   height: 100%;
   width: 100%;
}
/*********************************************************************************
1024px
**********************************************************************************/
@media screen and (max-width: 1024px){
   table.color{
      overflow-x:scroll;
   }
}
.max-w-800>figure,
.max-w-800>img{
   max-width: 100%!important;
}
/*********************************************************************************
767px
**********************************************************************************/
@media screen and (max-width: 767px){
.max-w-700>figure,
.max-w-700>img{
   max-width: 100%!important;
}
}
/*********************************************************************************
599px
**********************************************************************************/
@media screen and (max-width: 599px){
body{position:initial}
.for-spDesc{
   display:initial;
}
.contents-container.with-top-img{
   padding : 0 15px 100px;
   overflow-x: hidden;
}
h1{
   margin: 0 auto;
}
.page-top-wrapper h1{
   padding: 0 30px 20px;
}
.page-top-wrapper h1::before {
   top: -8px;
   left: 8px;
   width: 10px;
   height: 10px;
}
.page-top-wrapper h1::after {
   top: -16px;
   left: 15px;
   width: 10px;
   height: 10px;
}
h2.square-bracket::before{
   top: -6px;
   left: -17px;
}
h2.square-bracket::after{
   border-right:solid 1px #000;
   border-bottom:solid 1px #000;
   bottom: -6px;
   left: calc(100% - 3px);
}


.contents-container main {
   padding: 50px 0 30px;
}
   .breadcrumbs{
      padding: 7px 0 6px;
   }
   .breadcrumbs>ul{
      padding:0 15px 0;
      font-size:.8rem;
   }
   p.align-change,div.align-change{
      text-align:left!important;
   }
   pre{
      margin:.5em 0;
   }
   pre ol li span{
      width:100%;
   }
   h1:not(.home h1){
      font-size: 25px;
   }
   h1>span.sub{
      padding-bottom: 5px;
      line-height: 1.7em;
   }
   main h2.align-change::after{
      font-size:1.1rem;
      left:0;
      transform:translateX(0);
      width:30%;
   }
   main h2.square-bracket{
      text-align:center;
      width:90%;
   }
   main h3{
      font-size:1.1rem;
   }
   h1.align-change,
   h2.align-change{
      text-align:left
   }
   table.simple.responsive th,
   table.simple.responsive td{
      display:block;
      width:100%!important;
      padding: 10px 0;
   }
   table.simple.responsive td{
      padding:.8em .8em .8em 8px;
   }
   .date dl{
      font-size: 13px;
      margin:0 14px 15px 0;
   }
  dt.publish{
      padding:0 0 0 0;
   }
  dt.update{
      padding:0 5px 0 0;
   }
   span.sp-none{
      display:none;
   }
   dl.standard{
      flex-direction:column;
   }
   dl.standard dt{
      width:100%;
      font-weight:700;
      text-align:left;
   }
   dl.standard dd{
      width:100%;
      padding:.5em 2.5em .5em 0;
   }
   main h2.lines-both-sides::before,main h2.lines-both-sides::after{
      width:10%;
   }
   .cmt p{
      font-size:14px;
   }
   .standard.wide{
      padding:20px 0 20px 25px;
   }
   address.tel{
      font-size:31px;
   }
   #reception-time{
      margin-top:9px;
      font-size:.9rem;
   }
   .search-box-inner{
      width:100%;
   }
   .search-all-container{
      width:100%;
   }
/*wordpress対応*/
.max-w-600>figure,
.max-w-600>img,
.max-w-500>figure,
.max-w-600>img{
   max-width: 100%!important;
}
}