@charset "UTF-8";
/* Scss Document */
.padding120 {
	padding: 120px 0;
}
.pt-120 {
	padding-top: 120px;
}
.pb-120 {
	padding-bottom: 120px;
}
.margin120 {
	margin-top: 120px;
	margin-bottom: 120px;
}
.mt-120 {
	margin-top: 120px;
}
.mb-120 {
	margin-bottom: 120px;
}
.padding150 {
	padding: 150px 0;
}
.pt-150 {
	padding-top: 150px;
}
.pb-150 {
	padding-bottom: 150px;
}
.margin150 {
	margin-top: 150px;
	margin-bottom: 150px;
}
.mt-150 {
	margin-top: 150px;
}
.mb-150 {
	margin-bottom: 150px;
}
.padding200 {
	padding: 200px 0;
}
.pt-200 {
	padding-top: 200px;
}
* {
	text-decoration: none !important;
}
/******************************/
#cy_header {
	position: relative;
	width: 100%;
	height: 100vh;
	overflow: hidden;
	background: #000;
}

.fv_switch,
.fv_switch .slides {
	width: 100%;
	height: 100%;
}

.fv_switch .slides {
	position: relative;
	margin: 0;
	padding: 0;
	list-style: none;
}

.fv_switch .slides > li {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}

/* 動画 */
#fade2 {
	z-index: 1;
	opacity: 0;
	transition: opacity 0.7s ease-in-out;
	pointer-events: none;
	position: relative;
}

#fade2 video {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 50% 50%;
    transform: scale(1.3);
}
/* 画像 */
/* 画像：動画終了後は0.6秒で表示 */
#fade1 {
	z-index: 2;
	opacity: 1;
	background: url(../images/fade1.jpg) 50% 50% / cover no-repeat;
	transition: opacity 0.6s ease-in-out;
	will-change: opacity;
}

/* 画像から動画へ切り替えるときは2秒で消す */
#cy_header.is-image-hidden #fade1 {
	opacity: 0;
	transition-duration: 1s;
	pointer-events: none;
}


/* 動画：終了後は0.3秒で消す */
#fade2 {
	z-index: 1;
	opacity: 0;
	transition: opacity 0.3s ease-in-out;
	pointer-events: none;
}

/* 動画を表示するときは1秒かけて出す */
#cy_header.is-video-visible #fade2 {
	opacity: 1;
	transition-duration: 1s;
}

