﻿@charset "utf-8";
/* CSS Document */
:root{
    --color1:#f49d2c;
    --color2:#f49d2c;
    --color3:#fff9b9;
    --color4:#ebdbbb;
    --color5:#e9e5dc;
    --white:#ffffff;
    --black:#1B1A17;
    --gray:#ccc;
}
body,.txt_color_nomal,.hvr_txt_color_nomal:hover{color: var(--black);}
.txt_white,.hvr_txt_white:hover{color: var(--white);}
.txt_color1,.hvr_txt_color1:hover{color: var(--color1);} /* メインカラー */
.txt_color2,.hvr_txt_color2:hover{color: var(--color2);} /* サブカラー */
.txt_color3,.hvr_txt_color3:hover{color: var(--color3);} /* アクセントカラー1 */
.txt_color4,.hvr_txt_color4:hover{color: var(--color4);} /* アクセントカラー2 */
.txt_color5,.hvr_txt_color5:hover{color: var(--color5);} /* アクセントカラー2 */
/* background-color */
.bg_white,.hvr_bg_white:hover{background-color: var(--white)} /* 白背景 */
.bg_black,.hvr_bg_black:hover{background-color: var(--black);} /* 黒背景 */
.bg_color1,.hvr_bg_color1:hover{background-color: var(--color1);} /* メインカラー */
.bg_color2,.hvr_bg_color2:hover{background-color: var(--color2);} /* サブカラー */
.bg_color3,.hvr_bg_color3:hover{background-color: var(--color3);} /* アクセントカラー1 */
.bg_color4,.hvr_bg_color4:hover{background-color: var(--color4);} /* アクセントカラー2 */
.bg_color5,.hvr_bg_color5:hover{background-color: var(--color5);} /* アクセントカラー2 */
.bg_color_clear,.hvr_bg_color_clear:hover{background-color: transparent!important;}
/* border-color ※!important */
.border_white,.hvr_border_white:hover{border-color: var(--white);}
.hvr_border_black:hover{border-color: var(--black);}
.border_black{border-color: var(--gray);}
.border_color1,.hvr_border_color1:hover{border-color: var(--color1);}
.border_color2,.hvr_border_color2:hover{border-color: var(--color2);}
.border_color3,.hvr_border_color3:hover{border-color: var(--color3);}
.border_color4,.hvr_border_color4:hover{border-color: var(--color4);}
.border_color5,.hvr_border_color5:hover{border-color: var(--color5);}

/*--------------------------------
■2px大きく
--------------------------------*/
html{font-size: 16px;}
body{-webkit-text-size-adjust: 120%;font-size: 16px;}

.font_12{font-size: 14px;}
.font_14{font-size: 16px;}
.font_16{font-size: 18px;}
.font_18{font-size: 20px;}
.font_20{font-size: 22px;}
.font_22{font-size: 24px;}
.font_24{font-size: 26px;}
.font_26{font-size: 28px;}
.font_28{font-size: 30px;}
.font_30{font-size: 32px;}
.font_100per{
font-size: -webkit-calc(1rem + 2px);
font-size: calc(1rem + 2px);
}
.font_2up{
font-size: -webkit-calc(1rem + 4px);
font-size: calc(1rem + 4px);
}
.font_4up{
font-size: -webkit-calc(1rem + 6px);
font-size: calc(1rem + 6px);
}
.font_6up{
font-size: -webkit-calc(1rem + 8px);
font-size: calc(1rem + 8px);
}
.font_8up{
font-size: -webkit-calc(1rem + 10px);
font-size: calc(1rem + 10px);
}
.font_10up{
font-size: -webkit-calc(1rem + 12px);
font-size: calc(1rem + 12px);
}
.font_2dw{
font-size: -webkit-calc(1rem);
font-size: calc(1rem);
}

.fv_txt{
    margin-bottom: 50px;
    margin-top: 30px;
}

.triangle01,.catch {
    display: none;
}

