@charset "utf-8";

/*============================
 font
============================*/
@import url('https://fonts.googleapis.com/css2?family=Zen+Old+Mincho&display=swap');
/* @import url('https://use.fontawesome.com/releases/v6.4.2/css/all.css'); */


/*============================
	html5 base style
============================*/
html,
body,
div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
pre,
address,
code,
em,
img,
a,
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,
figcaption,
figure,
picture,
footer,
header,
menu,
nav,
main,
section,
time,
mark,
audio,
video {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
    box-sizing: border-box;
}

article,
aside,
figcaption,
figure,
footer,
header,
menu,
nav,
main,
section,
picture {
    display: block;
}

ol,
ul {
    list-style: none;
}

a {
    text-decoration: none;
    color: #111111;
}

a:hover {
    color: #111111;
}

img,
svg,
video {
    /* width: 100%; */
    vertical-align: bottom;
}

img {
    -webkit-user-drag: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

input,
select {
    vertical-align: middle;
}

/* input,
select,
button {
    border: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    appearance: none;
} */

input:focus,
select:focus,
button:focus {
    outline: 0;
}

/*============================
    module style
============================*/
html {
    font-size: 62.5%;
}


html.active {
    overflow-y: hidden;
}

body {
    font-weight: 400;
    background: #fff;
    color: #111111;
    font-family: "Yu Gothic Medium", YuGothic, 'Hiragino Kaku Gothic Pro', 'Meiryo', 'MS PGothic', sans-serif;
    margin: 0;
    position: relative;
    min-width: auto;
    font-feature-settings: "palt";
    overflow: auto;
}


#root {
    overflow: hidden;
}

p,
li,
dt,
dd,
h3,
h4,
h5,
span {
    font-weight: 400;
    line-height: 1.6;
    letter-spacing: .05em;
}


/*----------------------------
  layout
-----------------------------*/
.flex {
    display: block;
}

.flexwrap {
    flex-wrap: wrap;
    width: 100%;
}

.jc-between {
    justify-content: space-between;
}

.jc-around {
    justify-content: space-around;
}

.jc-center {
    justify-content: center;
}

.jc-end {
    justify-content: flex-end;
}

.align-items {
    align-items: center;
}

.fd-reverse {
    flex-direction: row-reverse;
}

.block {
    display: block;
}

.inline {
    display: inline;
}

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

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

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

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

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

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

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

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

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

@media screen and (min-width:768px) {
    .flex {
        display: flex;
        display: -webkit-flex;
        display: -ms-flex;
    }
}

@media screen and (min-width:768px) {
    .mb-150 {
        margin-bottom: 100px;
    }

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

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

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

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

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

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

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

}

@media screen and (min-width:1025px) {

    .w-20 {
        width: 20%;
    }

    .w-25 {
        width: 25%;
    }

    .w-45 {
        width: 45%;
    }

    .w-70 {
        width: 70%;
    }

    .w-auto {
        width: auto;
    }

    .w-full {
        width: 100%;
    }

    .block {
        display: block;
    }

    .block-center {
        display: block;
        margin: auto;
    }

    .icon:before {
        content: "";
        display: inline-block;
        background-repeat: no-repeat;
    }

    .of-hidden {
        overflow: hidden;
    }

    .wp-nowrap {
        white-space: nowrap;
    }

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

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

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

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

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

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

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

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

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

    .mb-0 {
        margin-bottom: 0;
    }

    .mb-1e {
        margin-bottom: 1em;
    }

    .mr-1e {
        margin-right: 1em;
    }

    .mr-20 {
        margin-right: 20px;
    }

    .pl-1 {
        padding-left: 1em;
    }
}


/*----------------------------
  text
-----------------------------*/
/* @font-face {
    font-family: 'agencyfb';
    src: url('../font/AgencyFB-Bold.ttf')format('truetype');
} */

.font-en {
    font-family: "Zen Old Mincho", serif;
    font-weight: 400;
    font-style: normal;
}

.font-min {
    font-family: "Zen Old Mincho", 'Yu Mincho', 'YuMincho', 'Hiragino Mincho Pro', 'MS PMincho', serif;
}

.font-go {
    font-family: "Yu Gothic Medium", YuGothic, 'Hiragino Kaku Gothic Pro', 'Meiryo', 'MS PGothic', sans-serif;
}

.font-ex {
    font-family: "Noto Serif JP", serif;
    font-optical-sizing: auto;
    font-weight: 300;
    font-style: normal;
}

.font-num {
    font-family: "Yu Gothic Medium", YuGothic, 'Hiragino Kaku Gothic Pro', 'Meiryo', 'MS PGothic', sans-serif;
}

.wr-vt {
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    font-feature-settings: initial;
}

.fuchidori {
    text-shadow: 1px 1px 0 #FFF, -1px -1px 0 #FFF,
        -1px 1px 0 #FFF, 1px -1px 0 #FFF,
        0px 1px 0 #FFF, 0 -1px 0 #FFF,
        -1px 0 0 #FFF, 1px 0 0 #FFF;
}

.bold {
    font-weight: bold;
}

.al-center {
    text-align: center;
}

.al-right {
    text-align: right;
}

.al-left {
    text-align: left;
}

.line-h-22 {
    line-height: 22px;
}

.indent {
    padding-left: 1em;
    text-indent: -1em;
}

/* font-size */
.fs-80 {
    font-size: 4rem;
}

.fs-70 {
    font-size: 4rem;
}

.fs-60 {
    font-size: 3rem;
}

.fs-50 {
    font-size: 2.4rem;
}

.fs-46 {
    font-size: 2rem;
}

.fs-40 {
    font-size: 2rem;
}

.fs-38 {
    font-size: 2rem;
}

.fs-36 {
    font-size: 1.8rem;
}

.fs-34 {
    font-size: 1.8rem;
}

.fs-32 {
    font-size: 1.8rem;
}

.fs-30 {
    font-size: 1.6rem;
}

.fs-28 {
    font-size: 1.6rem;
}

.fs-26 {
    font-size: 1.6rem;
}

.fs-24 {
    font-size: 1.6rem;
}

.fs-22 {

    font-size: 1.6rem;
}

.fs-20 {
    font-size: 1.6rem;
}

.fs-18 {
    font-size: 1.4rem;
}

.fs-15 {
    font-size: 1.3rem;
}

.fs-12 {
    font-size: 1rem;
}

.lh-2 {
    line-height: 2;
}

@media screen and (min-width:768px) {
    .fs-80 {
        font-size: 5rem;
    }

    .fs-70 {
        font-size: 4rem;
    }

    .fs-60 {
        font-size: 4rem;
    }

    .fs-50 {
        font-size: 3.6rem;
    }

    .fs-46 {
        font-size: 3rem;
    }

    .fs-40 {
        font-size: 3rem;
    }

    .fs-38 {
        font-size: 2.8rem;
    }

    .fs-36 {
        font-size: 2.4rem;
    }

    .fs-34 {
        font-size: 2.2rem;
    }

    .fs-32 {
        font-size: 2rem;
    }

    .fs-30 {
        font-size: 2rem;
    }

    .fs-28 {
        font-size: 2rem;
    }

    .fs-26 {
        font-size: 1.8rem;
    }

    .fs-24 {
        font-size: 1.8rem;
    }

    .fs-22 {
        font-size: 1.6rem;
    }

    .fs-20 {
        font-size: 1.6rem;
    }

    .fs-18 {
        font-size: 1.4rem;
    }

    .fs-15 {
        font-size: 1.4rem;
    }

    .fs-14 {
        font-size: 1.2rem;
    }

    .fs-12 {
        font-size: 1.2rem;
    }

}

@media screen and (min-width:1025px) {
    .fs-80 {
        font-size: 8rem;
    }

    .fs-70 {
        font-size: 7rem;
    }

    .fs-60 {
        font-size: 6rem;
    }

    .fs-50 {
        font-size: 5rem;
    }

    .fs-46 {
        font-size: 4.6rem;
    }

    .fs-40 {
        font-size: 4rem;
    }

    .fs-38 {
        font-size: 3.8rem;
    }

    .fs-36 {
        font-size: 3.6rem;
    }

    .fs-34 {
        font-size: 3.4rem;
    }

    .fs-32 {
        font-size: 3.2rem;
    }

    .fs-30 {
        font-size: 3rem;
    }

    .fs-28 {
        font-size: 2.8rem;
    }

    .fs-26 {
        font-size: 2.6rem;
    }

    .fs-24 {
        font-size: 2.4rem;
    }

    .fs-22 {
        font-size: 2.2rem;
    }

    .fs-20 {
        font-size: 2rem;
    }

    .fs-18 {
        font-size: 1.8rem;
    }

    .fs-15 {
        font-size: 1.5rem;
    }

    .fs-14 {
        font-size: 1.4rem;
    }

    .fw-500 {
        font-weight: 500;
    }

    .fw-600 {
        font-weight: 600;
    }

    .pl-2e {
        padding-left: 2em;
    }

    .lh-2 {
        line-height: 2;
    }
}



/*============================
    color
============================*/
.bg__wh {
    background: #fff;
}

.color-ma {
    color: #8f1d1d;
}

.color-wh {
    color: #fff;
}

.color-pu {
    color: #a56baa;
}

.color-gr {
    color: #73a955;
}

.color-or {
    color: #ec6d65;
}

.color-red {
    color: #d4000a;
}

.color-bl {
    color: #1f64c2;
}

.bg-ma {
    background: #727171;
}

.bg-ma02 {
    background: #dddddd;
}

