@import url('https://fonts.googleapis.com/css2?family=Caudex&family=Shippori+Mincho+B1:wght@500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display&display=swap');

/*--------link_font--------*/
@font-face {
    font-family: 'julius_sans';
    font-style: normal;
    font-weight: 400;
    src: url('./Dup/img/julius_sans.woff') format('woff'),
        url('./Dup/img/julius_sans.eot')  format('eot');
    font-display: swap;
}

.sc_nav .shop_link a,#intro .intro_title h3,.top_cms_title,.more,#footer_links, #top_contents1 .contents1_txt h3::before, #k_con .font_en, #page_title p {
    font-family: 'julius_sans',sans-serif;
}
body, .font_sans-serif, .font_serif, .sc_nav li a, #main_nav li a, footer #footer #footer_links li a{
    font-family: 'Shippori Mincho B1', "游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif";
}
header #header .shop_link a, a[href^="tel:"], .date, .pager, .more, #top_cms .top_cms_title h4, .page_title_h h2, #main_nav, .sc_nav, .shop_link, #menu_wrap, .con1_no, #reserve, #top_contents1 .con1_wrap::before, #top_contents2_h::before, #page10 .title1{
    font-family: 'Caudex', 'Shippori Mincho B1', "游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif";
}
.font_bold{
    font-weight: normal;
}


.linkStyle{
    color: #131b20;
    text-decoration: revert;
    transition: all .3s;
}
.linkStyle:hover{
    opacity: 0.6;
}


/* ======================================================================================
　　anim
======================================================================================== */
.fadein .fade_box{
    transition: 1s!important;
    transition-delay: .8s!important;
    -webkit-filter: grayscale(100%)!important;
    filter: grayscale(100%)!important;
}
.fadein .fade_box.active{
    -webkit-filter: grayscale(0%)!important;
    filter: grayscale(0%)!important;
}
.fadein .fade_box img {
    transition: opacity 1s linear,-webkit-transform 1s cubic-bezier(.36,.14,0,1)!important;
    transition: transform 1s cubic-bezier(.36,.14,0,1),opacity 1s linear!important;
    transition: transform 1s cubic-bezier(.36,.14,0,1),opacity 1s linear,-webkit-transform 1s cubic-bezier(.36,.14,0,1)!important;
    opacity: 0;
    -webkit-transform: translate(-50%,-50%) scale(1.2);
    transform: translate(-50%,-50%) scale(1.2);
}
.fadein .fade_box.active img {
    opacity: 1;
    -webkit-transform: translate(-50%,-50%) scale(1);
    transform: translate(-50%,-50%) scale(1);
}

.fadein2 .fade_box2.active {
    transform: none;
    filter: none;
    opacity: 1;
}
.fadein2 .fade_box2 {
    transition: 1s;
    filter: blur(5px);
    transform: translateY(10px);
    opacity: 0;
    transition-property: opacity, transform, filter;
}

.main_fadein{
    transition: opacity 1s linear,-webkit-transform 1s cubic-bezier(.36,.14,0,1)!important;
    transition: transform 1s cubic-bezier(.36,.14,0,1),opacity 1s linear!important;
    transition: transform 1s cubic-bezier(.36,.14,0,1),opacity 1s linear,-webkit-transform 1s cubic-bezier(.36,.14,0,1)!important;
    opacity: 0;
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
    filter: blur(5px);
}
.main_bnr .main_fadein{
    transition-delay: .3s!important;
}
.main_fadein.active{
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
    filter: none;
}


/* ======================================================================================
　　all
======================================================================================== */
#wrap{overflow: hidden}

.font_14{
    font-size: 16px;
}

/* ---------- header ---------- */
h1 img {
    max-width: 240px;
}
.sns_links li img {
    width: 30px;
}
.shop_link a {
    font-family: 'julius_sans',sans-serif;
    color: #3a3d44;
}
.sc_nav .shop_link a{
    background-color: #464646;
    color: #fff;
    opacity: 1;
    box-shadow: 4px 4px 0 #80dee3;
}
/* ---------- footer ---------- */
#footer_links{
    font-size: 14px;
}