/* タイトルは常に表示 */
#top_title {
	position: absolute;
	z-index: 3;
	bottom: 60px;
	left: 80px;
	margin: 0;
	font-size: 50px;
	pointer-events: none;
}
.top_title_bg {
	background-color: rgba(29,29,27,0.46);
	padding: 15px 0 5px 5px;
}
#top_title span:not(.top_title_bg) {
	font-size: 64px;
}
/**************/
#nav_box {
	background-color: #1d1d1b;
	width: 270px;
	padding: 30px 0 0;
	position: absolute;
	right: 20px;
	top: 20px;
	z-index: 999;
}
#logo {
	text-align: center;
}
#cy_nav {
	display: flex;
	justify-content: center;
	margin-top: 20px;
}
#cy_nav li {
	padding: 10px 0 10px 30px;
	line-height: 1.3em;
	font-size: 14px;
}
#cy_nav a {
	color: #FFF;
	position: relative;
	display:block;
}
#cy_nav a:before {
	content: "";
	background: url(../images/shape.png) left 0/100% 100% no-repeat;
	width: 15px;
	height: 5px;
	position: absolute;
	left: -35px;
	top: 3px;
	opacity: 0;
	transition: 0.3s ease-in-out;
}
#cy_nav a:hover:before {
	opacity: 1;
	left: -25px;
}
#cy_nav .a_now a:before {
	opacity: 1;
	left: -25px;
}
#open_box {
	background-color: #626262;
	margin-top: 20px;
	padding: 20px;
	display: flex;
	justify-content: center;
}
.open_t {
	line-height: 1.3em;
	font-size: 16px;
}
.open_t .mini {
	font-size: 13px;
}
.open_tel {
	font-size: 20px;
	margin-top: 5px;
}
.open_tel .fa-phone {
	font-size: 14px;
	position: relative;
	top: -2px;
}
.fa-phone {
	transform: scale(-1, 1);
}
/*****************/
#top_bg1 {
	background: url(../images/top2.png) 50% 0/cover no-repeat;
	height: 1074px;
	width: 100%;
}
.midashi40 {
	font-size: 40px;
}
.big50 {
	font-size: 50px;
}
.center {
	text-align: center;
}
.flex_center {
	display: flex;
	justify-content: center;
}
.top_text {
	font-size: 20px;
	line-height: 2.3em;
}
.more1 {
	width: 280px;
	margin: 0 auto;
}
.more1 a {
	display: block;
	border: 1px solid #FFF;
	background-color: rgba(255, 255, 255, 0.2);
	padding: 10px;
	text-align: center;
	color: #FFF;
	font-size: 14px;
	position: relative;
}
.more1 a:after {
	content: "";
	background: url(../images/more.png) left 0/100% 100% no-repeat;
	width: 55px;
	height: 8px;
	position: absolute;
	right: -14px;
	top: 50%;
	opacity: 0;
	transform: translateY(-50%);
	transition: 0.3s ease-in-out;
}
.more1 a:hover:after {
	opacity: 1;
	right: -24px;
}
/*****************/
.padding200_220 {
	padding: 200px 0 220px;
}
.top_flex {
	display: flex;
	justify-content: space-between;
}
.top_left {
	width: 42%;
}
.top_width {
	width: 100%;
	padding: 0 14px;
	max-width: 620px;
	margin: 0 0 0 auto;
}
.midashi40 {
	font-size: 40px;
}
.top_right {
	width: 56%;
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
}
.top_right img {
	width: 100%;
	height: auto;
}
.left_img {
	width: 46%;
	margin-bottom: -80px;
}
.right_img {
	width: 48%;
}
.more {
	width: 250px;
}
.more a {
	display: block;
	border: 1px solid #FFF;
	padding: 13px 20px 10px;
	color: #FFF;
	font-size: 14px;
	position: relative;
}
.more a:after {
	content: "";
	background: url(../images/more.png) left 0/100% 100% no-repeat;
	width: 55px;
	height: 8px;
	position: absolute;
	right: -14px;
	top: 50%;
	opacity: 0;
	transform: translateY(-50%);
	transition: 0.3s ease-in-out;
}
.more a:hover:after {
	opacity: 1;
	right: -24px;
}
/****************/
#top_bg2 {
	background: url(../images/top5.png) right 0/1760px 680px no-repeat;
	width: calc(100% - 160px);
	padding-top: 380px;
}
.bg_box {
	width: 630px;
	margin: 0 0 0 auto;
	padding: 70px 20px 0 60px;
}
/****************/
#top_bg3 {
	background: url(../images/top6.png) left 0/1760px 680px no-repeat;
	width: calc(100% - 160px);
	margin: 160px 0 0 auto;
	padding-top: 380px;
}
.bg_box2 {
	width: 630px;
	padding: 70px 60px 0 0;
}
/******************/
.news {
	display: flex;
	flex-wrap: wrap;
}
.news li {
	width: 29.33%;
	margin: 60px 2%;
}
.news li:nth-child(3n + 2) {
	margin-top: 120px;
}
.news .img100 {
	padding-right: 30px;
}
.news a {
	display: block;
	color: #FFF;
}
.n_time {
	-webkit-writing-mode: vertical-rl;
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
	position: absolute;
	right: 0;
	top: 0;
	height: 100%;
	display: flex;
	align-items: center;
	font-size: 13px;
}
.n_time:after {
	content: "";
	border-left: 1px solid #FFF;
	flex-grow: 2;
	margin-top: 15px;
	height: 100%;
	position: relative;
	left: 2px;
}
.n_title {
	margin-top: 20px;
}
.m_center {
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}
/****************/
.map_flex {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.map_left {
	width: 50%;
}
.map_left iframe {
	width: 100%;
	height: 650px;
}
.map_right {
	order: 2;
	width: 40%;
}
.map_width {
	width: 94%;
	max-width: 600px;
}
/********************/
.f_banar {
	overflow: hidden;
}
.f_banar a {
	display: block;
	padding: 80px 0 70px;
	text-align: center;
	color: #FFF;
	background-color: #535353;
}
.f_banar p {
	font-size: 20px;
	margin-top: 20px;
}
.f_banar a:hover .hov_b {
	transform: scale(1.1);
}
.f_banar a:hover .b_icon img {
	transform: translateY(-5px) scale(-1, 1);
}
.hov_b {
	transition: 0.3s ease-in-out;
}
.b_icon img {
	transition: 0.3s ease-in-out;
}
/**************/
.f_bg {
	background-color: #1d1d1b;
	text-align: center;
	padding: 120px 0;
}
#copy {
	display:block;
	text-align: center;
	font-size: 12px;
	padding-top: 60px;
}
#copy a{
	color: #fff;
}
/*****************************/
.grid_set {
	display: -ms-grid;
	display: grid;
	grid-gap: 10px;
}
.nfn_grid {
	width: 100%;
	-ms-grid-rows: auto auto auto;
	-ms-grid-columns: 16.66% 16.66% 16.66% 16.66% 16.66% 16.66%;
	grid-template: "grid_item1 grid_item1 grid_item2 grid_item3 grid_item4 grid_item5" auto  "grid_item1 grid_item1 grid_item6 grid_item7 grid_item12 grid_item12" auto  "grid_item8 grid_item9 grid_item10 grid_item11 grid_item12 grid_item12" auto /  16.66% 16.66% 16.66% 16.66% 16.66% 16.66%;
}
.nfn_grid .grid_item1 {
	-ms-grid-row: 1;
	-ms-grid-row-span: 2;
	-ms-grid-column: 1;
	-ms-grid-column-span: 2;
	grid-area: grid_item1;
}
.nfn_grid .grid_item2 {
	-ms-grid-row: 1;
	-ms-grid-column: 3;
	grid-area: grid_item2;
}
.nfn_grid .grid_item3 {
	-ms-grid-row: 1;
	-ms-grid-column: 4;
	grid-area: grid_item3;
}
.nfn_grid .grid_item4 {
	-ms-grid-row: 1;
	-ms-grid-column: 5;
	grid-area: grid_item4;
}
.nfn_grid .grid_item5 {
	-ms-grid-row: 1;
	-ms-grid-column: 6;
	grid-area: grid_item5;
}
.nfn_grid .grid_item6 {
	-ms-grid-row: 2;
	-ms-grid-column: 3;
	grid-area: grid_item6;
}
.nfn_grid .grid_item7 {
	-ms-grid-row: 2;
	-ms-grid-column: 4;
	grid-area: grid_item7;
}
.nfn_grid .grid_item8 {
	-ms-grid-row: 3;
	-ms-grid-column: 1;
	grid-area: grid_item8;
}
.nfn_grid .grid_item9 {
	-ms-grid-row: 3;
	-ms-grid-column: 2;
	grid-area: grid_item9;
}
.nfn_grid .grid_item10 {
	-ms-grid-row: 3;
	-ms-grid-column: 3;
	grid-area: grid_item10;
}
.nfn_grid .grid_item11 {
	-ms-grid-row: 3;
	-ms-grid-column: 4;
	grid-area: grid_item11;
}
.nfn_grid .grid_item12 {
	-ms-grid-row: 2;
	-ms-grid-row-span: 2;
	-ms-grid-column: 5;
	-ms-grid-column-span: 2;
	grid-area: grid_item12;
}
.nfn_grid a {
	line-height: 0;
	padding: 10px;
	position: relative;
	height: 23vw;
	overflow: hidden;
}
.nfn_grid a:hover span:before {
	opacity: 1;
}
.nfn_grid a:hover span:after {
	opacity: 1;
}
.nfn_grid a span {
	display: block;
	width: 125%;
	height: 100%;
	position: absolute;
	top: 50%;
	left: 50%;
	overflow: hidden;
	transform: translateY(-50%) translateX(-50%);
}
.nfn_grid a span:before {
	opacity: 0;
	content: "";
	background-image: url(../images/instagram.png);
	width: 40px;
	height: 40px;
	background-repeat: no-repeat;
	background-size: cover;
	display: block;
	position: absolute;
	z-index: 65;
	top: 50%;
	left: 50%;
	transform: translateY(-50%) translateX(-50%);
}
.nfn_grid a span:after {
	opacity: 0;
	content: "";
	display: block;
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.7);
	z-index: 50;
}
.nfn_grid a img {
	width: 100%;
	height: auto;
}
.instagram-gallery {
	margin-bottom: 25px;
}
.instagram-gallery a {
	height: 13.5vw;
}
.instagram-gallery .grid_item1, .instagram-gallery .grid_item12 {
	height: 27vw;
}
/*******************************************************

	パティシエの本気

*******************************************************/
#cy_header.header_in {
	height: 680px;
}
#chef_main {
	background: url(../images/chef1.jpg) 50% 0/cover no-repeat;
}
.main_size {
	height: 680px;
	display: flex;
	align-items: center;
	text-align: center;
	justify-content: center;
}
#title_in {
	text-align: center;
	font-size: 40px;
}
/**********************/
.chef_img {
	width: calc(100% - 390px);
	margin: 0 0 0 auto;
	display: flex;
}
.chef_img img {
	width: 100%;
	height: auto;
}
.chef_left {
	width: 50%;
	margin-top: 70px;
}
.chef_left img {
	width: calc(100% + 80px);
	position: relative;
	z-index: 100;
}
.chef_right {
	width: 50%;
}
/**********************/
#chef_bg {
	background: url(../images/chef4.jpg) 50% 0/cover no-repeat;
	height: 620px;
}
.flex_box {
	display: flex;
	justify-content: space-between;
}
.flex_52 {
	width: 52%;
}
.flex_40 {
	width: 40%;
}
.chef_width {
	width: 100%;
	max-width: 690px;
	margin: 0 0 0 auto;
	padding: 0 0 0 14px;
}
.item_center {
	align-items: center;
}
.flex_44 {
	width: 44%;
}
.flex_50 {
	width: 50%;
}
.chef_width2 {
	width: 100%;
	max-width: 630px;
	margin: 0 0 0 auto;
}
/*****************/
.img_list2 {
	display: flex;
	justify-content: space-between;
}
.img_list2 li {
	width: 50%;
}
/*******************************************************

	フルーツへのこだわり

*******************************************************/
#commit_main {
	background: url(../images/commit1.jpg) 50% 0/cover no-repeat;
}
.com_list {
	display: flex;
	justify-content: space-between;
}
.com_list li {
	width: 30.33%;
}
.com_list .midashi24 {
	margin: 25px 0 15px;
}
.com_list p {
	line-height: 2.4em;
}
.midashi24 {
	font-size: 24px;
}
/*****/
.midashi32 {
	font-size: 32px;
}
.calc_img img {
	width: calc(100% + 235px);
	height: auto;
}
.item_end {
	align-items: flex-end;
}
.com_pb {
	padding-bottom: 60px;
}
.flex_56 {
	width: 56%;
}
.flex_36 {
	width: 36%;
}
/*******************************************************

	ソフトクリーム

*******************************************************/
#ice_main {
	background: url(../images/ice1.jpg) 50% 0/cover no-repeat;
}
.ice_flex {
	display: flex;
	justify-content: space-between;
}
.ice_left {
	width: 680px;
}
.ice_right {
	width: calc(100% - 680px);
}
/**********/
.ice_flex2 {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
}
.ice_left2 {
	width: 50%;
	padding-bottom: 60px;
}
.ice_right2 {
	width: 40%;
	margin-top: -120px;
}
/***********/
.border_box {
	border: 2px solid #FFF;
	padding: 120px;
}
.ice_flex3 {
	display: flex;
	justify-content: space-between;
}
.ice_left3 {
	width: 360px;
}
.ice_right3 {
	width: calc(100% - 420px);
	margin-top: -13px;
}
/*******************************************************

	クレームブリュレ

*******************************************************/
#brulee_main {
	background: url(../images/brulee1.jpg) 50% 0/cover no-repeat;
}
.b_calc_img {
	width: 70%;
}
.b_calc_img img {
	width: 100%;
	height: auto;
}
.br_flex {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	width: calc(100% - 300px);
	margin-top: -80px;
}
.br_left {
	width: 30%;
}
.br_right {
	width: 64%;
	max-width: 660px;
}
.br_num {
	font-size: 24px;
}
#br_img {
	position: absolute;
	right: 0;
	top: 240px;
	width: 21%;
}
#br_img img {
	width: 100%;
	height: auto;
}
/***********/
.br_calc {
	width: calc(100% + 160px);
	margin-top: -60px;
}
.br_calc img {
	width: 100%;
	height: auto;
}
/*********/
.br_img {
	padding-left: 80px;
	width: 40%;
	position: relative;
	z-index: 500;
}
.br_img img {
	max-width: 530px;
	height: auto;
	width: 100%;
}
.br_img2 {
	width: 70%;
	margin: -240px 0 0 auto;
}
.br_img2 img {
	width: 100%;
	height: auto;
}
/**************/
.br_flex2 {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
}
.br_left2 {
	width: 55%;
}
.br_width2 {
	width: 100%;
	max-width: 680px;
	margin: 0 0 0 auto;
	padding: 0 14px;
}
.br_right2 {
	width: 42%;
	text-align: right;
}
.br_right2 img {
	width: 100%;
	height: auto;
	max-width: 645px;
}
/***********/
.br_width3 {
	width: 100%;
	max-width: 600px;
}
/*******************************************************

	アクセス

*******************************************************/
#access_main {
	background: url(../images/access1.jpg) 50% 0/cover no-repeat;
}
.ac_flex {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.ac_left {
	width: 55%;
	background: url(../images/access2.jpg) 55% 0/cover no-repeat;
	height: 540px;
}
.ac_right {
	width: 40%;
	padding-right: 20px;
}
.indent_p {
	text-indent: -1em;
	padding-left: 16px;
}
.ac_map iframe {
	width: 100%;
	height: 500px;
}
.ac_list {
	display: flex;
	justify-content: space-between;
}
.ac_list li {
	width: 25%;
	border-right: 1px solid #FFF;
	padding: 30px 20px;
	text-align: center;
}
.ac_num {
	font-size: 32px;
	margin-bottom: 20px;
}
/*******************************************************

	お問い合わせ

*******************************************************/
#contact_main {
	background: url(../images/contact1.jpg) 50% 0/cover no-repeat;
}
.contact_table li {
	display: table;
	width: 100%;
	margin: 40px 0;
}
.c_cell1 {
	display: table-cell;
	width: 520px;
	position: relative;
	padding-left: 100px;
	vertical-align: middle;
}
.c_cell2 {
	display: table-cell;
	padding-left: 20px;
	vertical-align: middle;
}
.hissu {
	background-color: #FFF;
	color: #000;
	font-size: 14px;
	line-height: 1.5em;
	padding: 2px 10px 0;
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
}
.size, .area, .tel_input {
	width: 100%;
	padding: 10px;
	background-color: rgba(255, 255, 255, 0.4);
	border: 0;
	border: 1px solid #FFF;
}
.tel_input {
	width: 100%;
	max-width: 300px;
}
.size, .tel_input {
	height: 60px;
}
.area {
	height: 250px;
}
.sub {
	width: 280px;
	margin-left: auto;
	margin-right: auto;
	position: relative;
}
.sub input {
	display: block;
	text-align: center;
	width: 100%;
	border: 1px solid #FFF;
	background-color: transparent;
	padding: 20px;
	position: relative;
}
.sub:after {
	content: "";
	background: url(../images/more.png) left 0/100% 100% no-repeat;
	width: 55px;
	height: 8px;
	position: absolute;
	right: -14px;
	top: 50%;
	opacity: 0;
	transform: translateY(-50%);
	transition: 0.3s ease-in-out;
}
.sub:hover:after {
	opacity: 1;
	right: -24px;
}
/*******************************************************

	お知らせ

*******************************************************/
#news_main {
	background: url(../images/news1.jpg) 50% 0/cover no-repeat;
}
/**********************/
.br1200 {
	display: none;
}
.bold {
    font-weight: bold;
}
.text_underline {
    border-bottom: 1px solid #FFF;
    display: inline-block;
}
.f_banar .text_15 {
    font-size: clamp(14px,1vw,15px);
}
.indent_p {
    text-indent: -1em;
    padding-left: 25px;
    text-align: left;
}
.max_width {
    max-width: max-content;
    margin-left: auto;
    margin-right: auto;
}