.bg-lg {
    background: linear-gradient(90deg, #7c7c7c, #7b7b7b);
}

.bg_lg02 {
    background: -moz-linear-gradient(90deg, #ede4e4, #f7f4f4);
    background: -webkit-linear-gradient(90deg, #ede4e4, #f7f4f4);
    background: linear-gradient(90deg, #ede4e4, #f7f4f4);
}

.b_shadow {
    box-shadow: 0px 3px 20px rgba(175, 213, 163, .38);
}

/*----------------------------
  movie
-----------------------------*/
.ytwrap {
    position: relative;
    word-wrap: 100%;
    padding-bottom: 56.25%;

}

.ytwrap iframe {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

/*----------------------------
  space
-----------------------------*/
.m-auto {
    margin: auto;
}


/*----------------------------
  position
-----------------------------*/
.ps-r {
    position: relative;
}

.ps-a {
    position: absolute;
}

/*----------------------------
  list
-----------------------------*/
.list-style {
    list-style: disc;
}

.scale {
    transition: 0.5s;
}

.scale:hover {
    transform: scale(1.1);
    transition: 0.5s;
}

.spbr {
    display: none;
}

/*----------------------------
  responsive
-----------------------------*/


/* sp */
.pc {
    display: none;
}

.pcbr {
    display: inline;
}

.spbr {
    display: block;
}

body {
    font-size: 1.4rem;
}

.inner {
    padding: 0 5%;
}

.inner__mid {
    padding: 0 5%;
}

.inner__large {
    padding: 0 5%;
}

.sponly {
    display: block;
}

.spnone {
    display: none;
}

@media screen and (min-width:768px) {

    body {
        font-size: 1.4rem;
        min-width: auto;
    }

    .inner {
        padding: 0 3%;
    }

    .inner__mid {
        padding: 0 3%;
    }

    .inner__large {
        padding: 0 3%;
    }

    .sponly {
        display: none;
    }

    .spnone {
        display: block;
    }

    .pcbr {
        display: block;
    }

    .spbr {
        display: inline;
    }

}

@media screen and (min-width:1025px) {
    body {
        font-size: 1.5rem;
        min-width: auto;
    }

    .sp {
        display: none;
    }

    .sponly {
        display: none;
    }

    .inner {
        max-width: calc(1100px + 2%);
        margin: 0 auto;
        padding: 0 1%;
    }

    .inner__mid {
        max-width: calc(1520px + 2%);
        margin: 0 auto;
        padding: 0 1%;
    }

    .inner__large {
        max-width: calc(1820px + 2%);
        margin: 0 auto;
        padding: 0 1%;
    }

}



/*----------------------------
scroll animation
-----------------------------*/
/* のびる背景 */

/*背景色が伸びて出現 */
.active.bgextend {
    animation-name: bgextendAnimeBase;
    animation-duration: 1.5s;
    animation-fill-mode: forwards;
    position: relative;
    overflow: hidden;
    opacity: 0;
    display: block;
}

@keyframes bgextendAnimeBase {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/*中の要素*/
.bgappear {
    opacity: 0;
    display: block;
}

.active .bgappear {
    animation-name: bgextendAnimeSecond;
    animation-duration: .5s;
    animation-delay: 1.2s;
    animation-fill-mode: forwards;
}

@keyframes bgextendAnimeSecond {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

/*--------- 左から --------*/
.bgLRextend::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0;
    background-color: #1f7adb;
    /*伸びる背景色の設定*/
}

.active.bgLRextend::before {
    animation-name: bgLRextendAnime;
    animation-duration: 1s;
    animation-delay: .5s;
    animation-fill-mode: forwards;
    background-color: #1f7adb;
    z-index: 9;
    /*伸びる背景色の設定*/

}

@keyframes bgLRextendAnime {
    0% {
        transform-origin: left;
        transform: scaleX(0);
        opacity: 0;
    }

    1% {
        opacity: 1;
    }

    50% {
        transform-origin: left;
        transform: scaleX(1);
        opacity: 1;
    }

    50.001% {
        transform-origin: right;
        opacity: 1;
    }

    100% {
        transform-origin: right;
        transform: scaleX(0);
        opacity: 1;
    }
}


/*--------- 右から --------*/
.bgRLextend::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0;
    background-color: #223a70;
    /*伸びる背景色の設定*/
}

.active.bgRLextend::before {
    animation-name: bgRLextendAnime;
    animation-duration: 1s;
    animation-delay: .5s;
    animation-fill-mode: forwards;
    background-color: #223a70;
    /*伸びる背景色の設定*/

}

@keyframes bgRLextendAnime {
    0% {
        transform-origin: right;
        transform: scaleX(0);
        opacity: 0;
    }

    1% {
        opacity: 1;
    }

    50% {
        transform-origin: right;
        transform: scaleX(1);
        opacity: 1;
    }

    50.001% {
        transform-origin: left;
        opacity: 1;
    }

    100% {
        transform-origin: left;
        transform: scaleX(0);
        opacity: 1;
    }
}

/*============================
	text-animation
============================*/
.smoothText {
    overflow: hidden;
    display: block;
}

/* アニメーションで傾斜がついている文字列を水平に戻す*/
.smoothTextTrigger {
    transition: 1s ease-in-out;
    transform: translate3d(0, 100%, 0) skewX(12deg);
    transform-origin: left;
    display: block;
}

.smoothTextTrigger.smoothTextAppear {
    transform: translate3d(0, 0, 0) skewX(0);
}

/*========= 流れるテキスト ===============*/

/*全共通*/

.slide-in {
    overflow: hidden;
    display: inline-block;
    opacity: 0;
}

.slide-in_inner {
    display: inline-block;

}

/*左右のアニメーション*/
.leftAnime {
    opacity: 0;
    /*事前に透過0にして消しておく*/
}

.slide-in-active {
    animation-name: slideTextX100;
    animation-duration: 1s;
    animation-fill-mode: forwards;
    opacity: 0;
}

@keyframes slideTextX100 {
    from {
        transform: translateX(-100%);
        /*要素を左の枠外に移動*/
        opacity: 0;
    }

    to {
        transform: translateX(0);
        /*要素を元の位置に移動*/
        opacity: 1;
    }
}

.slide-inner.active {
    animation-name: slideTextX-100;
    animation-duration: 1s;
    animation-fill-mode: forwards;
    opacity: 0;
}


@keyframes slideTextX-100 {
    from {
        transform: translateX(100%);
        /*要素を右の枠外に移動*/
        opacity: 0;
    }

    to {
        transform: translateX(0);
        /*要素を元の位置に移動*/
        opacity: 1;
    }
}

/*============================
	parts
============================*/

.marker {
    background: linear-gradient(transparent 60%, #8b0000 0%);
    display: inline;
    padding: .1em;
}

/* hover zoom */
/*　画像の拡大　*/

.zoomIn img {
    transform: scale(1);
    transition: .5s ease-in-out;
    /*移り変わる速さを変更したい場合はこの数値を変更*/
}

.zoomIn:hover img {
    /*hoverした時の変化*/
    transform: scale(1.05);
    /*拡大の値を変更したい場合はこの数値を変更*/
}

.mask {
    display: block;
    line-height: 0;
    /*行の高さを0にする*/
    overflow: hidden;
    /*拡大してはみ出る要素を隠す*/
}

.wow {
    animation-duration: 1s;
}




/*============================
	index 共通
============================*/
/* sp */

/* btn ▼*/
.link__btn {
    display: block;
    position: relative;
    white-space: nowrap;
    max-width: 100%;
    width: fit-content;
    line-height: 1.5;
    display: flex;
    align-items: center;
    font-weight: 400;
    letter-spacing: .075em;
    transition: .3s ease-out;
}

.link__btn p {
    line-height: 1.5;
    font-weight: 400;
    letter-spacing: .075em;
}

.link__btn:hover {
    color: #8f1d1d;
}

.link__btn .arw {
    width: 40px;
    height: auto;
    margin-left: 1em;
    transition: .3s ease-out;
}

.link__btn:hover .arw {
    transform: translate(10px);
}

.link__btn02 {
    display: block;
    position: relative;
    white-space: nowrap;
    max-width: 100%;
    width: 220px;
    height: 45px;
    line-height: 1.5;
    display: flex;
    align-items: center;
    justify-content: center;
    border: solid 1px #111111;
    font-weight: 400;
    letter-spacing: .075em;
    transition: .3s ease-out;
}

.link__btn02 p {
    line-height: 1.5;
    font-weight: 400;
    letter-spacing: .075em;
}

.link__btn02:hover {
    background: #111111;
    color: #fff;
    opacity: 1;
}

.link__btn02::before {
    content: "";
    position: absolute;
    width: 40px;
    height: 8px;
    background: url(../images/btn_arw.png) no-repeat center center/contain;
    top: 50%;
    right: 5%;
    transform: translate(0, -50%);
    transition: .3s ease-out;
}

.link__btn02:hover::before {
    right: 3%;
    background: url(../images/btn_arw_wh.png) no-repeat center center/contain;
}

.link__btn02.-wh {
    color: #fff;
    border-color: #fff;
}

.link__btn02.-wh::before {
    background: url(../images/btn_arw_wh.png) no-repeat center center/contain;
}

.link__btn02.-wh:hover {
    background-color: #fff;
    color: #111;
}

.link__btn02.-wh:hover::before {
    background: url(../images/btn_arw.png) no-repeat center center/contain;
}

/* btn ▲*/
.section__ttl,
.section__ttl .txt {
    position: relative;
    line-height: 1;
    white-space: nowrap;
    font-weight: 400;
    display: block;
    letter-spacing: .05em;
}

.section__ttl .font-en {
    letter-spacing: .05em;
    display: block;
    line-height: 1;
    font-weight: 400;
    white-space: nowrap;
    position: relative;
}

.section__ttl img {
    width: auto;
    display: block;
}

.section__ttl .dot {
    width: 35px;
    margin: 0 auto 1em;
}

.lg-txt {
    background: linear-gradient(50deg, #7d5c0d, #a08034, #7d5c0d);
    width: fit-content;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.section__ttl .-bd::before {
    content: "";
    position: absolute;
    width: 1em;
    height: 1px;
    background: #a98465;
    left: 0;
    top: -.3em;
}

@media screen and (min-width:768px) {
    /* btn ▼*/

    .link__btn .arw {
        width: 50px;
    }

    .link__btn02 {
        width: 280px;
        height: 60px;
    }

    .link__btn::before {
        width: 50px;
        height: 8px;
    }

}

@media screen and (min-width:1025px) {
    /* btn ▼*/

    .link__btn .arw {
        width: 60px;
    }

    .link__btn02 {
        width: 380px;
        height: 70px;
    }

    .link__btn::before {
        width: 60px;
        height: 10px;
    }
}


/* main_visual
-----------------------------*/
#sub_visual.kv{padding: 0;padding-top:130px;}
#sub_visual {padding-top: 130px;background: url(../img/common/sub_visual.png) no-repeat center;height: 350px;position: relative;z-index: 0;background-size: cover;width: 100%;margin: 0 auto;z-index:10;}
#sub_visual  .span{ width: auto;margin-bottom: 10px;display: block;font-size: 30px;padding: 0;text-align: center;color: #fff; margin: 0 auto;font-family: "Zen Old Mincho", serif; writing-mode: vertical-rl;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);line-height: 0.5;white-space: nowrap;letter-spacing: 0;background-color: #8f1d1d;padding: 30px 35px;z-index: 2; }
#sub_visual .span::after{ content: "";position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%) translate(-90px, 70px) rotate(-18deg);width: 180px;height: 180px;background: url(../img/common/illust.png) no-repeat center / contain;z-index: 1;opacity: .9;pointer-events: none;}

/* bread_crumb_list
-----------------------------*/
#sub_contents .bread_crumb_list{background:rgba(0,0,0,.6);position:absolute;width:100%; top:-45px;line-height:100%;}
#sub_contents .bread_crumb{text-align:right;padding:0px;max-width:94%;margin:0 auto;margin-bottom:30px;padding-top: 20px;}
#sub_contents .bread_crumb div { display:inline;color:#fff;}
#sub_contents .bread_crumb div:after {content : '＞';padding-left:10px; font-family: inherit; font-size:13px;}
#sub_contents .bread_crumb div:last-child:after { content : '';}
#sub_contents .bread_crumb div a {text-decoration:underline;color:#fff;font-size:13px;}
#sub_contents .bread_crumb p{margin-bottom:0px; font-size:13px;}

/* sub_contents
----------------------------------- */
#sub_contents {font-size: 16px; position: relative;;background-attachment: fixed; background: url(../img/common/sub_bg.png) repeat center center; padding-bottom:1px;}
#sub_contents p{font-size: 14px;}
#sub_contents .section{max-width: 1280px;width: 94%;position: relative;margin: 0px auto 100px;padding: 0;}
#sub_contents .h2{ text-align: center;font-size:40px;  position: relative; line-height: 100%; padding-top:15px;margin-top: 55px;scroll-margin-top: 100px; margin-bottom: 50px;}
#sub_contents .col_whi{ color: #fff !important;}
#sub_contents .sub_ttl {text-align:center;margin-bottom:30px;border-bottom:1px solid #8f1d1d;}
#sub_contents .sub_ttl h2{ position: relative;text-align: center;font-size:20px; line-height: 130%;letter-spacing: 0.08em;font-weight: 500;display:inline-block;padding:10px 0 20px 0;font-family: "Zen Old Mincho", serif;}
#sub_contents .sub_ttl h2:before {content: '';position: absolute;top: -50px;display: inline-block;width: 60px;height: 60px;background: url(../img/common/sub_ttl_icon.png)no-repeat;right: 0;left: 0;margin: 0 auto;background-size:contain;}
#sub_contents .mb10{margin-bottom: 10px;}
#sub_contents .mb20{margin-bottom: 20px;}
#sub_contents .mb30{margin-bottom: 30px;}
#sub_contents .mb50{margin-bottom: 50px;}
#sub_contents .mb100{margin-bottom: 100px;}
#sub_contents .mb150{margin-bottom: 150px;}
#sub_contents .mt80{margin-top: 80px;}
#sub_contents .mt30{margin-top: 30px;}
#sub_contents .gap-20{gap: 30px;}
#sub_contents .txt_cen strong{ text-align: center; font-weight: bold;font-size: 23px;padding-bottom: 50px;}
#sub_contents .txt_cen{ text-align: center;  line-height: 200%;}
#sub_contents .txt_cen em{font-style: normal !important;display: block;    margin-bottom: -20px;}

/* tab
-----------------------------*/
#sub_contents .tab_area {display: grid;grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));column-gap: 10px;row-gap: 10px;}
#sub_contents .tab {padding: 15px 0; font-size: 18px;text-align: center;cursor: pointer;transition: all ease 0.3s; position: relative; border: 1px solid #86511d; margin-bottom: 0px;}
#sub_contents .tab p {font-size: 18px;display: inline; font-weight: bold;}
#sub_contents .tab.is-active {padding: 15px 0; background: #86511d;color: #fff; margin-bottom: 0px;}
#sub_contents .panel {display: none;}
#sub_contents .panel.is-active {display: block;background-size: cover;padding: 30px 0 0;}

/* btn
-----------------------------*/
#sub_contents .anker__items{column-gap: 2%;row-gap: 10px;}
#sub_contents .anker__item{width: 100%;height: 50px;position: relative;display: block;}
#sub_contents .anker__item a {display: flex;justify-content: center;align-items: center;gap: 8px;text-align: center;background: #8f1d1d;border: 1px solid #8f1d1d;color: #fff;position: relative;padding: 0 16px; height: 50px;}
#sub_contents .anker__item a::after {content: "";display: inline-block;width: 7px;height: 7px;border-left: 2px solid white;border-bottom: 2px solid white;transform: rotate(-45deg);margin-left: 15px;top: 1px;}
#sub_contents .anker__item a:hover{opacity:.8;background: #fff;color:#8f1d1d;}
#sub_contents .anker__item a:hover::after {border-left: 2px solid #8f1d1d;border-bottom: 2px solid #8f1d1d;}
#sub_contents .anker__item p {line-height: 50px;font-size:15px;}
#link01,#link02,#link03,#link04,#link05,#link06,#link07,#link08,#link09,#link10,#link11,#link12{margin-top:-120px;padding-top:120px;}

#sub_contents .link__items{column-gap: 2%;row-gap: 10px;}
#sub_contents .link__item{width: 100%;height: 50px;position: relative;display: block;}
#sub_contents .link__item a {display: flex;justify-content: center;align-items: center;gap: 8px;text-align: center;background: #8f1d1d;border: 1px solid #8f1d1d;color: #fff;position: relative;padding: 0 16px; height: 50px;}
#sub_contents .link__item a:hover{opacity:.8;background: #fff;color:#8f1d1d;}
#sub_contents .link__item a:hover::after {border-left: 2px solid #8f1d1d;border-bottom: 2px solid #8f1d1d;}
#sub_contents .link__item p {line-height: 50px;font-size:15px;}

/* about
-----------------------------*/
#sub_contents .feature_txt{font-size: 15px;text-align: left;}
#sub_contents .feature_txt .ul{font-size: 18px;margin: 30px 0;display: inline-block;text-align: left;text-align: left;width: 100%;padding: 20px;background: #fff;box-shadow: 4px 4px 40px #eee;}
#sub_contents .feature_txt .ul .p{border-top: 1px solid #403a36;padding-top: 20px;}
#sub_contents .feature_txt .ul .li .b{font-size:40px;font-weight:bold;display: block;margin-right: 15px;color: #8f1d1d;font-family: "Zen Old Mincho", serif;}
#sub_contents .feature_txt .ul .li .span{display: block;font-size: 17px;letter-spacing: 0;margin-bottom: 10px;font-weight: bold;color: #8f1d1d;font-family: "Zen Old Mincho", serif;}
#sub_contents .about_area .img img{margin-bottom: 10px;}
#sub_contents .about_area .img img{aspect-ratio: 2/1; object-fit: cover;}sub
#sub_contents .about_area .txt_area .span{display: block;font-size: 18px;margin-bottom: 10px;font-weight: bold;margin: 10px 0;font-family: "Zen Old Mincho", serif;}
#sub_contents .about_area .txt_area .p{border-top: 1px solid #8f1d1d;padding-top: 20px;}
#sub_contents .img_flex .img{width: 100%;}
#sub_contents .img_flex .img img{aspect-ratio: auto; object-fit: cover;}
#sub_contents .img_flex .img .cap{font-family: "Zen Old Mincho", serif; font-weight: bold; font-size: 16px;}

/* for-tourists
-----------------------------*/
#sub_contents .sub_guide_bg{background: url(../img/common/sub_guide_bg.png) no-repeat top center / cover ; padding: 26px; background-size: cover;}
#sub_contents .sub_guide .guide_ttl{text-align:center; font-weight:bold; font-size:22px;line-height: 200%;font-family: "Zen Old Mincho", serif;}
#sub_contents .sub_guide p{text-align:left;font-size:16px;line-height: 200%;font-weight:normal; color:#fff;}
#sub_contents .onomichi_textBox .img{width: 100%; margin-bottom: 10px; position:relative;}
#sub_contents .onomichi_textBox .img img{width: 100%;height: 300px;object-fit: cover;}
#sub_contents .onomichi_textBox .textarea {width: 100%;margin-bottom:20px;}
#sub_contents .onomichi_textBox .textarea .ttl_en {font-size:14px;font-family: "Shippori Mincho", serif;}
#sub_contents .onomichi_textBox .textarea .ttl_ja {font-size:16px;font-weight: 500;margin-bottom:20px;}
#sub_contents .onomichi_textBox .textarea p {line-height:2;}
#sub_contents .onomichi_textBox .textarea p.onomichi_name {border-bottom: solid 1px;margin-bottom: 20px;font-weight: bold;font-size: 17px; font-family: "Zen Old Mincho", serif;}
#sub_contents .onomichi_textBox .textarea p.onomichi_ttl {font-weight: normal;margin-top: 0px;}
#sub_contents .sub_root{width: 100%;margin-bottom: 10px;background: url(../img/common/sub_bg_paper01.jpg);color: #fff;padding: 20px;}
#sub_contents .sub_root .num{background: #8f1d1d;color: #fff;padding: 10px 15px;margin-right: 5px;margin-bottom: 10px;font-size: 18px;display: block;}
#sub_contents .sub_root .ttl{font-weight: bold;font-size: 17px;letter-spacing: -0.11em;font-family: "Zen Old Mincho", serif;}
#sub_contents .access_area{text-align: left;background: #fff;padding: 30px 10px;display: flex;flex-direction: column;gap: 30px;}
#sub_contents .access_area .img{width: 100%;text-align: center;}
#sub_contents .access_area .img img{width: 100px;height: 100px;}
#sub_contents .access_area p{font-size: 14px;}
#sub_contents a.sub_btn{display:block; width:100%; margin: 5px 0; line-height: 30px; transition: all .5s; padding: 14px 20px;background: #8f1d1d;color: #fff;border: 1px solid #8f1d1d;}
#sub_contents a.sub_btn p{text-align: center;}

/* recruit
-----------------------------*/
#sub_contents .concept__area {width:100%;margin: 0;}
#sub_contents .concept__area .head__area {margin-bottom:10px;}
#sub_contents .concept__area .head__area .img img {object-fit: cover;aspect-ratio: 6 / 4;}
#sub_contents .concept__area .head__area .img .span {font-weight:500;font-size: 38px;line-height:2.5;margin-left:220px;}
#sub_contents .concept__area .head__area .img .strong {position: absolute;top:-80px;left:0;font-size:160px;font-weight:bold;color:#920000;}
#sub_contents .concept__area .txt_area {margin-bottom:50px;}
#sub_contents .concept__area .txt_area .txt_catch{font-size:20px;font-weight:500;margin-bottom:0px;display: inline-block;font-family: "Zen Old Mincho", serif;}

#sub_contents .tbl_info {margin-bottom:20px;}
#sub_contents .tbl_info .tr{width:100%;background:#fff;margin-bottom:2px;}
#sub_contents .tbl_info .th{width:100%;padding:10px 10px;background:#8f1d1d;color:#fff; text-align:left;}
#sub_contents .tbl_info .td{width:100%;padding:10px 30px 10px 10px;color:#000;}
#sub_contents .tbl_info a{color:#000;}

/* restaurant01 restaurant02
-----------------------------*/
#sub_contents .comm_textBox {position: relative;}
#sub_contents .comm_textBox .img{width: 100%;margin-bottom: 0px;position:relative;}
#sub_contents .comm_textBox .img img.daimaru{border: solid 3px #f39800;}
#sub_contents .comm_textBox .textarea {width: 100%;margin-bottom:2em;}
#sub_contents .comm_textBox .textarea .txt_point {font-size:17px; font-weight:bold;color: #8f1d1d;background:linear-gradient(transparent 60%, #fbdfdf 60%); line-height:150%;width: fit-content;}
#sub_contents .comm_textBox .textarea.daimaru {padding : 10px 30px 30px;background-color: #f3980050;}
#sub_contents .comm_textBox .textarea.akaboshi {padding : 10px 30px 30px;background-color: #c5010a50;}
#sub_contents .comm_textBox .textarea p {line-height:2;}
#sub_contents .comm_textBox .textarea p.concept {font-size: 16px;display: inline-block;}
#sub_contents .comm_textBox .textarea p.ttl.name {font-size: 22px;width: fit-content; color: #8f1d1d;font-weight: bold;}
#sub_contents .comm_textBox .textarea p.ttl.daimaru {border-bottom: double 4px #8f1d1d;}
#sub_contents .comm_textBox .textarea p.ttl {font-size: 18px;}
#sub_contents .comm_textBox .textarea p.number {font-size: 18px;margin-bottom: 5px;text-transform: uppercase;font-weight: bold;}
#sub_contents .comm_textBox .textarea p.kansuuji {font-size: 50px;margin-bottom: 0px;font-weight: bold;}
#sub_contents .comm_textBox .textarea .span{background: #8f1d1d;color: #fff;display: inline-block;padding: 0 10px;margin-top: 10px;}

#sub_contents .sub_ttl_02_box{ text-align: center; position: relative;width: 100%;}
#sub_contents .sub_ttl_02_box p.sub_ttl_02{ text-align: center;  line-height: 180%;font-size: 18px;font-weight: bold;z-index: 2;position: relative;margin-top: 15px;}
#sub_contents .sub_ttl_02::before{position: absolute;content: "";background: url(../img/common/sub_ill_01.png) no-repeat center center / cover ;width:70px;height:70px;bottom: -55px;left: 50%;transform: translate(-50%, -50%);z-index: -1;}

#sub_contents .tbl_menu {width: 100%;margin-inline: auto;display: inline-block;font-size:15px;}
#sub_contents .tbl_menu .tr {display: flex;align-items: flex-end;}
#sub_contents .tbl_menu .th {width: 80%;padding: 15px 0;line-height: 1.6;position: relative;}
#sub_contents .tbl_menu .th .menu_name::before {content: '●';color: #8f1d1d; margin-right: 2em;font-size: 10px;  vertical-align: middle; top: 0%; left:0; transform: translateY(-50%);position: absolute;}
#sub_contents .tbl_menu.yakuu .th .menu_name::before {content: '●';color: #8f1d1d; margin-right: 2em;font-size: 10px; vertical-align: middle; top: 50%; left: 0; transform: translateY(-50%);position: absolute;}
#sub_contents .tbl_menu .th .menu_name {font-weight: bold;padding-left:20px; position: relative;}
#sub_contents .tbl_menu .td {width: 24%;text-align: right;padding: 15px 0;line-height: 1.6;}
#sub_contents .tbl_menu .td .menu_price {font-weight: normal;}
#sub_contents .center_img {width:100%;text-align: center;}
#sub_contents .center_img img{max-width:600px;margin: 0 auto;object-fit: cover;}
#sub_contents .takeout_area{background: #fff;padding: 30px 10px 20px;margin-top: 30px;width: 100%;margin-inline: auto;}
#sub_contents .gal_list{gap: 10px;}
#sub_contents .gal_list img{width: 47%;}
#sub_contents .gallery_list .figure{position:relative; margin:0px 15px 50px;}
#sub_contents .gallery_list .figure .figurecaption{position:absolute; bottom:0px; background:#fff; padding:5px 15px;z-index:10; left:0px;}
#sub_contents .gallery_list .figure .figurecaption p{ font-size:20px; font-weight:bold; margin-bottom:0px;}
#sub_contents .menu_line .span {font-size: 20px; font-weight: bold; margin-bottom: 30px; text-align: center;}

/* shop
-----------------------------*/
#sub_contents .shop_area h2{font-size: 18px;}
#sub_contents .shop_area p{text-align: left;}
#sub_contents .online_area .img img{aspect-ratio: 2/1; object-fit: cover;}
#sub_contents .online_area .txt_area .span{display: block;font-size: 20px;margin-bottom: 10px;font-weight: bold;margin: 10px 0;font-family: "Zen Old Mincho", serif;}
#sub_contents .online_area .txt_area .p{border-top: 1px solid #8f1d1d;padding-top: 20px;}
#sub_contents .shop_ttl {margin-top:5px;padding: 0 0 5px 15px;font-size: 20px;font-weight:bold;text-align: left;border-left: 5px solid #8f1d1d; line-height: 1.5;position: relative;font-family: "Zen Old Mincho", serif;}
#sub_contents .image_txt{text-align: center;font-size: 16px;gap: 20px;}
#sub_contents .image_txt .item .span{background:#8f1d1d;color:#fff;display: inline-block;padding:20px;border-radius: 50%;font-size:24px;line-height: 1.1;font-weight: 700;font-family: 'Montserrat', sans-serif;margin-bottom: 20px;}
#sub_contents .image_txt .item .b{margin-top: 5px;font-weight: 500;letter-spacing: 0;font-size: 16px;}
#sub_contents .image_txt .item{display: block;width:100%;text-align: center;}
#sub_contents .shop_txt{text-align: left;font-size: 14px;background: #fff;padding: 35px;}
#sub_contents .shop_txt .ul{font-size: 16px;display: inline-block;}
#sub_contents .shop_txt .ul .li{border-bottom: 1px solid #8f1d1d;margin-top: 10px;padding-bottom: 5px;}
#sub_contents .shop_txt .ul .li .span{display: block;}
#sub_contents .shop_txt .ul .li::before{content: ""; background:url(../img/common/sub_shop_img02_01.png) no-repeat center center; background-size: contain; width: 25px; height:25px; display: inline-block; vertical-align: top; margin-right: 10px;}
#sub_contents .online_area02{text-align: left;background: #fff;padding: 30px 10px;display: flex;flex-direction: column;gap: 30px;}
#sub_contents .online_area02 .img{width: 100%;text-align: center;}
#sub_contents .online_area02 .img img{width: 100px;height: 100px;}
#sub_contents .online_area02 a{margin: 0 auto;line-height: 30px; transition: all .5s; padding: 14px 20px;background: #8f1d1d;color: #fff;border: 1px solid #8f1d1d;}
#sub_contents .online_area02 a:hover{background: #fff;color: #8f1d1d;border: 1px solid #8f1d1d;}
#sub_contents .online_area02 p{font-size: 14px;}

/* scene
-----------------------------*/
#sub_contents .scene_com{font-weight: bold;font-size: 18px;margin: 10px 0;font-family: "Zen Old Mincho", serif;}
#sub_contents .sub_scene .scene_ttl {padding: 5px;background: #8f1d1d;color: #fff;display: inline-block;margin-top: 10px;}
#sub_contents .sub_scene .scene_name{font-weight: bold;font-size: 20px;border-bottom: 1px solid #8f1d1d;margin: 10px 0;font-family: "Zen Old Mincho", serif;}

/* products
-----------------------------*/
#sub_contents .item_g_area {padding: 30px; border: 1px solid #86511d; position: relative;}
#sub_contents .item_g_area .img {width: 30%; margin-bottom:0px;}
#sub_contents .item_g_area .img img{width: 100%;}
#sub_contents .item_g_area .txt_area {width: 67%;}
#sub_contents .item_g_area .txt_area .ttl {position: relative; font-size:22px; font-weight: 600; letter-spacing: .04em; /*padding-bottom: 10px;*/}
#sub_contents .item_g_area .txt_area .bold{font-size:18px; font-weight: 600; text-transform:capitalize;}
#sub_contents .item_g_area .menu_list{display: flex;border-bottom: 1px solid #86511d;padding: 5px 0;}
#sub_contents .item_g_area .menu__name{width: calc(100% - 460px);}
#sub_contents .item_g_area .menu__price{width: 460px;}

/* contact
-----------------------------*/
#sub_contents .contact_area{display:flex;column-gap: 4%;align-items: center;}
#sub_contents .contact_list{width:280px;margin-inline: 0;}
#sub_contents .contact_list{margin-bottom: 20px;}
#sub_contents .contact_list:last-child{margin-bottom: 20px;}
#sub_contents .sub_illust{padding: 0;width:15%;}
#sub_contents .atten_bg{padding: 30px 40px; border-radius: 10px;}
#sub_contents .atten_bg::before {position: absolute;bottom: -8px;right: -8px;width: 100%; height:100%;background:none;border: 1px solid #86511d;content: '';z-index: 1; border-radius: 10px;}
#sub_contents .atten_bg p{text-align:left; font-weight:600; font-size:18px;line-height: 250%; position: relative; z-index: 2;}

/* news
-----------------------------*/
#sub_contents .cateList{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;margin:0 auto;padding:0;}
#sub_contents .cateList section.webgene-blog{display:contents;}
@supports not (display:contents){#sub_contents .cateList section.webgene-blog{display:flex;gap:10px;}}
#sub_contents .cateList .webgene-item{width:auto;margin:0;padding:0;}
#sub_contents .webgene-item.categorylist a{display:block;width:auto;text-align:center;padding:14px 10px;transition:.5s;color:#8f1d1d;font-weight:bold;border:1px solid #8f1d1d;text-decoration:none;line-height:1.2;margin-bottom:40px;}
#sub_contents .webgene-item.categorylist a:hover{background:#8f1d1d;color:#fff;border:1px solid #8f1d1d;}
#sub_contents .cateList p{margin:0;padding:0;line-height:inherit; font-weight:bold;}
#sub_contents .cateList .webgene-item.categorylist,#sub_contents .cateList article.webgene-item.categorylist{flex:1 1 auto;max-width:200px;}
#sub_contents .webgene-blog{display:flex;justify-content: start;column-gap: 1%;row-gap: 20px;flex-wrap: wrap;}
#sub_contents .webgene-item{width: 100%;}
#sub_contents .news_list {margin-top:-100px;}
#sub_contents .webgene-blog .webgene-item.news__item figure{width: 100%;aspect-ratio: 16/9;overflow: hidden;margin-bottom: 10px;}
#sub_contents .webgene-blog .webgene-item.news__item figure img{border-radius:20px;}
#sub_contents .webgene-blog .webgene-item.news_area {padding:0;}
#sub_contents .webgene-blog .news__date{font-family: "Zen Old Mincho", serif;/* margin-left: 10px; */display:inline-block;font-size:16px;margin-top: 10px;}
#sub_contents .webgene-blog .news_ttl{font-weight:normal; display:block; margin:10px 0; overflow: hidden;display: -webkit-box;text-overflow: ellipsis;-webkit-box-orient: vertical;-webkit-line-clamp: 3; font-size:16px;}

/* detail_news
-----------------------------*/
#sub_contents .webgene-blog .cnt-news-li h1, #sub_contents .webgene-blog .cnt-news-li h2, #sub_contents .webgene-blog .cnt-news-li h3, #sub_contents .webgene-blog .cnt-news-li h4 {font-size: 16px;}
#sub_contents .blog_h2{font-size: 20px;}
#sub_contents .cmn-blog-date{text-align:center;}
#sub_contents .area_blog{width: 100%; padding: 60px;}
#sub_contents .area_blog .cmn-blog-txt{font-size:16px;}
#sub_contents .btn_clear{margin: 30px auto;}
#sub_contents .area_blog figure{width: 62%;}
#sub_contents .webgene-item.detail{width: 100%;}
#sub_contents .news_detail{width: 100%;}
#sub_contents .news_detail .news_img {text-align: center;margin: 0 auto;width:100%;}
#sub_contents .news_detail .news_img img{width: auto; text-align: center; margin: 0 auto 10px;}
#sub_contents .news_detail .news_date{text-align: center; display: block;margin: 0 auto 20px;font-weight:500;font-family: "Zen Old Mincho", serif;font-weight:600;}
#sub_contents .news_text{background: #fff; padding: 20px;}
#sub_contents .news_detail .news_detail_ttl {font-size:20px;margin-bottom:20px;text-align:center;font-family: "Zen Old Mincho", serif;}

/* contact
-----------------------------*/
#sub_contents .contact_txt{text-align: center;font-size: 14px;}
/* PC  */
@media screen and (min-width: 768px) {

/* main_visual
-----------------------------*/
#sub_visual.kv{padding: 0;padding-top:130px;}
#sub_visual {padding-top: 130px;background: url(../img/common/sub_visual.png) no-repeat center;height: 450px;position: relative;z-index: 0;background-size: cover;width: 100%;margin: 0 auto;z-index:10;}
#sub_visual  .span{ width: auto;margin-bottom: 10px;display: block;font-size: 30px;padding: 0;text-align: center;color: #fff; margin: 0 auto;font-family: "Zen Old Mincho", serif; writing-mode: vertical-rl;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);line-height: 0.5;white-space: nowrap;letter-spacing: 0;background-color: #8f1d1d;padding: 30px 35px;z-index: 2; }
#sub_visual .span::after{ content: "";position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%) translate(-90px, 70px) rotate(-18deg);width: 180px;height: 180px;background: url(../img/common/illust.png) no-repeat center / contain;z-index: 1;opacity: .9;pointer-events: none;}

/* bread_crumb_list
-----------------------------*/
#sub_contents .bread_crumb_list{background:rgba(0,0,0,.6);position:absolute;width:100%; top:-45px;line-height:100%;}
#sub_contents .bread_crumb{text-align:right;padding:0px;max-width:1280px; width: 94%; margin:0 auto;margin-bottom:30px;padding-top: 20px;}
#sub_contents .bread_crumb div { display:inline;color:#fff;}
#sub_contents .bread_crumb div:after {content : '＞';padding-left:10px; font-family: inherit; font-size:13px;}
#sub_contents .bread_crumb div:last-child:after { content : '';}
#sub_contents .bread_crumb div a {text-decoration:underline;color:#fff;font-size:13px;}
#sub_contents .bread_crumb p{margin-bottom:0px; font-size:13px;}

/* sub_contents
----------------------------------- */
#sub_contents {font-size: 16px; position: relative;;background-attachment: fixed; background: url(../img/common/sub_bg.png) repeat center center; padding-bottom:1px;}
#sub_contents p{font-size: 16px;}
#sub_contents p.txt_red{font-size:130%; font-weight:bold;color:#b71111;}
#sub_contents .section{max-width: 1280px;width: 94%;position: relative;margin: 0px auto 100px;padding: 0;}
#sub_contents .h2{ text-align: center;font-size:40px;  position: relative; line-height: 100%; padding-top:15px;margin-top: 55px;scroll-margin-top: 100px; margin-bottom: 50px;}
#sub_contents .col_whi{ color: #fff !important;}
#sub_contents .sub_ttl {text-align:center;margin-bottom:30px;border-bottom:1px solid #8f1d1d;}
#sub_contents .sub_ttl h2{ position: relative;text-align: center;font-size:38px; line-height: 130%;letter-spacing: 0.08em;font-weight: 500;display:inline-block;padding:10px 0 20px 0;font-family: "Zen Old Mincho", serif;}
#sub_contents .sub_ttl h2:before {content: '';position: absolute;top: -50px;display: inline-block;width: 60px;height: 60px;background: url(../img/common/sub_ttl_icon.png)no-repeat;right: 0;left: 0;margin: 0 auto;background-size:contain;}
#sub_contents .mb10{margin-bottom: 10px;}
#sub_contents .mb20{margin-bottom: 20px;}
#sub_contents .mb30{margin-bottom: 30px;}
#sub_contents .mb50{margin-bottom: 50px;}
#sub_contents .mb100{margin-bottom: 100px;}
#sub_contents .mb150{margin-bottom: 150px;}
#sub_contents .mt80{margin-top: 80px;}
#sub_contents .mt30{margin-top: 30px;}
#sub_contents .gap-20{gap: 30px;}
#sub_contents .txt_cen strong{ text-align: center; font-weight: bold;font-size: 23px;padding-bottom: 50px;}
#sub_contents .txt_cen{ text-align: center;  line-height: 200%;}
#sub_contents .txt_cen em{font-style: normal !important;display: block;    margin-bottom: -20px;}

/* tab
-----------------------------*/
#sub_contents .tab_area {display: grid;grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));column-gap: 10px;row-gap: 10px;}
#sub_contents .tab {padding: 15px 0; font-size: 18px;text-align: center;cursor: pointer;transition: all ease 0.3s; position: relative; border: 1px solid #86511d; margin-bottom: 0px;}
#sub_contents .tab p {font-size: 18px;display: inline; font-weight: bold;}
#sub_contents .tab.is-active {padding: 15px 0; background: #86511d;color: #fff; margin-bottom: 0px;}
#sub_contents .panel {display: none;}
#sub_contents .panel.is-active {display: block;background-size: cover;padding: 30px 0 0;}

/* btn
-----------------------------*/
#sub_contents .anker__items{column-gap: 2%;row-gap: 10px;}
#sub_contents .anker__item{width: 48%;height: 50px;position: relative;display: block;}
#sub_contents .anker__item.w80{width: 80%;height: 50px;position: relative;display: block;}
#sub_contents .anker__item a {display: flex;justify-content: center;align-items: center;gap: 8px;text-align: center;background: #8f1d1d;border: 1px solid #8f1d1d;color: #fff;position: relative;padding: 0 16px; height: 50px;}
#sub_contents .anker__item a::after {content: "";display: inline-block;width: 7px;height: 7px;border-left: 2px solid white;border-bottom: 2px solid white;transform: rotate(-45deg);margin-left: 15px;top: 1px;}
#sub_contents .anker__item a:hover{opacity:.8;background: #fff;color:#8f1d1d;}
#sub_contents .anker__item a:hover::after {border-left: 2px solid #8f1d1d;border-bottom: 2px solid #8f1d1d;}
#sub_contents .anker__item p {line-height: 50px;font-size:15px;}
#link01,#link02,#link03,#link04,#link05,#link06,#link07,#link08,#link09,#link10,#link11,#link12{margin-top:-120px;padding-top:120px;}

#sub_contents .link__items{column-gap: 2%;row-gap: 10px;}
#sub_contents .link__item{width: 40%;height: 50px;position: relative;display: block;}
#sub_contents .link__item a {display: flex;justify-content: center;align-items: center;gap: 8px;text-align: center;background: #8f1d1d;border: 1px solid #8f1d1d;color: #fff;position: relative;padding: 0 16px; height: 50px;}
#sub_contents .link__item a:hover{opacity:.8;background: #fff;color:#8f1d1d;}
#sub_contents .link__item a:hover::after {border-left: 2px solid #8f1d1d;border-bottom: 2px solid #8f1d1d;}
#sub_contents .link__item p {line-height: 50px;font-size:15px;}

/* about
-----------------------------*/
#sub_contents .feature_txt{font-size: 15px;text-align: left;}
#sub_contents .feature_txt .ul{font-size: 18px;margin: 30px 0;display: inline-block;text-align: left;text-align: left;width: 100%;padding: 50px;background: #fff;box-shadow: 4px 4px 40px #eee;}
#sub_contents .feature_txt .ul .p{border-top: 1px solid #403a36;padding-top: 20px;}
#sub_contents .feature_txt .ul .li .b{font-size:70px;font-weight:bold;display: inline-block;margin-right: 15px;;color: #8f1d1d;}
#sub_contents .feature_txt .ul .li .span{display: inline-block;font-size: 25px;margin-bottom: 0;font-weight: bold;;color: #8f1d1d;}
#sub_contents .about_area .img img{margin-bottom: 0;}
#sub_contents .about_area .img img{aspect-ratio: auto; object-fit: cover;width: 49%;}
#sub_contents .about_area .txt_area .span{display: inline-block;font-size: 29px;margin-bottom: 0;font-weight: bold;margin: 10px 0;}
#sub_contents .about_area .txt_area .p{border-top: 1px solid #8f1d1d;padding-top: 20px;}
#sub_contents .img_flex .img{width: 49%;}
#sub_contents .img_flex.w33 .img{width: 32%;}
#sub_contents .img_flex.w33 .img img{width: 100%; height:300px; object-fit:cover;}
#sub_contents .img_flex .img img{aspect-ratio: auto; object-fit: cover;}
#sub_contents .img_flex .img .cap{font-family: "Zen Old Mincho", serif; font-weight: bold; font-size: 18px;}

/* for-tourists
-----------------------------*/
#sub_contents .sub_guide .guide_ttl{text-align:center; font-weight:bold; font-size:30px;line-height: 200%;margin-top: 40px;}
#sub_contents .sub_guide p{text-align:center;font-size:16px;line-height: 200%;font-weight:normal; color:#fff;}
#sub_contents .onomichi_textBox .img{width: 100%; margin-bottom: 10px; position:relative;}
#sub_contents .onomichi_textBox .img img{width: 100%;height: auto;object-fit: cover;}
#sub_contents .onomichi_textBox .textarea {width: 100%;margin-bottom:18px;}
#sub_contents .onomichi_textBox .textarea .ttl_en {font-size:14px;font-family: "Shippori Mincho", serif;}
#sub_contents .onomichi_textBox .textarea .ttl_ja {font-size:16px;font-weight: 500;margin-bottom:20px;}
#sub_contents .onomichi_textBox .textarea p {line-height:2;}
#sub_contents .onomichi_textBox .textarea p.onomichi_name {border-bottom: solid 1px;margin-bottom: 20px;font-weight: bold;font-size: 26px; font-family: "Zen Old Mincho", serif;}
#sub_contents .onomichi_textBox .textarea p.onomichi_ttl {font-weight: normal;margin-top: 0px;}
#sub_contents .sub_root{width: 100%;margin-bottom: 10px;margin-left: 10px;background: url(../img/common/sub_bg_paper01.jpg);color: #fff;padding: 30px;}
#sub_contents .sub_root .num{background: #8f1d1d;color: #fff;padding: 10px 15px;margin-right: 10px;margin-bottom: 10px;font-size: 18px;}
#sub_contents .sub_root .ttl{font-weight: bold;font-size: 19px;letter-spacing: 0;}
#sub_contents .access_area{text-align: center;padding: 60px 50px;}
#sub_contents .access_area .img{width: 100%;}
#sub_contents a.sub_btn{display:block; width:35%; margin: 0 5px; line-height: 30px; transition: all .5s; padding: 14px 20px;background: #8f1d1d;color: #fff;border: 1px solid #8f1d1d;}


/* recruit
-----------------------------*/
#sub_contents .concept__area {width:80%;margin:0 auto 100px;}
#sub_contents .concept__area .head__area {margin-bottom:30px;}
#sub_contents .concept__area .head__area .img img {object-fit: cover;aspect-ratio: 6 / 2;}
#sub_contents .concept__area .head__area .img .span {font-weight:500;font-size: 38px;line-height:2.5;margin-left:220px;}
#sub_contents .concept__area .head__area .img .strong {position: absolute;top:-80px;left:0;font-size:160px;font-weight:bold;color:#920000;}
#sub_contents .concept__area .txt_area {margin-bottom:50px;}
#sub_contents .concept__area .txt_area .txt_catch{font-size:24px;font-weight:500;margin-bottom:20px;display: inline-block;font-family: "Zen Old Mincho", serif; }

#sub_contents .tbl_info {margin-bottom:20px;}
#sub_contents .tbl_info .tr{width:100%;background:#fff;margin-bottom:2px;}
#sub_contents .tbl_info .th{width:24%;padding:10px 10px;background:#8f1d1d;color:#fff; text-align:center;}
#sub_contents .tbl_info .td{width:76%;padding:10px 30px 10px 30px;color:#000;}
#sub_contents .tbl_info a{color:#000;}

/* restaurant01 restaurant02
-----------------------------*/
#sub_contents .comm_textBox {position: relative;}
#sub_contents .comm_textBox .img{width: 50%;margin-bottom: 0px;position:relative;}
#sub_contents .comm_textBox .img img.daimaru{border: solid 3px #f39800;}
#sub_contents .comm_textBox .textarea {width: 45%;margin-bottom:2em;}
#sub_contents .comm_textBox .textarea.daimaru {padding : 10px 30px 30px;background-color: #f3980050;}
#sub_contents .comm_textBox .textarea.akaboshi {padding : 10px 30px 30px;background-color: #c5010a50;}
#sub_contents .comm_textBox .textarea p {line-height:2;}
#sub_contents .comm_textBox .textarea .txt_point {font-size:24px; font-weight:bold;color: #8f1d1d;background:linear-gradient(transparent 60%, #fbdfdf 60%); line-height:150%;}
#sub_contents .comm_textBox .textarea p.concept {font-size: 16px;display: inline-block;}
#sub_contents .comm_textBox .textarea p.ttl.name {font-size: 22px;width: fit-content; color: #8f1d1d;font-weight: bold;}
#sub_contents .comm_textBox .textarea p.ttl.daimaru {border-bottom: double 4px #8f1d1d;}
#sub_contents .comm_textBox .textarea p.ttl {font-size: 18px;}
#sub_contents .comm_textBox .textarea p.number {font-size: 18px;margin-bottom: 5px;text-transform: uppercase;font-weight: bold;}
#sub_contents .comm_textBox .textarea p.kansuuji {font-size: 50px;margin-bottom: 0px;font-weight: bold;}
#sub_contents .comm_textBox .textarea .span{background: #8f1d1d;color: #fff;display: inline-block;padding: 0 10px;margin-top: 0;}

#sub_contents .sub_ttl_02_box{ text-align: center; position: relative;width: 100%;}
#sub_contents .sub_ttl_02_box p.sub_ttl_02{ text-align: center;  line-height: 180%;font-size: 18px;font-weight: bold;z-index: 2;position: relative;margin-top: 15px;}
#sub_contents .sub_ttl_02::before{position: absolute;content: "";background: url(../img/common/sub_ill_01.png) no-repeat center center / cover ;width:70px;height:70px;bottom: -55px;left: 50%;transform: translate(-50%, -50%);z-index: -1;}

#sub_contents .tbl_menu {width: 100%;margin-inline: auto;display: inline-block;font-size:15px;}
#sub_contents .tbl_menu .tr {display: flex;align-items: flex-end;}
#sub_contents .tbl_menu .th {width: 75%;padding: 15px 0;line-height: 1.6;position: relative;}
#sub_contents .tbl_menu .th .menu_name::before {content: '●';color: #8f1d1d;margin-right: 2em;font-size: 10px; vertical-align: middle; left: 0; top: 50%; transform: translateY(-50%);position: absolute;}
#sub_contents .tbl_menu.yakuu .th .menu_name::before {content: '●';color: #8f1d1d;margin-right: 2em;font-size: 10px; vertical-align: middle; left: 0; top: 50%; transform: translateY(-50%);position: absolute;}
#sub_contents .tbl_menu .th .menu_name {font-weight: bold;padding-left:20px;}
#sub_contents .tbl_menu .td {width: 24%;text-align: right;padding: 15px 0;line-height: 1.6;}
#sub_contents .tbl_menu .td .menu_price {font-weight: normal;}
#sub_contents .center_img {width:100%;text-align: center;}
#sub_contents .center_img img{max-width:600px;margin: 0 auto;object-fit: cover;}
#sub_contents .takeout_area{background: #fff;padding: 50px;margin-top: 30px;width: 100%;margin-inline: auto;}
#sub_contents .gal_list{gap: 10px;}
#sub_contents .gal_list img{width: 26%;}
#sub_contents .menu_line .span {font-size: 17px; font-weight: bold; margin-bottom: 30px; text-align: center;}

/* shop
-----------------------------*/
#sub_contents .shop_area h2{font-size: 35px;}
#sub_contents .shop_area p{text-align: center;}
#sub_contents .online_area .img img{aspect-ratio: auto; object-fit: cover;}
#sub_contents .online_area .txt_area .span{display: inline-block;font-size: 29px;margin-bottom: 0;font-weight: bold;margin: 10px 0;}
#sub_contents .online_area .txt_area .p{border-top: 1px solid #8f1d1d;padding-top: 20px;}
#sub_contents .shop_ttl {margin-top:5px;padding: 0 0 5px 15px;font-size: 24px;font-weight:bold;text-align: left;border-left: 5px solid #9a001c; line-height: 1.5;position: relative;}
#sub_contents .image_txt{text-align: center;font-size: 16px;}
#sub_contents .image_txt .item{display: block;width:31%;text-align: center;font-size: 16px;}
#sub_contents .image_txt .item .span{background:#8f1d1d;color:#fff;display: inline-block;padding:20px;border-radius: 50%;font-size:24px;line-height: 1.1;font-weight: 700;font-family: 'Montserrat', sans-serif;margin-bottom: 20px;}
#sub_contents .image_txt .item .b{margin-top: 5px;font-weight: 500;font-size: 20px;}
#sub_contents .shop_txt{text-align: left;font-size: 16px;padding: 50px;}
#sub_contents .shop_txt .ul{font-size: 18px;display: inline-block;text-align-last: left;}
#sub_contents .shop_txt .ul .li{border-bottom: 1px solid #8f1d1d;margin-top: 10px;padding-bottom: 5px;padding: 5px;}
#sub_contents .shop_txt .ul .li .span{display: inline-block;}
#sub_contents .shop_txt .ul .li::before{content: ""; background:url(../img/common/sub_shop_img02_01.png) no-repeat center center; background-size: contain; width: 25px; height:25px; display: inline-block; vertical-align: middle; margin-right: 10px;display: block;}
#sub_contents .online_area02{text-align: center;padding: 60px 50px;}
#sub_contents .online_area02 .img{width: 100%;}

/* scene
-----------------------------*/
#sub_contents .scene_com{font-weight: bold;font-size: 18px;margin: 10px 0;}
#sub_contents .sub_scene .img{width: 100%; margin: 0 auto;}
#sub_contents .sub_scene .img img{height: 350px;object-fit: cover;}
#sub_contents .sub_scene .textarea{width: 100%;}
#sub_contents .sub_scene .scene_ttl {padding: 5px;background: #8f1d1d;color: #fff;display: inline-block;margin-top: 10px;}
#sub_contents .sub_scene .scene_name{font-weight: bold;font-size: 20px;border-bottom: 1px solid #8f1d1d;margin: 10px 0;}

/* contact
-----------------------------*/
#sub_contents .contact_area{display:flex;column-gap: 4%;align-items: center;}
#sub_contents .contact_list{width:280px;margin-inline: 0;}
#sub_contents .contact_list{margin-bottom: 20px;}
#sub_contents .contact_list:last-child{margin-bottom: 20px;}
#sub_contents .sub_illust{padding: 0;width:15%;}
#sub_contents .atten_bg{padding: 30px 40px; border-radius: 10px;}
#sub_contents .atten_bg::before {position: absolute;bottom: -8px;right: -8px;width: 100%; height:100%;background:none;border: 1px solid #86511d;content: '';z-index: 1; border-radius: 10px;}
#sub_contents .atten_bg p{text-align:left; font-weight:600; font-size:18px;line-height: 250%; position: relative; z-index: 2;}

/* news
-----------------------------*/
#sub_contents .cateList{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;margin:0 auto;padding:0;}
#sub_contents .cateList section.webgene-blog{display:contents;}
@supports not (display:contents){#sub_contents .cateList section.webgene-blog{display:flex;gap:10px;}}
#sub_contents .cateList .webgene-item{width:auto;margin:0;padding:0;}
#sub_contents .webgene-item.categorylist a{display:block;width:auto;text-align:center;padding:14px 10px;transition:.5s;color:#8f1d1d;font-weight:bold;border:1px solid #8f1d1d;text-decoration:none;line-height:1.2;margin-bottom:40px;}
#sub_contents .webgene-item.categorylist a:hover{background:#8f1d1d;color:#fff;border:1px solid #8f1d1d;}
#sub_contents .cateList p{margin:0;padding:0;line-height:inherit; font-weight:bold;}
#sub_contents .cateList .webgene-item.categorylist,#sub_contents .cateList article.webgene-item.categorylist{flex:1 1 auto;max-width:200px;}
#sub_contents .webgene-blog{display:flex;justify-content: start;column-gap: 1%;row-gap: 20px;flex-wrap: wrap;}
#sub_contents .webgene-item{width: 32.5%;}
#sub_contents .news_list {margin-top:-100px;}
#sub_contents .webgene-blog .webgene-item.news__item figure{width: 100%;aspect-ratio: 16/9;overflow: hidden;margin-bottom: 10px;}
#sub_contents .webgene-blog .webgene-item.news__item figure img{border-radius:20px;}
#sub_contents .webgene-blog .webgene-item.news_area {padding:20px 0;}
#sub_contents .webgene-blog .news__date{font-family: "Zen Old Mincho", serif;/* margin-left: 10px; */display:inline-block;font-size:16px;margin-top: 10px;}
#sub_contents .webgene-blog .news_ttl{font-weight:normal; display:block; margin:10px 0; overflow: hidden;display: -webkit-box;text-overflow: ellipsis;-webkit-box-orient: vertical;-webkit-line-clamp: 3; font-size:16px;}

/* detail_news
-----------------------------*/
#sub_contents .webgene-blog .cnt-news-li h1, #sub_contents .webgene-blog .cnt-news-li h2, #sub_contents .webgene-blog .cnt-news-li h3, #sub_contents .webgene-blog .cnt-news-li h4 {font-size: 16px;}
#sub_contents .blog_h2{font-size: 20px;}
#sub_contents .cmn-blog-date{text-align:center;}
#sub_contents .area_blog{width: 100%; padding: 60px;}
#sub_contents .area_blog .cmn-blog-txt{font-size:16px;}
#sub_contents .btn_clear{margin: 30px auto;}
#sub_contents .area_blog figure{width: 62%;}
#sub_contents .webgene-item.detail{width: 100%;}
#sub_contents .news_detail{width: 100%;}
#sub_contents .news_detail .news_img {text-align: center;margin: 0 auto;width:50%;}
#sub_contents .news_detail .news_img img{width: auto; text-align: center; margin: 0 auto 50px;}
#sub_contents .news_detail .news_date{text-align: center; display: block;margin: 0 auto 20px;font-weight:500;font-family: "Zen Old Mincho", serif;font-weight:600;}
#sub_contents .news_text{background: #fff; padding: 50px;}
#sub_contents .news_detail .news_detail_ttl {font-size:20px;margin-bottom:20px;text-align:center;font-family: "Zen Old Mincho", serif;}
}

/* contact
-----------------------------*/
#sub_contents .contact_txt{text-align: center;font-size: 16px;}

@media screen and (min-width:1024px) {

/* scene
-----------------------------*/
#sub_contents .scene_com{font-weight: bold;font-size: 26px;margin: 10px 0;}
#sub_contents .sub_scene .img{width: 48%; margin: 0 auto;}
#sub_contents .sub_scene .img img{height: auto;object-fit: none;}
#sub_contents .sub_scene .textarea{width: 48%;}
#sub_contents .sub_scene .scene_ttl {padding: 5px;background: #8f1d1d;color: #fff;display: inline-block;margin-top: 0;}
#sub_contents .sub_scene .scene_name{font-weight: bold;font-size: 26px;border-bottom: 1px solid #8f1d1d;margin: 10px 0;}

/* for-tourists
-----------------------------*/
#sub_contents .onomichi_textBox .img{width: 48%; margin-bottom: 10px; position:relative;}
#sub_contents .onomichi_textBox .img img{width: 100%;}
#sub_contents .onomichi_textBox .textarea {width: 47%;margin-bottom:20px;}
#sub_contents .onomichi_textBox .textarea .ttl_en {font-size:14px;font-family: "Shippori Mincho", serif;}
#sub_contents .onomichi_textBox .textarea .ttl_ja {font-size:16px;font-weight: 500;margin-bottom:20px;}
#sub_contents .onomichi_textBox .textarea p {line-height:2;}
#sub_contents .onomichi_textBox .textarea p.onomichi_name {border-bottom: solid 1px;margin-bottom: 20px;font-weight: bold;font-size: 26px; font-family: "Zen Old Mincho", serif;}
#sub_contents .onomichi_textBox .textarea p.onomichi_ttl {font-weight: normal;margin-top: 0px;}
#sub_contents .sub_root{width: 48%;margin-left: 10px;background: url(../img/common/sub_bg_paper01.jpg);color: #fff;padding: 30px;}

/* restaurant01 restaurant02
-----------------------------*/
#sub_contents .tbl_menu {width: 45%;margin-inline: auto;display: inline-block;font-size:15px;}
#sub_contents .takeout_area{background: #fff;padding: 50px;margin-top: 30px;width: 90%;margin-inline: auto;}

/* shop
-----------------------------*/
#sub_contents .shop_txt{text-align: center;font-size: 16px;padding: 35px;}
#sub_contents .shop_txt .ul{font-size: 18px;display: inline-block;text-align-last: left;}
#sub_contents .shop_txt .ul .li{border-bottom: 1px solid #8f1d1d;margin-top: 10px;padding-bottom: 5px;padding: 5px;}
#sub_contents .shop_txt .ul .li .span{display: inline-block;}
#sub_contents .shop_txt .ul .li::before{content: ""; background:url(../img/common/sub_shop_img02_01.png) no-repeat center center; background-size: contain; width: 25px; height:25px; display: inline-block; vertical-align: middle; margin-right: 10px;}
}

@media screen and (min-width: 1200px){
  #sub_contents .section{
    max-width: none;
    width: calc(100% - 320px);
    padding:0px 1%;
  }
}
@media screen and (min-width: 1590px){
  #sub_contents .section{
    max-width: 1280px;
    width: 94%;
    padding:0px 1%;
  }
}


/*============================
	header・footer
============================*/

/*============================
	header
============================*/
.header {
    position: fixed;
    top: 0;
    left: 50%;
    width: 100%;
    z-index: 999;
    background: url(../img/common/hd_bg.png) no-repeat center center/cover;
    transform: translate(-50%);
}

.header.active {
    box-shadow: 10px 10px 15px rgba(0, 0, 0, .1);
}

.hd__inner {
    margin: 0 auto;
    width: 100%;
    height: 52px;
    position: relative;
    transition: .3s;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 0 0 2%;
}


.hd__flex {
    display: flex;
    align-items: center;
    width: 100%;
    transition: .3s;
}


.hd__left {
    width: 100%;
    flex: 0 1 auto;
    display: flex;
    align-items: center;
    position: relative;
    transition: .3s;
}


.hd__right {
    width: fit-content;
    display: flex;
    transition: .3s;
}

.hd__txt {
    font-size: 1rem;
    color: #fff;
    letter-spacing: 0;
}

.hd__logo {
    width: 100%;
    max-width: 200px;
    z-index: 999;
    position: relative;
    margin-right: 2%;
}

.hd__snswrap {
    display: flex;
    align-items: center;

}

.hd__sns {
    margin-right: 10px;
}

.hd__sns img {
    transform: scale(.8);

}

/***** g-nav ▲*****/
.hd__menu {
    pointer-events: none;
}



/***** ハンバーガー ▼*****/

.hd__menu {
    z-index: 999;
    width: 52px;
    height: 52px;
    transition: .5s;
    cursor: pointer;
    position: relative;
    pointer-events: all;
}

/* .hd__menu.active {
    background: #00528d;
} */

.hd__hamburger {
    width: 25px;
    height: 15px;
    margin: 0 auto;
    cursor: pointer;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.hd__ham--line {
    background: #8f1d1d;
    height: 1px;
    border-radius: 1px;
}

.hd__menu.active .hd__ham--line {
    background: #8f1d1d;
}


.hd__hamburger--top {
    width: 100%;
    top: 0;
    left: 50%;
    transition: .5s;
    transform: translate(-50%);
}

.hd__hamburger--middle {
    width: 100%;
    top: 50%;
    transition: .5s;
    transform: translate(0, -50%);
}

.hd__hamburger--bottom {
    width: 100%;
    bottom: 0;
    left: 50%;
    transition: .5s;
    transform: translate(-50%);
}

.hd__menu.active .hd__hamburger--top {
    top: 50%;
    transform: translate(-50%, -50%) rotate(-45deg);
}

.hd__menu.active .hd__hamburger--middle {
    display: none;
}

.hd__menu.active .hd__hamburger--bottom {
    top: 50%;
    transform: translate(-50%, -50%) rotate(45deg);
}

.hd__menu--txt {
    position: absolute;
    top: 75%;
    left: 50%;
    color: #fff;
    width: 90%;
    font-size: 1rem;
    transform: translate(-50%, -50%);
    text-align: center;
}

/***** sp nav *****/
body::before {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background: rgba(000, 000, 000, .5);
    opacity: 0;
    display: none;
    transition: .5s;

}

html.active body:before {
    opacity: 0;
    z-index: 999;
    display: block;
    animation-name: BgAppear;
    animation-duration: .5s;
    animation-fill-mode: forwards;
}

@keyframes BgAppear {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }

}

@keyframes BgHide {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }

}

.g-nav__bg {
    position: fixed;
    top: 80px;
    right: -120%;
    height: 100vh;
    min-width: 100vw;
    transition: all .5s;
    background: #f8f5f0;
    overflow: auto;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
    padding: 60px 10% 100px;
    z-index: 999;
}

.g-nav__bg--inner {
    width: fit-content;
    margin: 0 auto;
}

.g-nav__bg.active {
    right: 0;
}

.g-nav__sp-ul {
    width: fit-content;
    margin: 0 auto 40px;
}

.g-nav__bg .g-nav__li {
    border: none;
    padding: 0;
}

.g-nav__li a::before {
    display: none;
}

.g-nav__bg .g-nav__li a {
    font-size: 1.4rem;
    height: 100%;
    display: block;
    padding: 0;
    line-height: 1;
    margin-bottom: 1em;
    font-weight: 500;
    background: none;
    text-align: center;

}

.g-nav__bg .g-nav__li a::after {
    display: none;
}

.g-nav__bg .g-nav__li .txt {
    line-height: 1;
}

.g-nav__bg .g-nav__li i {
    display: inline-block;
    margin: 0 0 0 .5em;
}

.g-nav__bg .g-nav__li.sub a {
    font-size: 1.4rem;
    margin-bottom: 1em;
}

.g-nav__sp-ul .sub-triger a {
    margin-bottom: 1em;
}

.g-nav__bg .sub-nav__li a {
    display: block;
    font-size: 1.4rem;
    margin-bottom: 15px;
    font-weight: 500;
}

.g-nav__tel {
    width: 220px;
    display: block;
    margin: 0 auto 20px;
}

.g-nav__btn {
    display: block;
    width: 140px;
    white-space: nowrap;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 15px;
}


@media screen and (min-width:768px) {
    .header .sp {
        display: block;
    }

    .header {
        padding: 0;
    }

    .hd__inner {
        height: 62px;
        padding: 0 0 0 2%;
    }

    .hd__flex {
        justify-content: space-between;
    }

    .hd__left {
        width: 45%;
    }

    .hd__right {
        width: auto;
    }


    .hd__logo {
        max-width: 240px;
        z-index: 999;
        position: relative;
    }


    /***** ハンバーガー ▼*****/

    .hd__menu {
        width: 62px;
        height: 62px;
    }


    .hd__hamburger {
        width: 30px;
        height: 20px;
    }

    .hd__ham--line {

        height: 1px;
    }

    /***** sp nav *****/

    .g-nav__bg {
        top: 88px;
        right: -120%;
        height: 100vh;
        min-width: 50vw;
        padding: 120px 10% 100px;
    }

    .g-nav__bg--inner {
        width: fit-content;
        margin: 0 auto;
    }

    .g-nav__bg.active {
        right: 0;
    }

    .g-nav__sp-ul {
        width: fit-content;
        margin: 0 auto 40px;
    }

    .g-nav__bg .g-nav__li {
        border: none;
        padding: 0;
    }

    .g-nav__li a::before {
        display: none;
    }

    .g-nav__bg .g-nav__li,
    .g-nav__bg .g-nav__li a {
        font-size: 1.6rem;
        margin-bottom: 1em;
    }

    .g-nav__btn {
        width: 160px;
        margin: 0 auto 15px;
    }

}

@media screen and (min-width:1025px) {
    /* .header .pc {
        display: block;
    }

    .header .sp {
        display: none;
    }


    .header {
        height: 100vh;
        max-width: 260px;
        min-width: 160px;
        width: 18%;
        left: 1%;
        top: 10px;
        transform: none;
        position: fixed;
        transition: .3s;
        display: flex;
        background: none;

    }

    .header.active {
        left: 0;
        top: 0;
        width: 160px;
        box-shadow: none;

    }

    .hd__flex {
        display: block;
    }


    .hd__inner {
        width: 100%;
        max-width: 100%;
        height: auto;
        padding: 0;
        display: block;
    }


    .hd__left {
        width: 100%;
        display: block;
    }


    .hd__right {
        width: fit-content;
        margin: 0 auto;
        display: block;
        width: 100%;
        padding: 0;
    }

    .hd__right--inner {
        padding: 10px 5%;
        width: 100%;
        display: block;
        background: url(../img/common/hd_bg.png) no-repeat center center/cover;
    }

    .hd__logo {
        width: 100%;
        max-width: 150px;
        margin: 0 auto 20px;
    }


    .header.active .scroll {
        opacity: 0;
        pointer-events: none;
    }

    .hd__tel {
        display: block;
        max-width: 198px;
        margin: 0 auto 20px;
    }

    .hd__btn {
        display: block;
        width: fit-content;
        max-width: 100%;
        margin: 0 auto 10px;
    }

    .hd__sns:first-child {
        margin-bottom: 0;

    }

    .hd__mail {
        width: fit-content;
        max-width: 180px;
        display: block;
        margin: 10px auto 0;
    }

    .hd__translation {
        position: fixed;
        top: 20px;
        right: 3%;
        margin-right: 0;
    }

    .hd__translation img {
        margin-right: 1em;
    } */

    /***** g-nav  PC ▼*****/

    /* .g-nav__pc--ul {
        width: 100%;
        text-align: center;
        max-width: 100%;
        padding: 0;
        display: block;
        transition: .3s;
        margin: 0 auto 20px 0;
    }

    .g-nav__li {
        position: relative;
        z-index: 9;
    }

    .g-nav__li a {
        font-size: 1.4rem;
        height: 100%;
        display: block;
        line-height: 1;
        padding: .5em 0 .5em 1em;
        border-bottom: solid 1px #d5d2d2;
        letter-spacing: 0;
        font-weight: 400;
        white-space: nowrap;
        background: none;
        width: 100%;
        text-align: left;
    }

    .g-nav__li a::after {
        content: "";
        position: absolute;
        width: 6px;
        height: 8px;
        background: url(../img/common/nav_arw.png) no-repeat center center/contain;
        left: 0;
        top: 50%;
        transform: translate(0, -50%);
    }

    .g-nav__li:last-child a {
        margin-bottom: 0;
    }

    .g-nav__li:last-child a::after {
        display: block;
    }

    .g-nav__li a:hover .txt {
        opacity: 1;
    }

    .g-nav__li a:hover {
        opacity: .7;
        color: #8f1d1d;
    }

    .g-nav__li img {
        width: auto;
        position: absolute;
        top: 25%;
        left: 50%;
        display: block;
        transform: translate(-50%, -50%);

    }

    .g-nav__li .font-en {
        font-size: min(1.5rem, 1.1vw);
        display: block;
        letter-spacing: .05em;
        line-height: 1;
        white-space: nowrap;
        position: relative;
        font-weight: 500;
        margin-top: .5em;
        /* transition: .3s ; */
    }

    /* .g-nav__li.sub-triger {
        position: relative;
    }

    .g-nav__li.sub-triger i {
        position: absolute;
        bottom: -20px;
        left: 50%;
        transform: translate(-50%);
        font-size: 1.4rem;
    }

    .g-nav__pc .sub-triger {
        padding-bottom: 50px;
        margin-bottom: -50px;
    }

    .sub-triger:hover .sub-nav {
        display: block;
        opacity: 1;
    }

    .sub-nav {
        position: absolute;
        width: fit-content;
        left: 50%;
        top: 93px;
        min-width: 120px;
        background: #aaaaaa;
        border-radius: 10px;
        -webkit-transform: translate(-50%);
        -ms-transform: translate(-50%);
        transform: translate(-50%);
        display: none;
        opacity: 0;
        transition: .5s;
        padding: 1.5em 1em;
        animation: sub-navAppear .5s forwards;
    }

    @keyframes sub-navAppear {
        0% {
            opacity: 0%;
        }

        100% {
            opacity: 1;
        }
    }

    .g-nav__pc--ul .sub-nav__li a {
        line-height: 1.2;
        white-space: nowrap;
        font-weight: 500;
        color: #fff;
        margin-bottom: 1em;
        font-size: 1.3rem;
        padding: 0;
        border: none;
        text-align: center;
    }

    .g-nav__pc--ul .sub-nav__li:last-child a::before {
        display: none;
    }

    .g-nav__pc--ul .sub-nav__li a::after {
        display: none;
    }

    .g-nav__pc--ul .sub-nav__li:last-child a {
        margin-bottom: 0;
        padding-bottom: 0;
    }

    .g-nav__pc--ul .g-nav__li:hover:before {
        opacity: 1;
        width: 50%;
    }

    .g-nav__pc--ul .g-nav__li.sub-triger::before {
        display: none;
    }

    .g-nav__pc--ul .g-nav__li.sub-triger::before {
        width: 100%
    }

    .g-nav__pc--ul .sub-nav__li::before {
        display: none;
    }  */


    /***** g-nav ▲*****/


    /***** ハンバーガー ▼*****/

    /* .hd__menu {
        width: 60px;
        height: 60px;
        transition: .5s;
        position: fixed;
        top: 20px;
        left: 3%;
        opacity: 0;
        pointer-events: none;
    }

    header.active .hd__menu {
        opacity: 1;
        pointer-events: fill;
    }

    .hd__hamburger {
        width: 35px;
        height: 25px;
        top: 50%;
    }

    .hd__ham--line {
        height: 2px;

    }

    .hd__menu--txt {
        font-size: 2.2rem;
    } */

/* } */

/*============================
	contact
============================*/
.contact {
    padding: 40px 0;
    background: #f8f5f0;
}


.contact__ttl {
    .line {
        width: 150px;
        margin: 1em auto 0;
    }
}

.contact__item {
    display: block;
    max-width: 357px;
    width: 260px;
    margin: 0 auto 15px;
}

.contact__item:last-child {
    margin-bottom: 0;
}

@media screen and (min-width:768px) {

    .contact {
        padding: 60px 0;
    }


    .contact__ttl {
        .line {
            width: 180px;
            margin: 1em auto 0;
        }
    }

    .contact__item {
        max-width: 357px;
        width: 31%;
        margin: 0 1%;
    }


}

@media screen and (min-width:1025px) {
    .contact {
        padding: 60px 0 80px;
    }


    .contact__ttl {
        .line {
            width: auto;
            margin: 1em auto 0;
        }
    }

    .contact__item {
        max-width: 357px;
        width: 31%;
        margin: 0 1%;
    }


}

/*============================
	footer
============================*/
.footer {
    padding: 60px 0;
    background:
        url(../img/common/ft_btm.png) no-repeat center bottom/100%,
        url(../img/common/bg01.jpg) no-repeat center center/cover;

}

.ft__logo {
    max-width: 400px;
    width: 200px;
    margin: 0 auto 30px;
}




.ft__nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-bottom: 40px;
}

.ft-nav__li {
    width: 50%;
}

.ft-nav__li a {
    display: block;
    line-height: 1.4;
    font-size: 1.2rem;
    width: fit-content;
    white-space: nowrap;
    letter-spacing: 0;
    text-align: center;
    margin: 0 auto 1.5em ;
    position: relative;
}

.ft-nav__li p,
.ft-nav__li span {
    line-height: 1;
    width: fit-content;
}


.ft__copyright {
    font-size: 1rem;
    text-align: center;
}


@media screen and (min-width:768px) {

    .ft-nav__li {
    width: 20%;
}
}

@media screen and (min-width:1025px) {
    .footer {
        padding: 100px 0 150px 0;
    }

    .ft__logo {
        max-width: 400px;
        width: fit-content;
        margin: 0 auto 80px;
    }

    .ft__nav {
        margin-bottom: 50px;
        padding:0 150px;
    }

    .ft-nav__li {
    width: 20%;
}
    .ft-nav__li a {
        font-size: 1.5rem;
        padding: 0 1em;
    }

    .ft-nav__li:last-child a {
        border: none;
        margin-bottom: 0;
    }


    .ft__copyright {
        font-size: 1.3rem;
    }

}




/*============================
	page top /side btn
============================*/
.js-pagetop {
    white-space: nowrap;
    position: fixed;
    display: block;
    z-index: 99;
    max-width: 120px;
    min-width: 50px;
    width: calc((210/1920)*100%);
    right: 1%;
    bottom: 30px;
    opacity: 0;
    transition: .5s;
}

.js-pagetop.active {
    opacity: 1;
    pointer-events: fill;
}

.side__btn {
    white-space: nowrap;
    position: fixed;
    display: block;
    z-index: 99;
    max-width: 157px;
    min-width: 60px;
    width: calc((157/1920)*100%);
    right: 1%;
    bottom: 150px;
    transition: .5s;
}

.side__btn .circle {
    width: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    animation: btnAnime 5s infinite linear;
}

@keyframes btnAnime {
    0% {
        transform: translate(-50%, -50%) rotate(0);
    }

    100% {
        transform: translate(-50%, -50%) rotate(360deg);
    }
}

.fixed__ft {
    position: fixed;
    bottom: 0;
    left: 0;
    background: #736b5c;
    color: #fff;
    width: 100%;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: flex-end;
    z-index: 99;
}

.fixed__item {
    width: 33.33%;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 10px;
    background-color: #736b5c;
    color: #fff;
    white-space: nowrap;
    font-size: 1.2rem;
}

.fixed__item img {
    max-width: 16px;
    margin-right: .5em;
}

.fixed__line img {
    width: 16px;
    margin-right: .5em;
}

.fixed__app {
    background: #916743;
}

.fixed__line {
    background: #8f1d1d;
}




@media screen and (min-width:768px) {
    .js-pagetop {
        min-width: 50px;
        width: calc((210/1920)*100%);
        right: 1%;
        bottom: 100px;
    }


    .side__btn {
        min-width: 60px;
        width: calc((157/1920)*100%);
        right: 1%;
        bottom: auto;
        top: 100px;
    }

    .fixed__ft {
        display: none;

    }

}

@media screen and (min-width:1025px) {
    .js-pagetop {
        min-width: 50px;
        width: calc((210/1920)*100%);
        right: 1%;
        bottom: 100px;
    }


    .side__btn {
        min-width: 60px;
        width: calc((157/1920)*100%);
        right: 1%;
        top: 60px;
    }

}

/* hd__pd */

@media screen and (min-width:1025px) {
    .hd__pd {
        padding-left: 160px;
    }
}