/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 2021/10/14, 16:25:47
    Author     : arise.com
*/
/*--------------------------------------------------------------
# Fonts convertiom
--------------------------------------------------------------*/
/* フォントを読み込む */
/*@import url('https://fonts.googleapis.com/css?family=Impact');*/
/*@import url('https://fonts.googleapis.com/css?family=Futura+PT');*/
@import url('https://fonts.googleapis.com/css2?family=Cormorant:ital,wght@1,700&family=Petit+Formal+Script&display=swap');
@import url('https://fonts.googleapis.com/css?family=Josefin+Sans');

.wf-Gothic {
    font-family: -apple-system, 'Noto Sans JP',BlinkMacSystemFont, 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif;

}

.wf-Mincho {
    font-family:  'Noto Serif JP',Georgia,游明朝 Regular,"Yu Mincho Regular",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,sans-serif,serif;
    transform: rotate(0.001deg);
}

.wf-Cormorant {
    font-family: 'Cormorant', serif ! important;
}

.wf-Josefin-Sans {
    font-family: 'Josefin Sans' ! important;
}

.wf-Impact {
    font-family: 'Impact', sans-serif;
}

/*.wf-FuturaPT {
    font-family: 'Futura PT', sans-serif;
}*/

.wf-Condor-ExtraLight {
    font-family: "condor", sans-serif !important ;
    font-weight: 200;
    font-style: normal;

}

.wf-Condor-Light {
    font-family: "condor", sans-serif !important ;
    font-weight: 300;
    font-style: normal;
}

.wf-Condor-Regular {
    font-family: "condor", sans-serif !important ;
    font-weight: 400;
    font-style: normal;
}

.wf-Condor-Italic {
    font-family: "condor", sans-serif !important ;
    font-weight: 400;
    font-style: italic;
}

.wf-Condor-Medium {
    font-family: "condor", sans-serif !important ;
    font-weight: 500;
    font-style: normal;
}

.wf-Condor-Bold {
    font-family: "condor", sans-serif !important ;
    font-weight: 700;
    font-style: normal;
}

.wf-Condor-Bold-Italic {
    font-family: "condor", sans-serif !important ;
    font-weight: 700;
    font-style: italic;
}

.wf-Condor-Black {
    font-family: "condor", sans-serif !important ;
    font-weight: 800;
    font-style: normal;
}

.wf-CondorComp-Regular {
    font-family: condor-compressed, sans-serif;
    font-weight: 400;
    font-style: normal;
}

.wf-CondorComp-Italic {
    font-family: "condor-compressed", sans-serif !important ;
    font-weight: 400;
    font-style: italic;
}

.wf-CondorComp-Bold {
    font-family: "condor-compressed", sans-serif !important ;
    font-weight: 700;
    font-style: normal;
}

.wf-CondorComp-Bold-Italic {
    font-family: "condor-compressed", sans-serif !important ;
    font-weight: 700;
    font-style: italic;
}

.wf-CondorCond-Regular {
    font-family: "condor-condensed", sans-serif !important ;
    font-weight: 400;
    font-style: normal;
}

.wf-CondorCond-Italic {
    font-family: "condor-condensed", sans-serif !important ;
    font-weight: 400;
    font-style: italic;
}

.wf-CondorCond-Bold {
    font-family: "condor-condensed", sans-serif !important ;
    font-weight: 700;
    font-style: normal;
}

.wf-CondorCond-Bold-Italic {
    font-family: "condor-condensed", sans-serif !important ;
    font-weight: 700;
    font-style: italic;
}

.wf-CondorExtd-Regular {
    font-family: "condor-extended", sans-serif !important ;
    font-weight: 400;
    font-style: normal;
}

.wf-CondorExtd-Italic {
    font-family: "condor-extended", sans-serif !important ;
    font-weight: 400;
    font-style: italic;
}

.wf-CondorExtd-Bold {
    font-family: "condor-extended", sans-serif !important ;
    font-weight: 700;
    font-style: normal;
}

.wf-CondorExtd-Bold-Italic {
    font-family: "condor-extended", sans-serif !important ;
    font-weight: 700;
    font-style: italic;
}

.wf-CondorWide-Regular {
    font-family: "condor-wide", sans-serif !important ;
    font-weight: 400;
    font-style: normal;
}