/* ======================================================================================
　　top
======================================================================================== */
.bnr{
    width: 85%;
    margin: auto;
    margin-bottom: 150px;
}
.con_bnr {
    width: 90%;
    max-width: 400px;
    margin: 25px auto 43px;
}

#main_img img{
    pointer-events: none;
}
#main_img {
    max-height: 800px;
    max-height: 900px;
}
#main_img img, #intro img, #top_contents1 img, #top_contents2 img {
    -webkit-filter: none;
    -moz-filter: none;
    -ms-filter: none;
    -o-filter: none;
    filter: none;
}
#main_img .main_title{
    top: 100px;
    left: 5%;
    text-shadow: 2px 2px 3px rgba(0,0,0,0.4);
}
#main_img .main_title h2{
    color: #fff;
}
#main_img .main_title h3{
    font-size: 40px;
    display: inline-block;
    color: #fff;
}
.main_txt {
    max-width: 942px;
    width: 51%;
    bottom: 16%;
    left: 3%;
    z-index: 2;
    filter: drop-shadow(7px 7px 4px rgba(0,0,0,0.13));
}
.main_bnr{
    z-index: 2;
    right: -17px;
    bottom: -36px;
    width: 23%;
    max-width: 356px;
    transition: transform 1s cubic-bezier(.36,.14,0,1);
    transform: scale(1);
}
.main_bnr:hover{
    transform: scale(1.1);
}
.main_txt {
    max-width: 942px;
    width: 51%;
    bottom: 21%;
    left: 2%;
    z-index: 2;
    filter: drop-shadow(7px 7px 4px rgba(0,0,0,0.13));
}


#main_nav {
    max-width: 100%;
    margin-bottom: 100px;
    background-color: #f4f4f4;
}
#main_nav ul {
    justify-content: center;
    letter-spacing: 3px;
}
#main_nav ul li a {
    padding: 0 30px;
}

.intro_wrap {
    padding-bottom: 1px;
    padding-top: 71px;
    background-image: url(./Dup/img/bg_img.png);
    background-size: 1500px;
    background-position-x: 0;
    background-position-y: calc(100% - 63px);
    background-repeat: repeat-x;
    animation: bgroop 30s linear infinite;
    /*background-color: #f4f4f4;*/
}
@keyframes bgroop {
    0% {
        background-position-x: 0;
    }
    100% {
        background-position-x: -1500px;
    }
}
#intro{
    margin-bottom: 181px;
}
#intro .intro_img {
    max-width: 1600px;
    margin: 0 auto 124px;
}
#intro .intro_title {
    width: 15%;
    padding-top: 0;
}
#intro .intro_title h3 {
    margin-left: -28px;
    z-index: 2;
    position: relative;
    letter-spacing: 2px;
    font-size: 65px;
}
#intro .intro_txt{
    position: relative;
    background-color: transparent;
}
#intro .intro_txt h2 {
    transform: none;
    font-size: 38px;
    width: 100%!important;
    background-color: transparent;
    margin-bottom: 22px;
}
#intro .intro_txt:before{
    right: 0;
    bottom: 0;
    width: 50px;
    height: 50px;
    border-right: 2px solid #165e83;
    border-bottom: 2px solid #165e83;
    position: absolute;
    content: '';
}
#intro .intro_txt:after {
    top: -6px;
    left: 0;
    width: 50px;
    height: 50px;
    border-top: 2px solid #165e83;
    border-left: 2px solid #165e83;
    position: absolute;
    content: '';
}
#intro .slick-dots li {
    height: 2px!important;
    border-style: none;
    border-top: 2px solid;
}

#top_contents1{
    margin-bottom: 136px;
    background-color: transparent;
    margin-top: 22px!important;
}
#top_contents1 > div {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-box;
    display: -webkit-flexbox;
    display: -moz-flexbox;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: flex;
    -webkit-box-lines: multiple;
    -moz-box-lines: multiple;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-end;
    flex-direction: row;
    max-width: 100%;
}
/*#top_contents1 figure{
    position: relative;
    bottom: auto;
    width: 50% !important;
}*/
/*#top_contents1 .video_box{
    position: relative;
    bottom: auto;
    height: 680px;
}*/
#top_contents1 figure {
    position: relative;
    width: 50%!important;
}
#top_contents1 .contents1_txt{
    margin-left: -50px;
    padding: 50px;
    background-color: #fff;
    width: calc(50% + 50px)!important;
    position: relative;
    z-index: 1;
}