/* PC用
------------------------------------------------------------*/
@media only screen and (max-width: 1699px) {
/******************************/
#cy_header {
	position: relative;
	height: 720px;
}
.flexslider,  #fade1,  #fade2,  #fade3 {
	height: 720px;
}
#top_title {
	position: absolute;
	bottom: 120px;
	left: 40px;
	font-size: 40px;
}
#top_title span:not(.top_title_bg) {
	font-size: 54px;
}
}

@media only screen and (max-width: 1400px) {
.brnone1400 {
	display: none;
}
}

@media only screen and (max-width: 1200px) {
.br1200 {
	display: block;
}
/****************/
#top_bg2 {
	width: calc(100% - 80px);
}
/****************/
#top_bg3 {
	width: calc(100% - 80px);
}
}

@media only screen and (max-width: 1024px) {
    
.padding120 {
	padding: 100px 0;
}
.pt-120 {
	padding-top: 100px;
}
.pb-120 {
	padding-bottom: 100px;
}
.margin120 {
	margin-top: 100px;
	margin-bottom: 100px;
}
.mt-120 {
	margin-top: 100px;
}
.mb-120 {
	margin-bottom: 100px;
}
.padding150 {
	padding: 120px 0;
}
.pt-150 {
	padding-top: 120px;
}
.pb-150 {
	padding-bottom: 120px;
}
.margin150 {
	margin-top: 120px;
	margin-bottom: 120px;
}
.mt-150 {
	margin-top: 120px;
}
.mb-150 {
	margin-bottom: 120px;
}
.padding200 {
	padding: 120px 0;
}
.pt-200 {
	padding-top: 120px;
}
/**************/
#nav_box {
	background-color: transparent;
	width: 180px;
	padding: 0;
	right: auto;
	left: 20px;
	top: 20px;
}
#logo {
	display: none;
	text-align: center;
}
#cy_nav {
	display: none;
}
#open_box {
	margin-top: 0;
	padding: 15px;
}
.open_t {
	line-height: 1.3em;
	font-size: 13px;
}
.open_t .mini {
	font-size: 10px;
}
.open_tel {
	font-size: 16px;
	margin-top: 5px;
}
.open_tel .fa-phone {
	font-size: 12px;
	top: -1px;
}
/*****************/
#top_bg1 {
	background: url(../images/top2.png) 50% 0/cover no-repeat;
	height: 940px;
	width: 100%;
}
.midashi40 {
	font-size: 30px;
}
.big50 {
	font-size: 40px;
}
.top_text {
	font-size: 16px;
	line-height: 2.3em;
}
/*****************/
.padding200_220 {
	padding: 80px 0 140px;
}
/****************/
#top_bg2 {
	background: url(../images/top5.png) right 0/1024px 395px no-repeat;
	width: calc(100% - 40px);
	padding-top: 170px;
}
.bg_box {
	width: 340px;
	margin: 0 0 0 auto;
	padding: 70px 0 0 0;
}
/****************/
#top_bg3 {
	background: url(../images/top6.png) left 0/1024px 395px no-repeat;
	width: calc(100% - 40px);
	margin: 80px 0 0 auto;
	padding-top: 170px;
}
.bg_box2 {
	width: 340px;
	padding: 70px 0 0 0;
}
/*********************************/
.nfn_grid {
	-ms-grid-rows: auto auto auto;
	-ms-grid-columns: 20% 20% 20% 20% 20%;
	grid-template: "grid_item1 grid_item1 grid_item2 grid_item3 grid_item4" auto  "grid_item1 grid_item1 grid_item5 grid_item9 grid_item9" auto  "grid_item6 grid_item7 grid_item8 grid_item9 grid_item9" auto /  20% 20% 20% 20% 20%;
}
.nfn_grid .grid_item11 {
	display: none;
}
.nfn_grid .grid_item12 {
	display: none;
}
.nfn_grid .grid_item1 {
	-ms-grid-row: 1;
	-ms-grid-row-span: 2;
	-ms-grid-column: 1;
	-ms-grid-column-span: 2;
}
.nfn_grid .grid_item2 {
	-ms-grid-row: 1;
	-ms-grid-column: 3;
}
.nfn_grid .grid_item3 {
	-ms-grid-row: 1;
	-ms-grid-column: 4;
}
.nfn_grid .grid_item4 {
	-ms-grid-row: 1;
	-ms-grid-column: 5;
}
.nfn_grid .grid_item5 {
	-ms-grid-row: 2;
	-ms-grid-column: 3;
}
.nfn_grid .grid_item6 {
	-ms-grid-row: 3;
	-ms-grid-column: 1;
}
.nfn_grid .grid_item7 {
	-ms-grid-row: 3;
	-ms-grid-column: 2;
}
.nfn_grid .grid_item8 {
	-ms-grid-row: 3;
	-ms-grid-column: 3;
}
.nfn_grid .grid_item9 {
	-ms-grid-row: 2;
	-ms-grid-row-span: 2;
	-ms-grid-column: 4;
	-ms-grid-column-span: 2;
}
.instagram-gallery .grid_item1,  .instagram-gallery .grid_item9 {
	height: 27vw;
}
/*******************************************************

	パティシエの本気

*******************************************************/
#cy_header.header_in {
	height: 400px;
}
.main_size {
	height: 400px;
	align-items: flex-end;
}
#title_in {
	text-align: center;
	font-size: 34px;
	padding-bottom: 40px;
}
/**********************/
.chef_img {
	width: calc(100% - 200px);
}
/**********************/
#chef_bg {
	height: 380px;
}
/*****************/
.img_list2 {
	display: flex;
	justify-content: space-between;
}
.img_list2 li {
	width: 50%;
}
/*******************************************************

	ソフトクリーム

*******************************************************/
.ice_flex {
	display: block;
}
.ice_left {
	width: 100%;
}
.ice_right {
	width: 100%;
	margin-top: 30px;
}
/**********/
.ice_left2 {
	padding-bottom: 20px;
}
.ice_right2 {
	margin-top: -40px;
}
.ice_right2 img {
	width: 94%;
}
/***********/
.border_box {
	padding: 60px;
}
/*******************************************************

	クレームブリュレ

*******************************************************/
.br_flex {
	width: calc(100% - 200px);
	margin-top: 40px;
}
/***********/
.br_calc {
	width: calc(100% + 160px);
	margin-top: -60px;
}
.br_calc img {
	width: 100%;
	height: auto;
}
/*********/
.br_img {
	padding-left: 80px;
	width: 40%;
	position: relative;
	z-index: 500;
}
.br_img img {
	max-width: 530px;
	height: auto;
	width: 100%;
}
.br_img2 {
	width: 70%;
	margin: -240px 0 0 auto;
}
.br_img2 img {
	width: 100%;
	height: auto;
}
/*******************************************************

	お問い合わせ

*******************************************************/
.c_cell1 {
	width: 360px;
	padding-left: 40px;
}
}