.top .con_navbar .contact2 {
    display: none;
}

.top .con_navbar.is-fixed .contact2 {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: flex;
}

.mainwrap-r {
    display: none;
}

.fv_txt{
    font-family: 'Kiwi Maru', serif;
}

.top_logo{
    z-index: 2;
    width: 200px;
    top: 127px;
    left: 112px;
    padding-top: 0px;
    padding: 10px;
    font-family: 'Kiwi Maru', serif;
    background-color: #fff9b9;
}

.head_tel {
    padding: 0px;
    margin-bottom:10px;
    margin-top: 20px;
}

.link_box {
    z-index: 2;
    top: 133px;
    right: 40px;
    background-color: #fff9b9;
    padding: 0 20px;
    min-width: 350px;
}

#main_img {
    max-height: 39vw;
}

#main_img::before{
	content: "";
	display: block;
	position: absolute;
	background-image: url(./Dup/img/kc02.png);
	top: 46%;
	left: 30%;
	transform: translate(-50%, -50%);
	width: 30vw;
	height: 26vw;
	background-size: contain; 
	background-position: 50% 50%;
	background-size: 100%;
	background-repeat: no-repeat;
    z-index:4;
}

#main_img::after {
	content: "";
	display: block;
	position: absolute;
	background-image: url(./Dup/img/kc03.png);
	bottom: 5%;
	left: 50%;
	transform: translate(-50%, 0%);
	width: 50vw;
	height: 5vw;
	background-size: contain; 
	background-position: 50% 50%;
	background-size: 100%;
	background-repeat: no-repeat;
    z-index:4;
}

#header .head_tel p{
    font-size: 13px;
}

#con_nav h2{
    font-size: 20px;
}

#con_nav ul .contact2 {
    padding: 0 20px;
}

#con_nav ul li{
    max-width:initial;
}

#banner {
    width: 13%!important;
	position: fixed; 
	z-index: 4; 
	bottom: 10px; 
	right: 88px; 
}

#top_contents1::after {
	content: "";
	display: block;
	position: absolute;
	background-image: url(./Dup/img/cat1.png);
	top: 4%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 12vw;
	height: 7vw;
	background-size: contain; 
	background-position: 50% 50%;
	background-size: 100%;
	background-repeat: no-repeat;
}

.kaigyou.sp_hide{
    display: none;
}

.cat2{
    position: relative;
}

.cat2::after {
	content: "";
	display: block;
	position: absolute;
	background-image: url(./Dup/img/cat2.png);
	top: 22%;
	left: 64%;
	transform: translate(-50%, -50%);
	width: 12vw;
	height: 7vw;
	background-size: contain; 
	background-position: 50% 50%;
	background-size: 100%;
	background-repeat: no-repeat;
}

#top_contents3 .con3_box1{
    transform:none;
}

.cat3{
    position: relative;
}

.cat3::after{
	content: "";
	display: block;
	position: absolute;
	background-image: url(./Dup/img/cat3.png);
	top: 147%;
	left: 68%;
	transform: translate(-50%, -50%);
	width: 7vw;
	height: 10vw;
	background-size: contain; 
	background-position: 50% 50%;
	background-size: 100%;
	background-repeat: no-repeat;
} 

.contact2{
    max-width: 13%!important;
}

#top_contents3 .con_before{
    background-color: #5db55f;
} 

#page05 .arrow,#page05 .circle {
    background-color: #f49d2c;
}

.more a::after{
    background-color:#f49d2c;
}

.cate_title {
    color:#f49d2c;
    font-size: calc(1rem + 3px);
}

.more a::after{
    background-color: #f49d2c!important;
}

.hamburger_line {
    background-color: #f49d2c!important;
}

#page08 .width_300-max{
    max-width: 350px;
}

#reservation {
	width: 40%!important; 
	z-index: 4; 
	margin-bottom: 50px;
}

/*PC小用（1200px以下）
--------------------------------------------------------------------------*/
@media  screen and (max-width: 1200px){}