.wf-CondorWide-Italic {
    font-family: "condor-wide", sans-serif !important ;
    font-weight: 400;
    font-style: italic;
}

.wf-CondorWide-Bold {
    font-family: "condor-wide", sans-serif !important ;
    font-weight: 700;
    font-style: normal;
}

.wf-CondorWide-Bold-Italic {
    font-family: "condor-wide", sans-serif !important ;
    font-weight: 700;
    font-style: italic;
}

.wf-TA-koigokoro {
    font-family: "ta-koigokoro", sans-serif !important ;
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: '07ロゴたいぷゴシックCondense';
    src:local(''),
        url('../font/LogoTypeGothicCondensed.otf');
}

.wf-LogoTypeGothicCondensed {
    font-family: '07ロゴたいぷゴシックCondense' !important ;
    font-weight: 400;
    font-style: normal;

}

@font-face {
    font-family: '殴り書きクレヨン';
    src:local(''),
        url('../font/crayon_1-1.ttf');
}

.wf-crayon_1-1 {
    font-family: '殴り書きクレヨン' !important ;
    font-weight: 400;
    font-style: normal;

}


/* inter-300 - latin */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: local(''),
        url('../fonts/inter-v12-latin-300.woff2') format('woff2'),
        /* Chrome 26+, Opera 23+, Firefox 39+ */
        url('../fonts/inter-v12-latin-300.woff') format('woff');
    /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: local(''),
        url('../fonts/inter-v12-latin-500.woff2') format('woff2'),
        /* Chrome 26+, Opera 23+, Firefox 39+ */
        url('../fonts/inter-v12-latin-500.woff') format('woff');
    /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: local(''),
        url('../fonts/inter-v12-latin-700.woff2') format('woff2'),
        /* Chrome 26+, Opera 23+, Firefox 39+ */
        url('../fonts/inter-v12-latin-700.woff') format('woff');
    /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

.wf-BrandonGrotesque-Regular {
    font-family: "brandon-grotesque", sans-serif !important ;
    font-weight: 400;
    font-style: normal;
}

.wf-BrandonGrotesque-Regular-Italic {
    font-family: "brandon-grotesque", sans-serif !important ;
    font-weight: 400;
    font-style: italic;
}

.wf-BrandonGrotesque-Bold {
    font-family: "brandon-grotesque", sans-serif !important ;
    font-weight: 700;
    font-style: normal;
}

.wf-BrandonGrotesque-Bold-Italic {
    font-family: "brandon-grotesque", sans-serif !important ;
    font-weight: 700;
    font-style: italic;
}

@font-face {
    font-family: 'ロゴたいぷゴシック';
    src:url('../fonts/ロゴたいぷゴシック.otf');
}

.wf-LogoTypeGothic {
    font-family: 'ロゴたいぷゴシック' !important ;
    font-weight: 400;
    font-style: normal;

}

@font-face {
    font-family: 'やさしさゴシック手書き';
    src:url('../fonts/やさしさゴシック手書き.otf');
}

.wf-YasashisaGothic {
    font-family: 'やさしさゴシック手書き' !important ;
    font-weight: 400;
    font-style: normal;

}

.wf-Alisha-Regular {
    font-family: "alisha", sans-serif !important;
    font-weight: 400;
    font-style: normal;
}

.wf-maru-maru-gothic-blr {
    font-family: "maru-maru-gothic-blr-stdn", sans-serif !important;
    font-weight: 400;
    font-style: normal;
}

.wf-maru-maru-gothic-bsr
{
    font-family: "maru-maru-gothic-bsr-stdn", sans-serif !important;
    font-weight: 400;
    font-style: normal;
}

.wf-maru-maru-gothic-alr
{
    font-family: "maru-maru-gothic-alr-stdn", sans-serif !important;
    font-weight: 400;
    font-style: normal;
}

.wf-maru-maru-gothic-asr
{
    font-family: "maru-maru-gothic-asr-stdn", sans-serif !important;
    font-weight: 400;
    font-style: normal;
}

.wf-maru-maru-gothic-clr
{
    font-family: "maru-maru-gothic-clr-stdn", sans-serif !important;
    font-weight: 400;
    font-style: normal;
}

.wf-maru-maru-gothic-csr
{
    font-family: "maru-maru-gothic-csr-stdn", sans-serif !important;
    font-weight: 400;
    font-style: normal;
}

