@charset "UTF-8";
@font-face {
    font-family:'DM Serif Display';
    src: url(/public/fonts/DMSerifDisplay-Regular.ttf);
}
@font-face {
    font-family:'Noto Sans Japanese';
    src: url(/public/fonts/NotoSansJP-Medium.ttf);
}
@font-face {
    font-family:'Arial';
    src: url(/public/fonts/Arialn.ttf);
}
@font-face {
    font-family:'Oswald';
    src: url(/public/fonts/Oswald-Regular.ttf);
}
@font-face {
    font-family:'KosugiMaru';
    src: url(/public/fonts/KosugiMaru-Regular.ttf);
}
@font-face {
    font-family:'MPLUS1';
    src: url(/public/fonts/MPLUS1-VariableFont_wght.ttf);
}
@font-face {
    font-family:'Fredoka';
    src: url(/public/fonts/Fredoka-VariableFont_wdth,wght.ttf);
}




/*******************************************************************************************
共通処理
*******************************************************************************************/
html {
    font-size: 100%;/*フォントサイズの基本値*/
    scroll-snap-type:y proximity;/*ページ内リンク少し上に着地調整*/
    scroll-padding-top:10vh;/*ページ内リンク少し上に着地調整*/
    /*scroll-behavior:smooth;/*上に戻る挙動をスムーズ化　　問い合わせフォームの画面外のフォームエラーが表示されなくなる影響あり*/
    scroll-behavior:auto;/*上に戻る挙動をスムーズ化　　問い合わせフォームの画面外のフォームエラーが表示されなくなる影響あり*/
    transition: font-size 0.3s ease; /* なめらかにフォントサイズが切り替わる */
}
body {
    background-color:#fdf6e3;
    font-family:'KosugiMaru','Noto Sans Japanese';
    font-size: 1.0rem;
    line-height: 1.7;
}
/*中身のコンテンツ幅指定の共通クラス*/
.wrapper {
    width:1400px;
    height:100%;
    max-width:100%;
    margin: 0 auto;
    padding:0 3%;
    text-align: center;
    position:relative;
}
/*新着記事に「NEW」を付与*/
.text_icon{
    color:white;
    font-weight:bold;
    background-color:red;
    border-radius:30px;
    padding:3px 10px;
    margin-left:10px;
}
/*ＰＣ用の改行*/
br.br_pc{
    display:block;
}
/*スマホ用の改行*/
br.br_sm{
    display:none;
}
/*タイトル用*/
.title_pc{
    display:block;
}
.title_sm{
    display:none;
}

span.block{
    display:block;
}
/*******************************************************************************************
変数定義
*******************************************************************************************/
body{
    /*テーマカラー*/
    --themecolor:#f4f3ee;
    
    /*テーマカラー サブ*/
    /*--themecolor_sub:#faedcd;*/
    --themecolor_sub:#fdf6e3;
    /*テーマカラー 強調部*/
    --themecolor_emphasis:#ffab16;
    /*フォントカラー rgb(66,30,4)*/
    --fontcolor:#87796f;
    /*フォントカラー　サブ*/
    --fontcolor_sub1:#f4e3dd;
    /*フォントカラー　サブ*/
    --fontcolor_sub2:white;

    color:var(--fontcolor);
}
/*******************************************************************************************
header
*******************************************************************************************/
#header{
    display:block;
    width:100%;
    max-width:100%;
    height:18vh;
    background-color:white;
    transition: top 0.3s ease; /* アニメーション */
}
#header #header_menu_area{
    display:flex;
    justify-content:space-between;
    width:100%;
    height:100%;
    flex: 1; /* 必要に応じて調整。全体を埋める */
    align-items: stretch;
}
#header #header_menu_area #header_menu{
    display:flex;
    width:100%;
    height:calc(100% - 10%);
    flex-direction:column;
    justify-content:center;
    text-align:center;
    padding:0 1%;
    margin:3% 0;
}
#header #header_menu_area #header_menu .logo_area{
    display:block;
    width:100%;
    height:auto;
    text-align:center;
    margin:0 auto;
}
#header #header_menu_area #header_menu .logo_area a.header_menu_title{
    display:flex;
    width:150px;
    height:auto;
    margin:0 auto;
}
#header #header_menu_area #header_menu .logo_area a.header_menu_title img{
    display:block;
    width:100%;
    height:100%;
    object-fit:contain;
}