/*タブレット用（768px以下）
--------------------------------------------------------------------------*/
@media  screen and (max-width: 768px){
    
.menu_stick {
    top: 0px;
    height: 53px;
}

.menu_stick .hamburger_line-1{
    top: 12px;
}

.menu_stick .hamburger_line-2{
    top:24px ;
}

.menu_stick .hambuger_text{
    top: 30px;
}

.menu_stick .hambuger_text2{
    top: 40px;
}

.fv_txt{
    margin-top: 40px;
    margin-bottom: 20px;
    letter-spacing: 0px;
}

.top_logo {
    width: 135px;
    top: 150px;
    left: 0px;
}

#main_img::before{
    top: 50%;
    width: 32vw;
    height: 29vw;
}

#main_img::after {
    bottom: 3%;
    width: 65vw;
    height: 7vw;
}

#top_contents1::after{
    top: -10%;
    left: 44%;
}

#top_contents1 .con1_img2 {
    bottom: -100px!important;
}

#top_contents1 .con1_img2 div{
    padding-bottom: 85%;
}

#top_contents1::after {
    top: -9%;
    left: 44%;
    width: 25vw;
    height: 15vw;
}

.cat2::after{
    top: 20%;
    left: 43%;
    width: 23vw;
    height: 14vw;
}

.cat3::after{
    top: 123%;
    left: 53%;
    width: 12vw;
    height: 17vw;
}

.con3_wrap2 .pd_b-30px{
    padding-bottom: 80px;
}

.cms_2-d .cate {
    width: 80%!important;
    margin-bottom:20px;
}

.box_title2 {
    font-size: calc(1rem + 2px);
}

.fixbnr {
    display: none;
}

#page08 .tel_wrap {
    padding: 35px;
}

#footer_info .bg_white {
    padding-bottom: 50px;
}

#foot_nav a{
    padding: 20px 10px;
}
}

/*スマホ用（667px以下）
--------------------------------------------------------------------------*/
@media  screen and (max-width: 667px){

html{font-size: 13px;}
body{-webkit-text-size-adjust: 110%;font-size: 13px;}

.top_logo{
    width: 95px;
    top: 142px;
    padding: 5px;
}

#main_img::before{
    top: 48%;
    width: 37vw;
    height: 32vw;
}

#main_img::after {
    bottom: 0%;
}

#mainwrap{
    min-height: 270px;
}

#banner {
    width: 37%!important;
    right: 46px;
}

#top_news{
    margin-top: 0px;
}

#top_contents1::after {
    top: -9%;
    left: 36%;
}

#top_contents1 .con1_img2 div{
    min-width: 150px!important;
}

#top_contents1 .con1_img2 {
    bottom: -50px!important;
}

#top_contents1::after {
    top: -8%;
    left: 29%;
    width: 33vw;
    height: 19vw;
}

#top_cms h3.letter_5{
    letter-spacing: 0px;
}

#top_cms .cms_box_wrap {
    padding-right: 0px;
    padding-left: 0px;
}

#top_cms .cate {
    padding-right: 0px;
    padding-left: 0px;
}

.cate_title{
    font-size: calc(1rem + 1px);
}

.cms_2-d .cate {
    width: 90%!important;
}

.kaigyou.sp_hide{
    display: block;
}

.cat2::after {
    top: 18%;
    left: 85%;
    width: 25vw;
    height: 16vw;
}

.cat3::after {
    top: auto;
    left: 82%;
    width: 18vw;
    height: 26vw;
    bottom: -198px;
}

.cate_box .box_title {
    letter-spacing: 0px;
    font-size: calc(1rem + 0px);
}

#footer_info .pd_t-50px_tb {
    padding-top: 0px;
}

#footer_info .info_txt_wrap {
    margin-bottom: 0px;
    padding-bottom: 30px;
}

#footer_info .footer_tel {
    font-size: calc(1rem + 10px);
    padding-right: 5px;
    padding-left: 5px;
}
}