#top_contents1 .contents1_txt h3 {
    transform: none;
    text-shadow: none;
    margin-bottom: 10px;
}
#top_contents1 .contents1_txt h3::before {
    display: block;
    content: "ABOUT US";
    letter-spacing: 2px;
    font-size: 18px;
    margin-bottom: 20px;
}
#top_contents1 .contents1_txt h3::after {
    position: absolute;
    content: "";
    width: 50px;
    height: 1px;
    background-color: #141414;
    top: 17px;
    left: 124px;
    opacity: 0.5;
}

#k_con{
	font-size: 18px;
	margin-bottom: 150px;
}
#k_con .txt_white{
	padding: 170px 50px;
    background-color: rgb(96 96 96 / 32%);
	position: relative;
}
.k_con_bg1 {
    top: 0;
    left: 0;
    border-style: solid;
    border-width: 0 78vw 163px 0;
    border-color: transparent rgba(3, 30, 58, 0.35) transparent transparent;
    transform: scale(-1,1);
}
.k_con_bg2 {
    bottom: 0;
    left: 0;
    border-style: solid;
    border-width: 140px 0 0 100vw;
    border-color: transparent transparent transparent rgba(3, 30, 58, 0.35);
    transform: scale(-1,1);
}
.k_con_bg3 {
    top: 0;
    left: 0;
    border-style: solid;
    border-width: 0 40vw 240px 0;
    border-color: transparent rgb(130 224 229 / 35%) transparent transparent;
    transform: scale(-1,1);
}
.k_con_bg4 {
    bottom: 0;
    left: 0;
    border-style: solid;
    border-width: 240px 0 0 40vw;
    border-color: transparent transparent transparent rgb(130 224 229 / 35%);
}
#k_con .top_txt {
    margin-bottom: 60px;
}
#k_con .font_en{
	font-size: 34px;
	line-height: 1;
}
#k_con .title {
    font-size: 30px;
    line-height: 1.7;
    margin-bottom: 30px;
    letter-spacing: 2px;
	display: inline-block;
    border-bottom: 1px solid;
}
#k_con .title span{
	color: #fff945;
    font-size: 53px;
}
#k_con .box{
	max-width: 1280px;
    width: 82%;
    margin: 0 auto 39px;
}
#k_con .box .k_con_img {
    width: 22%;
}
#k_con .bottom_txt p{
    padding: 20px;
}


/* ======================================================================================
　　under
======================================================================================== */
#page_title {
    position: relative;
    max-width: 100%;
    padding: 0;
    height: 300px;
    min-height: inherit;
    color: #fff;
    text-shadow: 2px 2px 5px rgb(0 0 0 / 26%);
}
#page_title h2, #page_title p{
    text-align: center;
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
}
#page_title h2{
    top: 57%;
}
#page_title p{
   top: 45%;
    font-size: 23px;
    text-shadow: 2px 1px 4px rgb(0 0 0 / 48%);
}
#page_title {
    -webkit-filter: grayscale(27%);
    -moz-filter: grayscale(27%);
    -ms-filter: grayscale(27%);
    -o-filter: grayscale(27%);
    filter: grayscale(27%);
}

#contact_tel a{
    background-color: #78ced3;
    color: #fff;
}

/* ---------- cms4 ---------- */
#cms_6-c .circle, #cms_6-c .arrow{
    background-color: #a5d8db;
}




/* ======================================================================================
　　window size
======================================================================================== */
@media screen and (max-width: 1367px){
/*#video{
    width: 70%!important;
}*/
#top_contents1 .contents1_txt {
    width: calc(73% + 50px)!important;
}
}
@media screen and (max-width: 1380px){
#main_img {
    max-height: 733px;
}
}
@media screen and (max-width: 1200px){
.main_bnr {
    bottom: -32px;
    width: 26%;
}
#main_img {
    max-height: 700px;
}
#intro .intro_title h3 {
    margin-left: -14px;
    font-size: 50px;
}
}