#header #header_menu_area #header_menu .menu_area{
    display:flex;
    width:100%;
    height:100%;
    justify-content:center;
    align-items:center;
    position:relative;
}
#header #header_menu_area #header_menu .menu_area #nav{
    display:block;
    width:100%;
    height:100%;
    /*overflow:hidden;*/
}
#header #header_menu_area #header_menu .menu_area #nav ul#nav_menu{
    display:flex;
    width:100%;
    height:100%;
    justify-content:center;
    /*overflow: visible;*/
}
#header #header_menu_area #header_menu .menu_area #nav ul#nav_menu li.nav_menu_item{
    display:block;
    color:#87796f;
    font-size:1.0rem;
    font-weight:bold;
    font-family:'MPLUS1',serif;
    letter-spacing:0.2rem;
    position:relative;
    padding:5px 1vw;
    border-radius:20px;
    transition-duration:0.5s;
}
#header #header_menu_area #header_menu .menu_area #nav ul#nav_menu li.nav_menu_item:nth-of-type(1){
    width:170px;
    background-color:white;
    border-radius:50%;
    position:relative;
    z-index:100;
}
#header #header_menu_area #header_menu .menu_area #nav ul#nav_menu li.nav_menu_item:nth-of-type(2){
    width:170px;
    background-color:white;
    border-radius:50%;
    position:relative;
    z-index:100;
}
#header #header_menu_area #header_menu .menu_area #nav ul#nav_menu li.nav_menu_item:nth-of-type(3){
    color:#d48c87;
    width:300px;
    font-size:2rem;
}
#header #header_menu_area #header_menu .menu_area #nav ul#nav_menu li.nav_menu_item:nth-of-type(3) .title2{
    font-family:'Fredoka';
    font-size:2.0rem;
    line-height:2.0rem;
}
#header #header_menu_area #header_menu .menu_area #nav ul#nav_menu li.nav_menu_item:nth-of-type(4){
    width:170px;
    background-color:white;
    border-radius:50%;
    position:relative;
    z-index:100;
}
#header #header_menu_area #header_menu .menu_area #nav ul#nav_menu li.nav_menu_item:nth-of-type(5){
    width:170px;
    background-color:white;
    border-radius:50%;
    position:relative;
    z-index:100;
}
#header #header_menu_area #header_menu .menu_area #nav ul#nav_menu li.nav_menu_item:hover{
    color:var(--themecolor);
    background-color:white;
    text-shadow:none;
    transition: background-color 0.5s;
}
#header #header_menu_area #header_menu .menu_area #nav ul#nav_menu li.nav_menu_item a.btn{
    display:flex;
    width:100%;
    height:auto;
    flex-direction:column;
    white-space:nowrap;
    text-align:center;

}
#header #header_menu_area #header_menu .menu_area #nav ul#nav_menu li.nav_menu_item a.btn p.text{
    margin-bottom:10px;
}
#header #header_menu_area #header_menu .menu_area #nav ul#nav_menu li.nav_menu_item a.btn .icon_area{
    display:flex;
    width:67px;
    height:auto;
    aspect-ratio:1 /1;
    justify-content:center;
    padding:5%;
    margin: 0 auto;
    background-color:#bbd400;
    border-radius:0 50% 50% 50%;
}
#header #header_menu_area #header_menu .menu_area #nav ul#nav_menu li.nav_menu_item:nth-of-type(2) a.btn .icon_area{
    background-color:#8ac7de;
}
#header #header_menu_area #header_menu .menu_area #nav ul#nav_menu li.nav_menu_item:nth-of-type(4) a.btn .icon_area{
    background-color:#8ac7de;
}
#header #header_menu_area #header_menu .menu_area #nav ul#nav_menu li.nav_menu_item a.btn .icon_area img{
    display:block;
}
/*
ハンバーガメニュー（共通）
*/
#header .hamburger_btn{
    display:none;
    width:fit-content;
    /*margin:0 2% 0 auto;*/
    z-index:100;
    position:absolute;
    top:100%;
    right:0;
}
/*ボタン外側*/
#header .hamburger_btn .header_menu_lines{
    position: relative;/*ボタン内側を基点とする*/
    cursor: pointer;
    width: 40px;
    height:40px;
}
/*ボタン内側*/
#header .hamburger_btn .header_menu_lines span{
    display: inline-block;
    transition: all .4s;
    position: absolute;
    left: 5px;
    height: 4px;
    border-radius: 5px;
    background: var(--fontcolor);
    width: 75%;
}
#header .hamburger_btn .header_menu_lines span:nth-of-type(1) {
    /*top:10px; */
    top:calc(50% - 20%);
    transform:translateY(-50%);
}
#header .hamburger_btn .header_menu_lines span:nth-of-type(2) {
    /*top:18px;*/
    top:calc(50%);
    transform:translateY(-50%);
}
  