@media only screen and (max-width: 740px) {
#fade1 {
    z-index: 2;
    opacity: 1;
    background: url(../images/fade1.jpg) 50% 60% / cover no-repeat;
    transition: opacity 0.6s ease-in-out;
    will-change: opacity;
}
.padding120 {
	padding: 60px 0;
}
.pt-120 {
	padding-top: 60px;
}
.pb-120 {
	padding-bottom: 60px;
}
.margin120 {
	margin-top: 60px;
	margin-bottom: 60px;
}
.mt-120 {
	margin-top: 60px;
}
.mb-120 {
	margin-bottom: 60px;
}
.padding150 {
	padding: 80px 0;
}
.pt-150 {
	padding-top: 80px;
}
.pb-150 {
	padding-bottom: 80px;
}
.margin150 {
	margin-top: 80px;
	margin-bottom: 80px;
}
.mt-150 {
	margin-top: 80px;
}
.mb-150 {
	margin-bottom: 80px;
}
.padding200 {
	padding: 80px 0;
}
.pt-200 {
	padding-top: 80px;
}
/******************************/
#cy_header {
	position: relative;
	height: 410px;
}
.flexslider,  #fade1,  #fade2,  #fade3 {
	height: 410px;
}
    #fade2 video {
        transform: scale(1.35)
    }