.wf-vdl-penletter
{
    font-family: "vdl-penletter", sans-serif !important;
    font-weight: 500;
    font-style: normal;
}

.wf-hiragino-kaku-gothic-w3
{
    font-family: "hiragino-kaku-gothic-pron", sans-serif;
    font-weight: 300;
    font-style: normal;
}

.wf-hiragino-kaku-gothic-w6
{
    font-family: "hiragino-kaku-gothic-pron", sans-serif;
    font-weight: 600;
    font-style: normal;
}

/*--------------------------------------------------------------
# mobile ON/OFF
--------------------------------------------------------------*/
.mobile-display-ON {
    display: none ;
}
.mobile-display-OFF {
    display: block ;
}
@media screen and (max-width: 768px) {
    .mobile-display-ON {
        display: block ;
    }
    .mobile-display-OFF {
        display: none ;
    }
}

/*--------------------------------------------------------------
# font-weight
--------------------------------------------------------------*/
.fw100 {
    font-weight: 100 !important;
}

.fw300 {
    font-weight: 300 !important;
}

.fw400 {
    font-weight: 400 !important;
}

.fw500 {
    font-weight: 500 !important;
}

.fw700 {
    font-weight: 700 !important;
}

/*--------------------------------------------------------------
# margin & padding
--------------------------------------------------------------*/
mt-10 {
    margin-top: 10px;
}

.mt-15 {
    margin-top: 15px;
}

.mt-20 {
    margin-top: 20px;
}

.mt-25 {
    margin-top: 25px;
}

.mt-30 {
    margin-top: 30px;
}

.mt-35 {
    margin-top: 35px;
}

.mt-40 {
    margin-top: 40px;
}

.mt-50 {
    margin-top: 50px;
}

.mt-60 {
    margin-top: 60px;
}

.mt-70 {
    margin-top: 70px;
}

.mt-80 {
    margin-top: 80px;
}

.mt-90 {
    margin-top: 90px;
}

.mt-100 {
    margin-top: 100px;
}

.mt-120 {
    margin-top: 120px;
}

.mt-150 {
    margin-top: 150px;
}

.mt-300 {
    margin-top: 300px;
}

.mt-xs {
    margin-top: 5px ! important ;
}

.mb-xs {
    margin-bottom: 5px ! important ;
}

.mb-10 {
    margin-bottom: 10px;
}

.mb-15 {
    margin-bottom: 15px;
}

.mb-20 {
    margin-bottom: 20px;
}

.mb-25 {
    margin-bottom: 25px;
}

.mb-30 {
    margin-bottom: 30px;
}

.mb-35 {
    margin-bottom: 35px;
}

.mb-40 {
    margin-bottom: 40px;
}

.mb-50 {
    margin-bottom: 50px;
}

.mb-60 {
    margin-bottom: 60px;
}

.mb-70 {
    margin-bottom: 70px;
}

.mb-80 {
    margin-bottom: 80px;
}

.mb-90 {
    margin-bottom: 90px;
}

.mb-100 {
    margin-bottom: 100px;
}

.mb-120 {
    margin-bottom: 120px;
}

.mb-150 {
    margin-bottom: 150px;
}

.pt-0 {
    padding-top: 0px ! important ;
}
.pt-3 {
    padding-top: 3px ! important ;
}

.pt-5 {
    padding-top: 5px ! important ;
}

.pt-10 {
    padding-top: 10px;
}

.pt-15 {
    padding-top: 15px;
}

.pt-20 {
    padding-top: 20px;
}

.pt-25 {
    padding-top: 25px;
}

.pt-30 {
    padding-top: 30px;
}

.pt-35 {
    padding-top: 35px;
}

.pt-40 {
    padding-top: 40px;
}

.pt-50 {
    padding-top: 50px;
}

.pt-60 {
    padding-top: 60px;
}

.pt-70 {
    padding-top: 70px;
}

.pt-80 {
    padding-top: 80px;
}

.pt-90 {
    padding-top: 90px;
}

.pt-100 {
    padding-top: 100px;
}

.pt-120 {
    padding-top: 120px;
}

.pt-150 {
    padding-top: 150px;
}

.pt-xs {
    padding-top: 5px ! important;
}
.pb-xs {
    padding-bottom: 5px ! important;
}


.pb-0 {
    padding-bottom: 0px ! important ;
}
.pb-3 {
    padding-bottom: 3px ! important ;
}