#header .hamburger_btn .header_menu_lines span:nth-of-type(3) {
    /*top:26px;*/
    top:calc(50% + 20%);
    transform:translateY(-50%);
}
#header .hamburger_btn .header_menu_lines.active span:nth-of-type(1) {
    top: 12px;
    left:10px;
    transform: translateY(6px) rotate(-45deg);
    width: 50%;
}
  
#header .hamburger_btn .header_menu_lines.active span:nth-of-type(2) {
    opacity: 0;
}
  
#header .hamburger_btn .header_menu_lines.active span:nth-of-type(3){
    top: 24px;
    left: 10px;
    transform: translateY(-6px) rotate(45deg);
    width: 50%;
}
  
#header .hamburger_btn .header_menu_lines.active span:nth-of-type(3)::after {
    /*content:"Close";MENU文言非表示*/
    transform: translateY(0) rotate(-45deg);
    top:5px;
    left:4px;
}

/*
スライドメニュー
*/
#header_slide_menu_area{
    display:block;/*PC非表示*/
    background-color:var(--fontcolor);
    position: fixed;
    top: 0px;
    right: 0px;
    width: 80%;
    height:100%;
    transform: translateX(100%); /* ハンバーガーメニューOFF時、右側へスライドさせておく */
    z-index:100;
    transition: 0.4s;
    overflow-y:scroll;/*メニュー縦スクロール許可*/
    pointer-events: none; /* 非表示時はクリック不可に */
    opacity: 0;
}
#header_slide_menu_area.active{
    transform: translateX(0);
    pointer-events: auto;
    opacity: 1;
}
#header_slide_menu_area .shop_name{
    margin-bottom:50px;
}
#header_slide_menu_area .shop_name .link{
    display:block;
    width:150px;
    height:auto;
    margin:0 auto;
}
#header_slide_menu_area ul.header_slide_menu li{
    color:white;
    text-align:center;
    margin-bottom:30px;
}
#header_slide_menu_area .close_btn{
    display:block;
    width:fit-content;
    z-index:100;
    position:absolute;
    top:0;
    left:0;
}
/*ボタン外側*/
#header_slide_menu_area .close_btn .header_menu_lines{
    position: relative;/*ボタン内側を基点とする*/
    cursor: pointer;
    width: 40px;
    height:40px;
}
/*ボタン内側*/
#header_slide_menu_area .close_btn .header_menu_lines span{
    display: inline-block;
    transition: all .4s;
    position: absolute;
    left: 5px;
    height: 4px;
    border-radius: 5px;
    background: white;
    width: 75%;
}
#header_slide_menu_area .close_btn .header_menu_lines span:nth-of-type(1) {
    transform:translateY(-50%);
    top: 12px;
    left:10px;
    transform: translateY(6px) rotate(-45deg);
    width: 50%;
}
#header_slide_menu_area .close_btn .header_menu_lines span:nth-of-type(2) {
    opacity: 0;
}
#header_slide_menu_area .close_btn .header_menu_lines span:nth-of-type(3) {
    top: 24px;
    left: 10px;
    transform: translateY(-6px) rotate(45deg);
    width: 50%;
}
/*******************************************************************************************
mask_area
*******************************************************************************************/
#mask_area{
    display:none;
    width:100%;
    height:100%;
    position:fixed;
    top:0;
    left:0;
    background-color:rgb(51,51,51,0.5);
    z-index:99;
}
#mask_area.active{
    display:block;
}
/*******************************************************************************************
mainvisual
*******************************************************************************************/
#mainvisual{
    display:block;
    width:100%;
    background-color:#f4f3ee;
    height:450px;
}
#mainvisual .inner{
    display:block;
    width:100%;
    height:100%;
    position:relative;
}
#mainvisual .inner .mainvisual_area{
    display:block;
    width:100%;
    height:100%;
    border-radius:0 0 100px 100px;
    overflow:hidden;
}
#mainvisual .inner .mainvisual_area img{
    display:block;
    width:100%;
    height:100%;
    object-fit: cover; /* contain → cover に変更 */
    object-position: bottom center;
}
#mainvisual .inner .bubble_area{
    display:block;
    width:auto;
    height:auto;
    position:absolute;
    bottom:0;
    right:0;
    translate:-10% 20%;
}
#mainvisual .inner .bubble_area .bubble{
    display:block;
    width:auto;
    width:100%;
    height:auto;
    aspect-ratio:1 / 1;
    background-color:white;
    border-radius:50%;
    box-shadow: 2px 2px 4px gray;
}
#mainvisual .inner .bubble_area .bubble p.title{
    display:block;
    font-size:1.7rem;
    font-weight:bold;
    font-family:'Noto Sans Japanese';
    line-height:1.7rem;
    color:#71bedb;
    margin: 0;
    padding: 1em 1em 0.5em 1em;
}
#mainvisual .inner .bubble_area .bubble p.comment1{
    display:block;
    font-size:1.0rem;
    font-weight:bold;
    font-family:'Noto Sans Japanese';
    line-height:1.7rem;
    color:#87796f;
    margin: 0;
    padding: 0.3em 1em;
}
#mainvisual .inner .bubble_area .bubble p.comment2{
    display:block;
    font-size:1.2rem;
    font-family:'Noto Sans Japanese';
    line-height:1.7rem;
    color:#ffa029;
    margin: 0;
    padding: 0.5em 1em;
}
#mainvisual .inner .bubble_area .bubble a.btn{
    display:block;
    width:fit-content;
    height:auto;
    font-size:1.0rem;
    font-family:'Noto Sans Japanese';
    color:white;
    background-color:#ffa029;
    border-radius:30px;
    margin:0.5em auto;
    padding: 0.5em 1em 0.5em 3em;
    background-image:url(/public/img/arrow_right_white.svg);
    background-repeat:no-repeat;
    background-size:20px 20px;
    background-position:left 1em center;
}
#mainvisual .inner .bubble_area .deco{
    display:block;
    width:40px;
    height:40px;
    background-color:white;
    border-radius:50%;
    position:absolute;
    top:0;
    left:0;
    translate:50% 50%;
}
/*******************************************************************************************
slick
*******************************************************************************************/
.slick-list{
    height:100%;
}
.slick-track{
    height:100%;
}
.slick-prev{
    position:absolute;
    left:0;
    z-index:100;
}
.slick-prev::before {
    content:"";
    display:block;
    width:15px;
    height:15px;
    left: 0;
    border-left: 2px solid #fff;
    border-bottom: 2px solid #fff;
    -webkit-transform: rotate(45deg);
    transform: translateX(100%) rotate(45deg);
    position:relative;
    z-index:5;
}
.slick-next{
    position:absolute;
    right:0;
    z-index:100;
}
.slick-next::before {
    content:"";
    display:block;
    width:15px;
    height:15px;
    right: 0;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    -webkit-transform: rotate(45deg);
    transform: translateX(-100%) rotate(45deg);
    position:relative;
    z-index:5;
}
/*******************************************************************************************
h1　（非表示）
*******************************************************************************************/
.visually-hidden {
    position: absolute !important;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
/*******************************************************************************************
news
*******************************************************************************************/
#news{
    padding-top:50px;
    padding-bottom:50px;
    background-color:#f4f3ee;
}
#news .inner{
    display:block;
    width:100%;
    height:auto;
}
#news .inner .head_area{
    display:block;
    width:100%;
    height:auto;
}
#news .inner .head_area h2{
    display:block;
    width:100%;
    height:auto;
    color:#87796f;
    font-size:1.3rem;
    font-weight:bold;
    font-family:"Fredoka";
    text-align:center;
    letter-spacing:0.2rem;
    margin-bottom:30px;
    position:relative;
}
#news .inner .body_area{
    display:block;
    width:100%;
    height:auto;
    padding:0 10%;
}
#news .inner .body_area dl{
    display:flex;
    width:100%;
    height:auto;
    flex-wrap:wrap;
    margin-bottom:30px;
}
#news .inner .body_area dl dt{
    display:flex;
    width:auto;
    height:auto;
    font-size:1.1rem;
    border-bottom:1px dotted var(--fontcolor);
    padding:10px 5px 10px 30px;
}
#news .inner .body_area dl dt span.date{
    display:block;
    width:fit-content;
    margin-right:10px;
}
#news .inner .body_area dl dt span.category{
    display:block;
    width:100px;
    font-size:1.0rem;
    font-family:'Fredoka';
    color:white;
    background-color:var(--fontcolor);
    margin-right:30px;
    letter-spacing: 0.3em;
}
#news .inner .body_area dl dd{
    display:flex;
    width:70%;
    height:auto;
    font-size:1.1rem;
    text-align:left;
    border-bottom:1px dotted var(--fontcolor);
    padding:10px 5px;
}
#news .inner .body_area dl dt:nth-of-type(1){
    border-top:1px dotted var(--themecolor);
}
#news .inner .body_area dl dd:nth-of-type(1){
    border-top:1px dotted var(--themecolor);
}
#news .inner .body_area a.btn{
    display:block;
    width:fit-content;
    height:auto;
    color:white;
    background-color:var(--fontcolor);
    border-radius:30px;
    padding:0.5em 3em;
    margin:0 auto 50px auto;
}
/*******************************************************************************************
about
*******************************************************************************************/
#about {
    background-color:white;
    padding-bottom:100px;
}
#about .inner h2{
    /*color:#eff4c4;*/
    color:#f4e3dd;
    font-size:7.0rem;
    font-family:"Fredoka";
    font-weight:bold;
    line-height:5rem;
}
#about .inner .title_sub{
    display:block;
    width:fit-content;
    height:auto;
    color:#d48c87;
    font-size:1.5rem;
    font-weight:bold;
    position:relative;
    margin:0 auto 100px auto;
}
#about .inner .title_sub::before{
    content:"";
    display:block;
    width:50px;
    height:50px;
    background-color:#d48c87;
    background-image:url(/public/img/palette_icon.svg);
    background-repeat:no-repeat;
    background-size:35px 35px;
    background-position:center center;
    border-radius:0 50% 50% 50%;
    position:absolute;
    top:50%;
    left:0;
    translate:-100% -50%;
}
#about .inner .box{
    display:flex;
    width:100%;
    height:auto;
    margin-bottom:30px;
}
#about .inner .box .img_area{
    display:block;
    width:25%;
}
#about .inner .box .img_area .img_inner{
    display:block;
    width:100%;
    height:auto;
    aspect-ratio:1 / 1;
    border-radius:50% 0 50% 0;
    overflow:hidden;
}
#about .inner .box .img_area .img_inner img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
}
#about .inner .box .text_area{
    display:block;
    text-align:left;
    padding:0 5%;
}
#about .inner .box .text_area p.title{
    color:#666666;
    font-size:2rem;
    margin-bottom:20px;
}
#about .inner .box .text_area p.text{
    color:#666666;
    font-size:1.1rem;
}
#about .inner a.btn{
    display:block;
    width:fit-content;
    height:auto;
    color:#d48c87;;
    font-size:1.2rem;
    background-image:url(/public/img/arrow_right_pink.svg);
    background-repeat:no-repeat;
    background-size:25px 25px;
    background-position:left 1.5em center;
    border:3px solid #d48c87;
    border-radius:30px;
    padding:0.5em 4em;
    margin:0 auto;
}
/*******************************************************************************************
profile
*******************************************************************************************/
#profile{
    background-color:#fbeeed;
    padding-bottom:100px;
}
#profile .inner h2{
    color:white;
    font-size:7.0rem;
    font-family:"Fredoka";
    font-weight:bold;
    line-height:5rem;
}
#profile .inner .title_sub{
    display:block;
    width:fit-content;
    height:auto;
    color:#75b3ca;
    font-size:1.5rem;
    font-family:'MPLUS1';
    font-weight:bold;
    position:relative;
    margin:0 auto 30px auto;
}
#profile .inner .title_sub::before{
    content:"";
    display:block;
    width:50px;
    height:50px;
    background-color:#75b3ca;
    background-image:url(/public/img/group_icon.svg);
    background-repeat:no-repeat;
    background-size:contain;
    background-position:center center;
    border-radius:0 50% 50% 50%;
    position:absolute;
    top:50%;
    left:0;
    translate:-100% -50%;
}
#profile .inner .comment{
    color:#666666;
    font-size:1.1rem;
    font-weight:bold;
    margin-bottom:50px;
}
#profile .inner .box{
    display:flex;
    width:100%;
    height:auto;
    justify-content:space-between;
    padding:0 10%;
    margin-bottom:50px;
}
#profile .inner .box .item{
    display:block;
    width:25%;
    height:auto;
}
#profile .inner .box .item .img_area{
    display:block;
    width:100%;
    height:atuo;
    aspect-ratio:1 / 1;
    border-radius:50% 0 50% 50%;
    overflow:hidden;
}
#profile .inner .box .item .img_area img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
}
#profile .inner .box .item .text_area .name_jp{
    color:#666666;
    font-size:1.3rem;
    font-weight:bold;
}
#profile .inner .box .item .text_area .name_en{
    color:#8ac7de;
    font-size:1.0rem;
    font-weight:bold;
    font-family:'Fredoka';
}
#profile .inner a.btn{
    display:block;
    width:fit-content;
    height:auto;
    color:#75b3ca;
    font-size:1.1rem;
    font-weight:bold;
    background-image:url(/public/img/arrow_right_blue.svg);
    background-repeat:no-repeat;
    background-size:25px 25px;
    background-position:left 1.5em center;
    border:3px solid #75b3ca;
    border-radius:30px;
    padding:0.5em 3em 0.5em 5em;
    margin:0 auto;
}
/*******************************************************************************************
works 
*******************************************************************************************/
#works{
    background-color:white;
    padding-bottom:100px;
}
#works .inner h2{
    color:#f4e3dd;
    font-size:7.0rem;
    font-family:"Fredoka";
    font-weight:bold;
    line-height:5rem;
}
#works .inner .title_sub{
    display:block;
    width:fit-content;
    height:auto;
    color:#d48c87;
    font-size:1.5rem;
    font-family:'MPLUS1';
    font-weight:bold;
    position:relative;
    margin:0 auto 30px auto;
}
#works .inner .title_sub::before{
    content:"";
    display:block;
    width:50px;
    height:50px;
    background-color:#d48c87;
    background-image:url(/public/img/pen_icon.svg);
    background-repeat:no-repeat;
    background-size:35px 35px;
    background-position:center center;
    border-radius:0 50% 50% 50%;
    position:absolute;
    top:50%;
    left:0;
    translate:-100% -50%;
}
#works .inner .comment{
    color:#666666;
    font-size:1.1rem;
    font-weight:bold;
    margin-bottom:50px;
}
#works .inner .works_slider{
    margin-bottom:50px;
}
#works .inner .works_slider .item{
    display:block;
    margin:0 20px;
}
#works .inner a.btn{
    display:block;
    width:fit-content;
    height:auto;
    color:#d48c87;;
    font-size:1.1rem;
    font-weight:bold;
    background-image:url(/public/img/arrow_right_pink.svg);
    background-repeat:no-repeat;
    background-size:25px 25px;
    background-position:left 1.5em center;
    border:3px solid #d48c87;;
    border-radius:30px;
    padding:0.5em 3em 0.5em 5em;
    margin:0 auto;
}
/*******************************************************************************************
footer トップへ戻るボタン    
*******************************************************************************************/
#footer{
    display:block;
    width:100%;
    height:auto;
    background-color:var(--themecolor);
    position:relative;
}
#footer #return_top_btn{
    display:block;
    width:3.5rem;
    height:3.5rem;
    right: 0;
    z-index:19;/*ハンバーガーメニュー表示中は後ろに隠す*/
    scroll-behavior:smooth;
}
#footer #return_top_btn img{
    display:block;
    width:100%;
    height:100%;
    object-fit:contain;
}
/*******************************************************************************************
footer
*******************************************************************************************/
#footer #footer_menu .inner{
    display:flex;
    width:100%;
    height:auto;
    flex-wrap:wrap;
    padding-top:80px;
}
#footer #footer_menu .inner .contact_area{
    display:flex;
    width:67%;
    height:auto;
    flex-wrap:wrap;
}
#footer #footer_menu .inner .contact_area h2.title{
    display:block;
    width:100%;
    height:auto;
    font-size:1.5rem;
    font-weight:bold;
    margin-bottom:20px;
}
#footer #footer_menu .inner .contact_area h2.title_sub{
    display:block;
    width:100%;
    height:auto;
    font-size:1.1rem;
    font-weight:bold;
}
#footer #footer_menu .inner .contact_area .left_area{
    display:block;
    width:50%;
    height:auto;
}
#footer #footer_menu .inner .contact_area .left_area p.text{
    display:block;
    width:auto;
    height:auto;
    font-size:1.1rem;
    font-weight:bold;
    margin-bottom:20px;
}
#footer #footer_menu .inner .contact_area .left_area a.btn{
    display:block;
    width:fit-content;
    height:auto;
    font-size:1.2rem;
    color:white;
    background-color:#87796f;
    border-radius:40px;
    margin:0 auto;
    padding:1em 4em;
}
#footer #footer_menu .inner .contact_area .right_area{
    display:block;
    width:50%;
    height:auto;
}
#footer #footer_menu .inner .contact_area .right_area p.text{
    display:block;
    width:auto;
    height:auto;
    font-size:1.1rem;
    font-weight:bold;
    margin-bottom:20px;
}
#footer #footer_menu .inner .contact_area .right_area p.tel{
    display:block;
    width:auto;
    height:auto;
    font-size:2.5rem;
    font-weight:bold;
}
#footer #footer_menu .inner .contact_area .right_area p.comment{
    display:block;
    width:auto;
    height:auto;
    font-size:1.1rem;
    font-weight:bold;
}
#footer #footer_menu .inner .map_area{
    display:flex;
    width:30%;
    height:auto;
    flex-direction:column;
}
#footer #footer_menu .inner .map_area h2{
    display:block;
    width:100%;
    height:auto;
    font-size:1.5rem;
    font-weight:bold;
    margin-bottom:20px;
}
#footer #footer_menu .inner .map_area p.text{
    display:block;
    width:auto;
    height:auto;
    font-size:1.1rem;
    font-weight:bold;  
}
#footer #footer_menu .inner .menu_area{
    display:flex;
    width:100%;
    height:auto;
    flex-wrap:wrap;
    justify-content:center;
    padding-top:50px;
    margin-top:50px;
    border-top:1px solid var(--fontcolor);
}
#footer #footer_menu .inner .menu_area p.title{
    display:block;
    width:100%;
    height:auto;
    font-size:1.1rem;
    font-weight:bold;  
}
#footer #footer_menu .inner .menu_area p.title_sub{
    display:block;
    width:100%;
    height:auto;
    font-size:3.5rem;
    font-weight:bold;
    font-family:'Fredoka';
    line-height:3.5rem;
    margin-bottom:30px;
}
#footer #footer_menu .inner .menu_area ul.list{
    display:flex;
    width:100%;
    height:auto;
    justify-content:center;
    margin-bottom:30px;
}
#footer #footer_menu .inner .menu_area ul.list li.list_item{
    display:flex;
    width:auto;
    height:auto;
    padding:0 1%;
}
#footer #footer_menu .inner .menu_area ul.list li.list_item a.link{
    display:block;
    width:fit-content;
    height:auto;
    white-space:nowrap;
    font-size:1rem;
    line-height:1rem;
}
#footer #footer_menu .inner .menu_area .sns_area{
    display:flex;
    width:100%;
    height:auto;
    justify-content:center;
}
#footer #footer_menu .inner .menu_area .sns_area .item{
    display:block;
    width:30px;
    height:30px;
    overflow:hidden;
    margin:0 10px;
}
#footer #footer_menu .inner .menu_area .sns_area .item img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
}
/*コピーライト*/
#footer #copyright{
    display:block;
    width:100%;
    height:auto;

}
#footer #copyright .copyright_area{
    display:block;
    width:fit-content;
    height:auto;
    text-align:center;
    margin:0 auto;
}
#footer #copyright .copyright_area p{
    font-size:0.8rem;
}
#footer #copyright .webdesign_area{
    display:block;
    width:fit-content;
    height:auto;
    text-align:center;
    margin:0 auto;
}
#footer #copyright .webdesign_area p{
    font-size:0.7rem;
}
/*******************************************************************************************
アニメーション（共通）
*******************************************************************************************/
/*
アニメーション（スクロール時、右下にフェードイン）
フェードイン前の初期ポジションを指定用？
*/
.anime_slideBottom {
    opacity: 0;
    transform: translateY(20px);
    transition-property:all;
    transition-duration:0.5s;
    transition-delay:0s;
    transition-timing-function:ease-in-out;
}
/*******************************************************************************************
Media Queries
*******************************************************************************************/
@media only screen and (min-width: 1930px) {

}
/* Smaller than standard 1200 */
@media only screen and (max-width: 1199px) {

}
/* Smaller than standard 980 */
@media only screen and (max-width: 991px) {

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

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

}
/* Tablet Landscape */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {

}

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

}

/* All Mobile Sizes */
@media only screen and (max-width: 767px) {

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

}

/* Mobile Portrait Size */
/*@media only screen and (max-width: 479px) {*/
@media only screen and (max-width: 768px) {
    .wrapper {
        width:100%;
        max-width:100%;
        padding:0 20px;

    }
    /*PC用の文章改行を解除*/
    br.br_pc{
        display:none;
    }
    br.br_sm{
        display:block;
    }
    /*タイトル用*/
    .title_pc{
        display:none;
    }
    .title_sm{
        display:block;
    }
 
}
@media only screen and (max-width: 320px) {

}
/* Center menu vertically */
@media screen and (min-width: 1025px) {
	
}