#top_title {
	position: absolute;
	bottom: 20px;
	left: 10px;
	font-size: 30px;
}
#top_title span:not(.top_title_bg) {
	font-size: 40px;
}
/**************/
#nav_box {
	background-color: #1d1d1b;
	width: 120px;
	padding: 0;
	right: auto;
	left: 10px;
	top: 25px;
}
#logo {
	text-align: center;
}
#logo img {
	width: 60px;
	height: auto;
}
#cy_nav {
	display: none;
}
#open_box {
	padding: 10px 0;
}
.open_t {
	line-height: 1.4em;
	font-size: 10px;
}
.open_t .mini {
	font-size: 10px;
}
.open_time{
	display: block;
	text-align: center;}
.sp_none{display: none;}
.open_tel {
	font-size: 14px;
	letter-spacing: 0;
	margin-top: 5px;
	text-align: center;
}
.open_tel .fa-phone {
	font-size: 10px;
	top: -1px;
}
/*****************/
#top_bg1 {
	height: auto;
	padding-bottom: 160px;
}
.midashi40 {
	font-size: 24px;
}
.big50 {
	font-size: 34px;
}
.minit-hi {
	line-height: 2.2em;
}
.flex_center {
	display: flex;
	justify-content: center;
}
.top_text {
	font-size: 14px;
	line-height: 2.2em;
}
/*****************/
.padding200_220 {
	padding: 40px 0 120px;
}
.top_flex {
	display: block;
}
.top_left {
	width: 94%;
}
.top_width {
	width: 94%;
	padding: 0;
	max-width: 620px;
	margin: 0 auto;
}
.top_right {
	width: 94%;
	margin: 60px auto 0;
}
.left_img {
	margin-bottom: -20px;
}
.right_img {
	width: 48%;
}
.more {
	width: 220px;
	margin-left: auto;
	margin-right: auto;
}
/****************/
#top_bg2 {
	background: url(../images/top5.jpg) 50% 0/cover no-repeat;
	width: 100%;
	padding: 40px 0;
}
.bg_box {
	width: 94%;
	margin: 0 auto;
	padding: 40px;
	background-color: rgba(0, 0, 0, 0.48);
}
/****************/
#top_bg3 {
	background: url(../images/top6.jpg) 50% 0/cover no-repeat;
	width: 100%;
	padding: 40px 0;
	margin: 40px 0 0 auto;
}
.bg_box2 {
	width: 94%;
	margin: 0 auto;
	padding: 40px;
	background-color: rgba(0, 0, 0, 0.48);
}
/******************/
.news {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.news li {
	width: 48%;
	margin: 40px 0;
}
.news li:nth-child(3n + 2) {
	margin-top: 40px;
}
.news .img100 {
	padding-right: 20px;
}
.top_news li:nth-child(3) {
	display: none;
}
.n_time {
	font-size: 10px;
}
.n_time:after {
	margin-top: 10px;
	left: 1px;
}
.n_title {
	margin-top: 15px;
	font-size: 12px;
}
/****************/
.map_flex {
	display: block;
}
.map_left {
	width: 100%;
	margin-top: 60px;
}
.map_left iframe {
	height: 350px;
}
.map_right {
	order: 2;
	width: 94%;
}
.map_width {
	width: 94%;
	max-width: 600px;
	margin: 0 auto;
}
/********************/
.f_banar {
	display: block;
}
.f_banar a {
	padding: 20px 0 20px;
}
.f_banar p {
	font-size: 14px;
	margin-top: 0;
}
.f_banar img {
	transform: scale(0.6);
	display: block;
	margin: 0 auto;
}
.f_banar a:hover .hov_b {
	transform: scale(1);
}
.f_banar a:hover .b_icon img {
	transform: translateY(0) scale(0.6);
}
.hov_b {
	transition: 0s ease;
}
.b_icon img {
	transition: 0s ease;
}
/**************/
.f_bg {
	padding: 60px 0;
}
.f_logo img {
	width: 60px;
	height: auto;
}
#copy {
	font-size: 10px;
	padding-top: 40px;
}
/**********************************/
.nfn_grid .grid_item7, .nfn_grid .grid_item8, .nfn_grid .grid_item9, .nfn_grid .grid_item10 {
	display: none;
}
.instagram-gallery {
	margin-bottom: 25px;
}
.instagram-gallery .grid_item1,  .instagram-gallery .grid_item9 {
	height: 25vw;
}
.instagram-gallery a {
	height: 25vw;
}
header:after {
	width: calc(100% - 15px);
	height: calc(100% - 15px);
	border: 2px solid #d5d5d5;
}
.map_box iframe {
	height: 350px;
}
.nfn_grid a {
	padding: 5px;
}
.nfn_grid {
	-ms-grid-rows: auto auto;
	-ms-grid-columns: 33.3333% 33.3333% 33.3333%;
	grid-template: "grid_item1 grid_item2 grid_item3" auto  "grid_item4 grid_item5 grid_item6" auto /  33.3333% 33.3333% 33.3333%;
}
.he_h2 {
	font-size: 1.7rem;
	letter-spacing: 2px;
}
.he2_h2 {
	font-size: 2rem;
	letter-spacing: 2px;
}
.nfn_grid .grid_item1 {
	-ms-grid-row: 1;
	-ms-grid-row-span: 1;
	-ms-grid-column: 1;
	-ms-grid-column-span: 1;
}
.nfn_grid .grid_item2 {
	-ms-grid-row: 1;
	-ms-grid-column: 2;
}
.nfn_grid .grid_item3 {
	-ms-grid-row: 1;
	-ms-grid-column: 3;
}
.nfn_grid .grid_item4 {
	-ms-grid-row: 2;
	-ms-grid-column: 1;
}
.nfn_grid .grid_item5 {
	-ms-grid-row: 2;
	-ms-grid-column: 2;
}
.nfn_grid .grid_item6 {
	-ms-grid-row: 2;
	-ms-grid-column: 3;
}
.instagram-gallery {
	margin-bottom: 25px;
}
.instagram-gallery .grid_item1,  .instagram-gallery .grid_item9 {
	height: 25vw;
}
.instagram-gallery a {
	height: 25vw;
}
/*******************************************************

	パティシエの本気

*******************************************************/
#cy_header.header_in {
	height: 350px;
}
.main_size {
	height: 350px;
}
#title_in {
	font-size: 22px;
	padding-bottom: 30px;
}
/**********************/
.chef_img {
	width: 94%;
	margin: 0 auto;
}
.chef_left {
	margin-top: 40px;
}
/**********************/
#chef_bg {
	height: 200px;
}
.flex_box {
	display: block;
}
.flex_52 {
	width: 100%;
}
.flex_40 {
	width: 100%;
}
.chef_width {
	width: 94%;
	max-width: 94%;
	margin: 0 auto;
	padding: 0;
}
.flex_44 {
	width: 100%;
}
.flex_50 {
	width: 100%;
}
.chef_width2 {
	width: 100%;
	max-width: 100%;
	margin: 0 auto;
}
/*******************************************************

	フルーツへのこだわり

*******************************************************/
.minita-l {
	text-align: left !important;
}
.com_list {
	display: block;
	border-top: 1px solid rgba(255, 255, 255, 0.3);
}
.com_list li {
	width: 100%;
	margin: 0;
	padding: 40px 0;
	border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}