.pb-5 {
    padding-bottom: 5px ! important ;
}

.pb-10 {
    padding-bottom: 10px;
}

.pb-15 {
    padding-bottom: 15px;
}

.pb-20 {
    padding-bottom: 20px;
}

.pb-25 {
    padding-bottom: 25px;
}

.pb-30 {
    padding-bottom: 30px;
}

.pb-35 {
    padding-bottom: 35px;
}

.pb-40 {
    padding-bottom: 40px;
}

.pb-50 {
    padding-bottom: 50px;
}

.pb-60 {
    padding-bottom: 60px;
}

.pb-70 {
    padding-bottom: 70px;
}

.pb-80 {
    padding-bottom: 80px;
}

.pb-90 {
    padding-bottom: 90px;
}

.pb-100 {
    padding-bottom: 100px;
}

.pb-120 {
    padding-bottom: 120px;
}

.pb-150 {
    padding-bottom: 150px;
}

.pl-0 {
    padding-left: 0px ! important ;
}
.pl-3 {
    padding-left: 3px ! important ;
}

.pl-5 {
    padding-left: 5px ! important ;
}

.pl-10 {
    padding-left: 10px;
}

.pl-15 {
    padding-left: 15px;
}

.pl-20 {
    padding-left: 20px;
}

.pl-25 {
    padding-left: 25px;
}

.pl-30 {
    padding-left: 30px;
}

.pl-35 {
    padding-left: 35px;
}

.pl-40 {
    padding-left: 40px;
}

.pl-50 {
    padding-left: 50px;
}

.pl-60 {
    padding-left: 60px;
}

.pl-70 {
    padding-left: 70px;
}

.pl-80 {
    padding-left: 80px;
}

.pl-90 {
    padding-left: 90px;
}

.pl-100 {
    padding-left: 100px;
}

.pl-120 {
    padding-left: 120px;
}

.pl-150 {
    padding-left: 150px;
}

.pr-0 {
    padding-right: 0px ! important ;
}
.pr-3 {
    padding-right: 3px ! important ;
}

.pr-5 {
    padding-right: 5px ! important ;
}

.pr-10 {
    padding-right: 10px;
}

.pr-15 {
    padding-right: 15px;
}

.pr-20 {
    padding-right: 20px;
}

.pr-25 {
    padding-right: 25px;
}

.pr-30 {
    padding-right: 30px;
}

.pr-35 {
    padding-right: 35px;
}

.pr-40 {
    padding-right: 40px;
}

.pr-50 {
    padding-right: 50px;
}

.pr-60 {
    padding-right: 60px;
}

.pr-70 {
    padding-right: 70px;
}

.pr-80 {
    padding-right: 80px;
}

.pr-90 {
    padding-right: 90px;
}

.pr-100 {
    padding-right: 100px;
}

.pr-120 {
    padding-right: 120px;
}

.pr-150 {
    padding-right: 150px;
}

.mt--360 {
    margin-top: -360px;
}
.mt--600 {
    margin-top: -600px;
}

/*--------------------------------------------------------------
# shadow decoration
--------------------------------------------------------------*/

.shadow {
    box-shadow: 0 3rem 4rem rgba(21, 21, 21, 0.25) !important;
}

.shadow-sm {
    box-shadow: 0 1rem 1.5rem rgba(21, 21, 21, 0.25) !important;
}

.shadow-lg {
    box-shadow: 0 4rem 6rem rgba(21, 21, 21, 0.25) !important;
}

.shadow-none {
    box-shadow: none !important;
}

.text-shadow-b {
    text-shadow: 0 2px 2px rgba(0, 0, 0, 0.5);
}
.text-shadow-w {
    text-shadow: 0 2px 2px rgba(255, 255, 255, 0.5);
}

/*--------------------------------------------------------------
# text aligin
--------------------------------------------------------------*/
.align-left {
    text-align: left ! important;
}
.align-center {
    text-align: center ! important;
}
.align-right {
    text-align: right ! important;
}

/*--------------------------------------------------------------
# text underline
--------------------------------------------------------------*/
.bottom-line {
    border-bottom: 1px solid #444444;
    padding-bottom: 0.25em;
}
.bottom-line-w {
    border-bottom: 1px solid #FFFFFF;
    padding-bottom: 0.25em;
}
.bottom-line-g {
    border-bottom: 1px solid #555555;
    padding-bottom: 0.25em;
}