/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
.font_14{
    font-size: 14px;
}

.main_bnr {
    bottom: -66px;
    width: 31%;
}
#main_img {
    max-height: 500px;
    margin-bottom: 42px;
}
#intro {
    margin-bottom: 166px;
}
.intro_wrap{
    
}
#intro .intro_img {
    margin-bottom: 99px;
}
#intro .intro_title h3{
    font-size: 37px;
}
#intro .intro_txt {
    width: 92%!important;
}
#intro .intro_txt h2 {
    font-size: 28px;
    width: 85%!important;
}
#video {
    width: 100%!important;
}
#top_contents1 {
    margin-bottom: 93px;
}
#top_contents1 figure {
    width: 100% !important;
    max-height: 364px!important;
}
#top_contents1 .contents1_txt {
    margin-left: 0;
    padding: 50px;
    background-color: #f9f9f9;
    width: calc(100%)!important;
}
#k_con .txt_white {
    padding: 137px 50px;
}
#k_con {
    font-size: 16px;
    margin-bottom: 105px;
    background-position: center;
}
#k_con .font_en {
    font-size: 30px;
}
#k_con .title {
    font-size: 25px;
}
#k_con .title span {
    font-size: 43px;
}
#k_con .box {
    width: 100%;
    margin: 0 auto 34px;
}
}

/* ---------- スマホ ---------- */
@media screen and (max-width: 667px){
.bnr {
    width: 90%;
    margin: -29px auto 78px;
}
.main_bnr {
    right: -1px;
    bottom: -35px;
    width: 31%;
}
#main_img {
    max-height: 100%;
    margin-bottom: 9px;
}
#main_img figure{
    height: 230.368px!important;
}
.main_txt{
    width: 62%;
}
.intro_wrap{
    padding-top: 15px;
    background-size: 1000px;
}
#intro {
    margin-bottom: 131px;
}
#intro .intro_title {
    width: 90%;
    margin-bottom: 10px;
}
#intro .intro_title h3 {
    font-size: 26px;
    margin-left: 0;
}
#intro .intro_txt {
    margin-top: 102px;
    padding-bottom: 19px;
}
#intro .intro_txt:after, #intro .intro_txt:before{
    width: 30px;
    height: 30px;
}
#intro .intro_txt:after {
    top: -18px;
}
#intro .intro_txt h2 {
    font-size: 20px;
}
#top_contents1 {
    margin-bottom: 10px;
}
#top_contents1 .contents1_txt {
    padding: 50px 30px;
    margin-top: -10px;
}
#top_contents1 .contents1_txt h3 {
    text-align: left;
}
#top_contents1 .contents1_txt h3::before {
    margin-bottom: 2px;
}

#k_con .top_txt, #k_con .bottom_txt{
    position: relative;
    z-index: 2;
}
#k_con {
    font-size: 14px;
    margin-bottom: 69px;
}
#k_con .txt_white {
    padding: 124px 17px 90px;
}
#k_con .top_txt {
    margin-bottom: 49px;
}
#k_con .title {
    font-size: 18px;
    letter-spacing: 1px;
}
#k_con .title span {
    font-size: 28px;
}
#k_con .box {
    margin: 0 auto 20px;
}
#k_con .box .k_con_img {
    width: 48%;
    margin-bottom: 13px;
}
#k_con .bottom_txt p {
    padding: 0;
}


#page-top {
    transform: translateY(-1px);
}
}

/*お問合わせバナー*/
#fix_bnr {
    bottom: 0;
    right: 0px;
    left: 0;
    margin: auto;
    z-index: 7;
    width: 80%;
    max-width: 373px;
    transition: 0.3s;
}
#copyright{
    padding-bottom: 100px;
}
@media screen and (max-width: 667px){
#fix_bnr {
    width: 68%;
    bottom: 22px;
}
}



/* ----------------- 修正 2022.07.07 --------------------------------------*/
#cms_2-d #cate0 .cate_img1 {
    width: 38%!important;
    max-width: 350px;
}