.com_list .img100 {
	width: 100%;
}
.com_list .sp_top {
	width: calc(100% - 120px);
}
.com_list .midashi24 {
	margin: 20px 0 10px;
}
.com_list p {
	line-height: 2em;
}
.midashi24 {
	font-size: 20px;
}
/*****/
.midashi32 {
	font-size: 22px;
}
.calc_img img {
	width: 100%;
	height: auto;
}
.item_end {
	align-items: flex-end;
}
.com_pb {
	padding-bottom: 0;
	margin-top: 40px;
}
.flex_56 {
	width: 100%;
}
.flex_36 {
	width: 100%;
}
/*******************************************************

	ソフトクリーム

*******************************************************/
.ice_flex {
	display: block;
}
.ice_left {
	width: 100%;
}
.ice_right {
	width: 100%;
	margin-top: 30px;
}
/**********/
.ice_flex2 {
	display: block;
}
.ice_left2 {
	width: 100%;
	padding-bottom: 0;
	margin-top: 40px;
}
.ice_right2 {
	width: 100%;
	margin-top: 40px;
}
.ice_right2 img {
	width: 100%;
}
/***********/
.border_box {
	border: 2px solid #FFF;
	padding: 0 20px;
}
.ice_flex3 {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	margin: 0 !important;
	padding: 40px 0;
	border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}