/*--------------------------------------------------------------
# Force a font 
--------------------------------------------------------------*/
.fs-12px {
    font-size:12px ! important ;
}
.fs-14px {
    font-size:14px ! important ;
}
.fs-16px {
    font-size:16px ! important ;
}
.fs-18px {
    font-size:24px ! important ;
}
.fs-24px {
    font-size:24px ! important ;
}
.fs-28px {
    font-size:28px ! important ;
}
.fs-32px {
    font-size:32px ! important ;
}
.fs-48px {
    font-size:48px ! important ;
}
.fs-64px {
    font-size:64px ! important ;
}

/*--------------------------------------------------------------
# Other CSS
--------------------------------------------------------------*/


.text-shadow-b {
    text-shadow: 0 2px 2px rgba(0, 0, 0, 0.5);
}
.text-shadow-w {
    text-shadow: 0 2px 2px rgba(255, 255, 255, 0.5);
}

.with-capture  {
    padding-bottom: .3em;
    /*border-bottom: 1px solid #ccc;*/
}
.with-capture  span {
    display: block;
    margin-bottom: .2em;
    /*color: #C0C0C0;*/
    /*color: #FF8C00;*/
    color: #F36835;
    /*color: #FB7892;*/
    /*color: #e03a3c;*/
    /*color: rgba(224,58,60,0.5 );*/
    font-size: 0.8em;
}

/*--------------------------------------------------------------
# Custom page CSS
--------------------------------------------------------------*/

/*メニューをページ下部に固定*/
#sp-fixed-menu{
    position: fixed;
    width: 100%;
    bottom: 0px;
    font-family: "hiragino-kaku-gothic-pron", sans-serif;
    font-style: normal;
    font-weight: 600;
    font-size: 1.2em;
    opacity: 0.9;
    z-index: 99;
}

/*メニューを横並びにする*/
#sp-fixed-menu ul{
    display: flex;
    list-style: none;
    padding:0;
    margin:0;
    width:100%;
}

#sp-fixed-menu li{
    justify-content: center;
    align-items: center;
    width: 50%;
    padding:1.0em;
    margin:0;
    border-right: 1px solid #fff;
}

#sp-fixed-menu li:first-child{
    /*background: #000000;*/
    background: #AA9767;
}

#sp-fixed-menu li:child{
    /*background: #000000;*/
    background: #AA9767;
}

#sp-fixed-menu li:last-child{
    /*background: #000000;*/
    background: #AA9767;
}

/*ボタンを調整*/
#sp-fixed-menu li a{
    color: #fff;
    text-align: center;
    display:block;
    width: 100%;
    padding:20px;
}
#sp-fixed-menu li img{
    object-fit: cover;
    width: 100%;
}
#sp-fixed-menu li a{

    padding: 10px;

}

/*PCの場合にはメニューを表示させない*/
.for-sp{
    display:none;
}
@media screen and (max-width: 768px) {
    .for-sp{
	display:block;
    }
}

.accordion-button::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M8 4a.5.5 0 0 1 .5.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3A.5.5 0 0 1 8 4z'/%3e%3c/svg%3e");
    transform: none !important; /* 既存の回転を無効化 */
}

.accordion-button:not(.collapsed)::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23dc3545'%3e%3cpath fill-rule='evenodd' d='M4 8a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7A.5.5 0 0 1 4 8z'/%3e%3c/svg%3e");
}


/* ここから追加 */
/* 吹き出し */
.balloon {
    background-color: #ECEBD6; /* 吹き出しの色 */
    border: 5px solid #dfe1c5; /* 吹き出しの枠線 */
    border-style: dotted;
    padding: 10px; /* 内側の余白 */
    border-radius: 50px; /* 角の丸み */
    position: relative; /* 相対配置の基準 */
    width: 100%; /* 幅 */
    font-size: 1.5em;
    text-align: center;
}

.balloon:after {
    content: '';
    position: absolute;
    bottom: -10px; /* 吹き出しの先端の位置 */
    left: 20px; /* 吹き出しの先端の位置 */
    border-width: 10px 10px 0 0; /* 三角形の大きさ */
    border-color: #ECEBD6 transparent transparent transparent; /* 三角形の色 */
    border-style: solid;
}

@media screen and (max-width: 768px) {
    .balloon {
        font-size: 0.75em;
    }
}