﻿/* 1536 , 1530 × 735 ,1366 *//* 上記画面幅でも崩れていないか確認 */

/* 修正した場合→各項目の一番下に日付をコメントアウトして追記 */



@charset "utf-8";
/*■■　ALL　■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
#wrap:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-image: url(../img/bg.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
.header_bg {
    background: transparent;
}
#header {
    padding: 10px 20px;
}
#pc_nav li a {
    color: var(--black);
}
#pc_nav li a.text-light {
    color: var(--color2);
}
.contact_btn a {
    transform: skewX(-20deg);
    font-style: normal;
}
footer {
    background: var(--color4) !important;
}
#loading .load_bg_wrap span {
    background: var(--color4);
}
footer {
    background-image: url(../img/footer.png) !important;
    background-position: 50% 60% !important;
    background-color: #af77836e !important;
    background-blend-mode: lighten;
}
.info_contact a {
    background: transparent;
    color: var(--color3);
    border: 4px double var(--color3);
}
.cms_title p, .page_title_wrap p {
        font-family: 'Bodoni Moda', 'Shippori Mincho B1', "游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif";
    font-style: italic;
    font-size: 22px;
}
.nav_tel {
    display: none;
}
/* ---------------------------　タブレット　-------------------------- */
@media screen and (max-width: 768px){
#menu_bt span {
    background-color: var(--black);
}
#menu_bt span.text-light {
    background-color: var(--color2);
}
}

/* --------------------------　スマホ　-------------------------- */
@media screen and (max-width: 667px){
.bottom_contact a {
    background: var(--color3);
}
#header_logo {
    min-width: 130px;
}
.cms_title p, .page_title_wrap p {
    font-size: 16px;
}
#page_list li:not(:last-of-type) {
    padding-right: 10px;
}
.more2 div {
    text-wrap: nowrap;
    width: 60%;
}
}



/*■■　FV　■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
#main_img {
    background-image: url(../img/fv_bg.png);
    background-size: cover;
    padding: 0;
    background-position-x: right;
}
.catch.fv_img {
    width: max(54%, 690px) !important;
    left: 0;
    padding: 0;
    top: 28%;
}
.catch picture img {
    border: 8px solid #fff;
}
.catch picture {
    position: relative;
}
.catch picture:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    transform: translate(7%, -13%);
    background: #af778391;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    z-index: -1;
}
#main_img:before {
    content: "";
    background-image: url(../img/catch.png);
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    top: 20%;
    right: 13%;
    width: max(11%, 160px);
    aspect-ratio: 2 / 5;
    z-index: 2;
}
#main_img:after {
    content: "";
    background-image: url(../img/access.png);
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    bottom: 5%;
    right: 5%;
    width: max(11%, 170px);
    aspect-ratio: 5 / 1;
}
/* ---------------------------　タブレット　-------------------------- */
@media screen and (max-width: 768px){
.catch.fv_img {
    width: 85% !important;
    top: auto;
    bottom: 8%!important;
}
#main_img {
    height: 90vh;
    z-index: 1;
}
#main_img:before {
    top: 14%;
    right: 50%;
    transform: translateX(50%);
    width: 17%;
    aspect-ratio: 2 / 6;
}
#main_img:after {
    bottom: 1%;
    right: 3%;
    width: 25%;
    aspect-ratio: 5 / 1;
}
}

/* --------------------------　スマホ　-------------------------- */
@media screen and (max-width: 667px){
#main_img {
    height: 85vh!important;
}
.catch.fv_img {
    width: 95% !important;
}
#main_img:before {
    top: 16%;
    width: 22%;
    background-image: url(../img/catch_sp.png);
    aspect-ratio: 2 / 6;
}
#main_img:after {
    width: 30%;
}
}



/*■■　TOP　■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
#top_intro .intro_title1 {
    position: relative;
    display: inline-block;
    padding-top: 15px; /* 余白調整 */
}
#top_intro .intro_title1::before,
#top_intro .intro_title1::after,
#top_intro .intro_title1 span::before {
    content: "";
    position: absolute;
    left: 0;
    width: 20%;
    height: 1px;
    background-color: currentColor;
}

#top_intro .intro_title1::before { top: 0; }
#top_intro .intro_title1::after { top: 2px; }
#top_intro .intro_title1 span::before { top: 4px; }

#top_intro .intro_img1, #top_intro .intro_img2,.modal_img_wrap figure {
    mask-image: url(../img/mask.svg);
    mask-repeat: no-repeat;
    mask-position: center;
}
#top_con .con_img {
    mask-image: url(../img/mask.svg);
    /* mask-size: contain; */
    mask-repeat: no-repeat;
    mask-position: center;
}
.intro_title2 {
    line-height: 1.8;
}
.intro_img img {
    clip-path: polygon(5% 0, 100% 0, 95% 100%, 0 100%);
}
.intro_img3 figure{
    position: relative;
}
 .page_title_bg:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: #af77839c;
    mix-blend-mode: multiply;
}

/* ---------------------------　タブレット　-------------------------- */
@media screen and (max-width: 768px){

}

/* --------------------------　スマホ　-------------------------- */
@media screen and (max-width: 667px){
.cms_title h2, .contact_txt h3 {
    font-size: 9vw;
}
.intro_title2 {
    line-height: 1.6;
}
#top_con .con_img {
        height: 350px;
    }
}



/*■■　下層ページ　■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
.page_title_bg {
    opacity: 1;
}
.page_title_wrap {
    color: var(--color2);
}

/* ---------------------------　タブレット　-------------------------- */
@media screen and (max-width: 768px){

}

/* --------------------------　スマホ　-------------------------- */
@media screen and (max-width: 667px){
.page_title_wrap h2 {
    font-size: 9vw;
}
#page_title {
    margin-bottom: 50px;
}
}

/* ________20250109修正＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿ */
.intro_title2 {
    color: #fff;
}
#top_intro .intro_title1 {
    font-size: clamp(1.5rem, 4vw, 4rem);
    font-family: "Pinyon Script", cursive;
    letter-spacing: 3px;
}
#top_con .con_no {
    font-family: "Pinyon Script", cursive;
}
#top_cms1 h3 {
    color: #fff;
    font-size: clamp(1.5rem, 3vw, 3rem);
}
#top_cms h2,#top_cms p  {
    color: #fff;
}
#top_cms p {
    font-family: "Pinyon Script", cursive;
}
#main_img:before {
    filter: invert(1);
}
#top_con .con_img2 {
    position: relative;
}
#top_con .con_img2:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 50px;
    background: linear-gradient(to bottom, #7e6b6b, rgba(171, 166, 143, 0) 50%);
    top: 0;
}
.con_title1 {
    color: #fff;
}
.cms1_wrap {
    background: none;
}
.cms1_wrap a {
    color: #fff;
}