.ice_flex3:last-child {
	border: 0;
}
.ice_left3 {
	width: 100%;
	order: 2;
	margin-top: 40px;
}
.ice_right3 {
	width: 100%;
	margin-top: 0;
}
/*******************************************************

	クレームブリュレ

*******************************************************/
.b_calc_img {
	width: 70%;
}
.b_calc_img img {
	width: 100%;
	height: auto;
}
.br_flex {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	width: 100%;
	margin-top: 40px;
}
.br_left {
	width: 100px;
}
.br_left img {
	position: sticky;
	top: 0;
}
.br_right {
	width: calc(100% - 120px);
}
.br_num {
	font-size: 18px;
}
#br_img {
	position: absolute;
	right: 0;
	top: 60px;
	width: 21%;
}
#br_img img {
	width: 100%;
	height: auto;
}
/***********/
.br_calc {
	width: 100%;
	margin-top: 40px;
}
.br_calc img {
	width: 100%;
	height: auto;
}
/*********/
.br_img {
	padding-left: 0;
	margin-top: -40px;
	width: 40%;
	position: relative;
	z-index: 500;
}
.br_img img {
	max-width: 530px;
	height: auto;
	width: 100%;
}
.br_img2 {
	width: 70%;
	margin: -100px 0 0 auto;
}
.br_img2 img {
	width: 100%;
	height: auto;
}
/**************/
.br_flex2 {
	display: block;
}
.br_left2 {
	width: 100%;
}
.br_width2 {
	width: 100%;
	max-width: 680px;
	margin: 0 0 0 auto;
	padding: 0 14px;
}
.br_right2 {
	width: 94%;
	text-align: right;
	margin: 40px auto 0;
}
.br_right2 img {
	width: 100%;
	height: auto;
	max-width: 100%;
}
/***********/
.br_width3 {
	width: 100%;
	max-width: 100%;
	margin: 0 auto;
}
.mini_w94 {
	width: 94%;
	max-width: 94%;
	margin: 0 auto;
}
/*******************************************************

	アクセス

*******************************************************/
.ac_flex {
	display: block;
}
.ac_left {
	width: 94%;
	height: 100%;
	margin: 0 auto;
}
.ac_right {
	width: 94%;
	margin: 0 auto;
	padding-right: 0;
}
.indent_p {
	text-indent: -1em;
	padding-left: 16px;
}
.ac_map iframe {
	width: 100%;
	height: 250px;
}
.ac_list {
	display: flex;
	flex-wrap: wrap;
}
.ac_list li {
	width: 50%;
	padding: 10px 10px;
	text-align: center;
	margin: 10px 0;
}
.ac_list li:nth-child(2n) {
	border: 0;
}
.ac_num {
	font-size: 32px;
	margin-bottom: 20px;
}
/*******************************************************

	お問い合わせ

*******************************************************/
.contact_table li {
	display: block;
	margin: 20px 0;
}
.c_cell1 {
	display: block;
	width: 100%;
	padding-left: 0;
}
.c_cell2 {
	display: block;
	padding-left: 0;
	margin-top: 10px;
}
.hissu {
	font-size: 12px;
	line-height: 1.5em;
	padding: 2px 10px 0;
}
.tel_input {
	max-width: 240px;
}
.size,  .tel_input {
	height: 40px;
}
.area {
	height: 200px;
}
#chef_main {
    background: url(../images/chef1.jpg) 70% 0/cover no-repeat;
}
}

/* スマートフォン 縦(ポートレート) */
@media only screen and (max-width: 480px) {
    
#top_title {
	position: absolute;
	bottom: 20px;
	left: 10px;
	font-size: 7vw;
	line-height: 2em;
}
	.top_title_bg {
		background-color: rgba(29,29,27,0.46);
		padding: 10px 0 3px 5px;
	}

#top_title span:not(.top_title_bg) {
	font-size: 9vw;
}
}