@charset "utf-8";
/* ===================================================
	Cuisine CSS
====================================================== */

/* ---------------------------------------------------
Box Local Navigation
------------------------------------------------------ */
.box_lnav{ text-align: center; padding: 50px 0;}
.box_lnav .btn_01{ margin: 0 0 30px;}
.box_lnav .btn_01 a{ display: inline-block; padding: 0 25px; font-size: 16px; line-height: 1.1; color: #c23e6c; position: relative; background-image: url("../img/ico_caution_01.svg") , url("../img/ico_arrow_03.svg"); background-repeat: no-repeat , no-repeat; background-position: left top , right top 5px; background-size: 18px , 14px; transition: background-position 0.5s; }
.box_lnav .btn_01 a:hover{ background-position: left top , right top 7px;}
.box_lnav .lnav{ display: flex; justify-content: center; align-items: stretch;}
.box_lnav .lnav li{ width: 290px; margin: 0 5px;}
.box_lnav .lnav li a{ display: flex; justify-content: center; align-items: center; font-size: 18px; line-height: 1.1; height: 100px; width: 100%; border-top: solid 3px #dfd6d1; position: relative;}
.box_lnav .lnav li a::after{ content: ""; display: block; width: 8px; height: 8px; border-bottom: solid 3px #dfd6d1; border-right: solid 3px #dfd6d1; transform: rotate(45deg); position: absolute; bottom: 15px; left: 0; right: 0; margin: 0 auto; transition: bottom 0.5s;}
.box_lnav .lnav li a:hover{ text-decoration: none;}
.box_lnav .lnav li a:hover::after{ bottom: 10px;}

@media screen and (max-width: 600px) {
.box_lnav{ padding: 30px 0;}
.box_lnav .btn_01{ margin: 0 0 20px;}
.box_lnav .btn_01 a{ padding: 2px 25px; background-position: left top 1px , right top 7px;}
.box_lnav .btn_01 a:hover{ background-position: left top , right top 9px;}
.box_lnav .lnav{ flex-direction: column; width: 90%; margin: 0 auto; border-bottom: solid 1px #dfd6d1;}
.box_lnav .lnav li{ width: 100%; margin: 0;}
.box_lnav .lnav li a{ font-size: 16px; line-height: 1.1; height: 60px; border-top: solid 1px #dfd6d1;}
.box_lnav .lnav li a::after{ width: 8px; height: 8px; border-bottom: solid 2px #dfd6d1; border-right: solid 2px #dfd6d1; top: 0; bottom: 0; left: inherit; right: 15px; margin: auto 0;}
.box_lnav .lnav li a:hover::after{ bottom: 3px;}
}

/* ---------------------------------------------------
Section 01
------------------------------------------------------ */
.sec_01{ background-color: #f3efe9;}
.sec_01 .box_01{ width: 100%; position: relative;}
.sec_01 .box_01 .tit_01{ background: rgba(255,255,255,0.9); width: 180px; height: 270px; position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto auto; display: flex; flex-direction: column; justify-content: center; align-items: center;}
.sec_01 .box_01 .tit_01 .ja{ font-size: 40px; color: #603219;}
.sec_01 .box_01 .tit_01 .en{ font-size: 12px; color: #e78c67; background: #E78C67; background: linear-gradient(to right, #E78C67 0%, #C88BCA 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; padding: 15px 0 0;}
.sec_01 .box_01 .img{ width: 100%; height: 750px; object-fit: cover;}
.sec_01 .box_02{ text-align: center; padding: 50px 0 100px;}
.sec_01 .box_02 .txt_01{ font-size: 16px; line-height: 2;}
.sec_01 .box_03{ display: flex; justify-content: space-between; position: relative;}
.sec_01 .box_03 .tit_02{ position: absolute; left: 50px; top: 55px; color: #fff; display: flex; flex-direction: row-reverse;}
.sec_01 .box_03 .tit_02 .sub{ font-size: 25px; padding: 25px 0 0; opacity: 0.6;}
.sec_01 .box_03 .tit_02 .main{ font-size: 45px;}
.sec_01 .box_03 .img_02 img,
.sec_01 .box_03 .img_03 img{ width: 100%; height: auto;}
.sec_01 .box_03 .img_02{ width: 64.1%; max-width: 770px;}
.sec_01 .box_03 .img_03{ width: 35%; max-width: 420px;}
.sec_01 .box_04{ display: flex; justify-content: space-between; padding: 50px 0 100px;}
.sec_01 .box_04 .tit_03{ width: 300px; border-right: solid 1px #d6c9bf; display: flex; justify-content: center; align-items: center; font-size: 28px; color:rgba(96,50,25,0.7);}
.sec_01 .box_04 .txt_02{ width: calc( 100% - 350px ); font-size: 16px; line-height: 1.8;}
.sec_01 .box_05{ background: #fff; padding: 70px 70px 10px; }
.sec_01 .box_05 .tit_04{ text-align: center; font-size: 28px; color:rgba(96,50,25,0.7); letter-spacing: 0.1em; padding: 0 0 30px;}
.sec_01 .box_05 .tit_04 em{ font-style: normal; font-size: 48px;}
.sec_01 .box_05 .sec_in{ display: flex; justify-content: space-between; align-items: center; margin: 0 0 60px;}
.sec_01 .box_05 .box_img{ width: 770px;}
.sec_01 .box_05 .box_img img{ width: 100%; height: auto;}
.sec_01 .box_05 .box_txt{ width: 230px; display: flex; flex-wrap: wrap; justify-content: center; align-items: flex-start; flex-direction: row-reverse;}
.sec_01 .box_05 .tit_05{ font-size: 30px; line-height: 1.3; color: #c23e6c; padding: 0.5em 0 30px; text-indent: -0.5em;}
.sec_01 .box_05 .txt_03{ font-size: 16px; line-height: 1.8; padding: 1em 1em 30px 0;}
.sec_01 .box_05 .btn_01{ width: 100%;}
.sec_01 .box_05 .btn_01 a { display: block; width: 100%; height: 50px; font-size: 16px; line-height: 50px; text-align: center; padding: 0; background: rgb(173,35,84); background: linear-gradient(90deg, rgba(173,35,84,1) 0%, rgba(202,90,116,1) 100%); color: #fff; position: relative; overflow: hidden; z-index: 1;}
.sec_01 .box_05 .btn_01 a::before { content: ""; display: block; width: 20px; height: 30px; position: absolute; top: 15px; left: 46px;}
.sec_01 .box_05 .btn_01 a::after { background: #9f1647; position: absolute; top: 0; left: 0; content: ''; width: 100%; height: 100%; transform: scale(0, 1); transform-origin: left top; transition: .5s cubic-bezier(0.45, 0, 0.55, 1); z-index: -1; }
.sec_01 .box_05 .btn_01 a:hover { text-decoration: none; color: #fff;}
.sec_01 .box_05 .btn_01 a:hover::after { transform: scale(1, 1);}
.sec_01 .box_06{ display: flex; justify-content: space-between; padding: 40px 0 100px;}
.sec_01 .box_06 .txt_04{ font-size: 16px; line-height: 1.8;}
.sec_01 .box_06 .btn_02 a{ display: inline-block; padding: 2px 0 2px 25px; font-size: 16px; line-height: 1.1; color: #c23e6c; position: relative; background-image: url("../img/ico_caution_01.svg"); background-repeat: no-repeat; background-position: left top 2px; background-size: 18px; text-decoration: underline;}
.sec_01 .box_06 .btn_02 a:hover{ text-decoration: none;}
.sec_01 .box_06 .btn_02.child_menu{padding: 15px 30px; border:#dfd6d1 1px solid; background: #fff;}
.sec_01 .box_06 .btn_02.child_menu:hover{opacity: 0.8;}

@media screen and (max-width: 600px) {
.sec_01 .box_01 .tit_01{ width: 110px; height: 160px;}
.sec_01 .box_01 .tit_01 .ja{ font-size: 24px;}
.sec_01 .box_01 .tit_01 .en{ font-size: 10px; padding: 10px 0 0;}
.sec_01 .box_01 .img{ height: 280px;}
.sec_01 .box_02{ text-align: left; padding: 20px 0 30px;}
.sec_01 .box_02 .txt_01{ font-size: 15px; line-height: 1.7;}
.sec_01 .box_03{ flex-wrap: wrap;}
.sec_01 .box_03 .tit_02{ position: static; color:rgba(96,50,25,0.7); width: 100%; display: flex; flex-direction: column; text-align: center; padding: 0 0 10px;}
.sec_01 .box_03 .tit_02 .sub{ font-size: 16px; padding: 0; opacity: 1;}
.sec_01 .box_03 .tit_02 .main{ font-size: 26px;}
.sec_01 .box_03 .tit_02 .sub.v_rl,
.sec_01 .box_03 .tit_02 .main.v_rl{ writing-mode: horizontal-tb;}
.sec_01 .box_04{ flex-direction: column; padding: 15px 0 40px;}
.sec_01 .box_04 .tit_03{ width: 100%; border-right: none; border-bottom: solid 1px #d6c9bf; display: flex; justify-content: center; align-items: center; font-size: 20px; color:rgba(96,50,25,0.7);}
.sec_01 .box_04 .txt_02{ width: 100%; font-size: 15px; line-height: 1.7; padding: 15px 0 0;}
.sec_01 .box_05{ padding: 5%; }
.sec_01 .box_05 .tit_04{ font-size: 20px; padding: 0 0 10px; line-height: 1.4;}
.sec_01 .box_05 .tit_04 em{ font-size: 28px;}
.sec_01 .box_05 .sec_in{ flex-direction: column; margin: 0 0 30px;}
.sec_01 .box_05 .sec_in:last-of-type{ margin: 0;}
.sec_01 .box_05 .box_img{ width: 100%;}
.sec_01 .box_05 .box_txt{ width: 100%; flex-direction: column;}
.sec_01 .box_05 .tit_05{ font-size: 20px; line-height: 1.3; padding: 10px 0 5px; text-indent: -0.5em;}
.sec_01 .box_05 .txt_03{ font-size: 15px; line-height: 1.7; padding: 0 0 10px 0;}
.sec_01 .box_05 .tit_05.v_rl,
.sec_01 .box_05 .txt_03.v_rl{ writing-mode: horizontal-tb;}
.sec_01 .box_05 .btn_01{ width: 100%;}
.sec_01 .box_05 .btn_01 a { height: 50px; font-size: 16px; line-height: 50px; }
.sec_01 .box_06{ flex-direction: column; padding: 20px 0 40px;}
.sec_01 .box_06 .box_in_01,
.sec_01 .box_06 .box_in_02{ padding: 20px 0 0;}
.sec_01 .box_06 .box_in_02{ text-align: center;}
.sec_01 .box_06 .txt_04{ font-size: 15px; line-height: 1.7;}
}

/* ---------------------------------------------------
Popup Children's Menu
------------------------------------------------------ */
#children { position: relative; margin: 0 auto; padding: 100px 0 140px; width: 100%; max-width: 1400px; background: #fff; }
#children .inner_md{ display: flex; flex-wrap: wrap; justify-content: space-between;}
#children .tit_01{ width: 100%; text-align: center; display: flex; flex-direction: column;}
#children .tit_01 .ja{ font-size: 35px; color: #603219;}
#children .tit_01 .en{ font-size: 13px; color: #e78c67; background: #E78C67; background: linear-gradient(to right, #E78C67 0%, #C88BCA 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; padding: 0 0 30px;}
#children .box_in{ width: 580px; max-width: 48%;}
#children .img{ width: 100%;}
#children .img img{ width: 100%; height: auto;}
#children .tit_02{ font-size: 24px; padding: 30px 0 0; text-align: center;}
#children .txt_01{ font-size: 16px; line-height: 1.9; text-align: center;}
#children .close_btn{ text-indent: 100%; white-space: nowrap; overflow: hidden; background: url("../../cuisine/img/close_btn_01.svg") no-repeat 0 0; background-size: 30px; top: 40px; right: 40px; width: 30px; height: 30px;}

@media screen and (max-width: 600px) {
#children { margin: 2% auto; padding: 50px 0 200px; }
#children .inner_md{ flex-direction: column;}
#children .tit_01 .ja{ font-size: 24px;}
#children .tit_01 .en{ font-size: 10px; padding: 0;}
#children .box_in{ width: 100%; max-width: 100%; margin: 30px 0 0;}
#children .tit_02{ font-size: 20px; padding: 10px 0 0;}
#children .txt_01{ font-size: 15px; line-height: 1.7;}
#children .close_btn{ top: 20px; right: 20px; width: 30px; height: 30px;}
}

/* ---------------------------------------------------
Section 02
------------------------------------------------------ */
.sec_02{ background-color: #f3efe9; overflow: hidden;}
.sec_02 .box_01{ width: 100%; position: relative;}
.sec_02 .box_01 .tit_01{ background: rgba(255,255,255,0.9); width: 180px; height: 270px; position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto auto; display: flex; flex-direction: column; justify-content: center; align-items: center;}
.sec_02 .box_01 .tit_01 .ja{ font-size: 40px; color: #603219;}
.sec_02 .box_01 .tit_01 .en{ font-size: 12px; color: #e78c67; background: #E78C67; background: linear-gradient(to right, #E78C67 0%, #C88BCA 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; padding: 15px 0 0;}
.sec_02 .box_01 .img{ width: 100%; height: 750px; object-fit: cover;}

.sec_02 .tit_02{ padding: 80px 0 0; display: flex; flex-direction: column; justify-content: center; align-items: center; line-height: 1;}
.sec_02 .tit_02 .ja{ font-size: 40px; color: #603219;}
.sec_02 .tit_02 .en{ font-size: 12px; color: #e78c67; background: #E78C67; background: linear-gradient(to right, #E78C67 0%, #C88BCA 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; padding: 15px 0 0;}

.sec_02 .txt_01{ text-align: center; padding: 50px 0; font-size: 16px; line-height: 2;}
.sec_02 .box_slide{ line-height: 0; width: 1240px; margin: 0 auto;}
.sec_02 .box_slide .slick-slide{ margin: 0 20px!important; position: relative;}
.sec_02 .box_slide .slick-slide img{ width: 100%;}
.sec_02 .box_slide .slick-slide .cap{ position: absolute; bottom: 0; left: 0; background: #fff; font-size: 16px; line-height: 1; padding: 10px 15px;}
.slick-dotted.slick-slider{ margin-bottom: 60px!important;}
.sec_02 .box_slide .slick-dots{ bottom: -50px!important;}
.sec_02 .txt_02{ padding: 0 0 100px 0; font-size: 16px; line-height: 2;}
.box_07{  background: #fff;padding: 70px 70px 0;margin-bottom:40px;}
.box_07 h3 {text-align: center;font-size: 28px; color: rgba(96, 50, 25, 0.7); letter-spacing: 0.1em; padding: 0 0 30px;}
.box_07 div{display:flex;flex-wrap: wrap;justify-content: space-between;}
.box_07 div dt{font-size: 20px; text-align: center;border-bottom: 1px solid #969187;padding-bottom: 10px;}
.box_07 div dd{margin-top:10px;}
.box_07 div dl{width: 33%; padding: 20px 30px 40px; box-sizing: border-box;}

.sec_02 .pictxt{display:flex;flex-wrap: wrap;justify-content: space-between;width: 90%;max-width: 1200px;margin: 0 auto;    padding: 0 0 100px 0;}
.sec_02 .pictxt div{width:30%;}
.sec_02 .pictxt div dt{font-size: 20px; text-align: center;border-bottom: 1px solid #969187;padding-bottom: 10px;}
.sec_02 .pictxt div dd{margin-top:10px;}
.sec_02 .pictxt div dl{padding: 20px 0 0;box-sizing: border-box;}

.sec_02 .box_02 > div { background: #fff; padding: 70px 80px 80px;margin-bottom: 100px; }
.sec_02 .box_02 h3 { text-align: center; font-size: 28px; color: #90705e; margin-bottom: 50px; }
.sec_02 .box_02 ul { display: flex; justify-content: center; flex-wrap: wrap; gap: 50px 20px; }
.sec_02 .box_02 ul li { width: 330px; }
.sec_02 .box_02 ul li p[class^=season] { width: 60px; height: 60px; margin: 0 auto -30px; border-radius: 50%; font-size: 30px; display: flex; align-items: center; justify-content: center; line-height: 1; border: 3px solid #ffff; color: #fff; position: relative; z-index: 1; box-sizing: border-box; }
.sec_02 .box_02 ul li p.season_spr { background: #f794a9;}
.sec_02 .box_02 ul li p.season_win { background: #CE6023;}
.sec_02 .box_02 ul li p.season_sum { background: #ffaf3d;}
.sec_02 .box_02 ul li p.season_aut { background: #844023;}
.sec_02 .box_02 ul li .tit { text-align: center; font-size: 20px; margin-top: 10px; }
.sec_02 .box_02 ul li .note{ text-align: center; font-size: 14px;}
.sec_02 .box_02 ul li .photo img{ width: 100%; height: 100%; object-fit: cover; }

@media screen and (max-width: 600px) {
.sec_02 .box_01 .tit_01{ width: 110px; height: 160px;}
.sec_02 .box_01 .tit_01 .ja{ font-size: 24px;}
.sec_02 .box_01 .tit_01 .en{ font-size: 10px; padding: 10px 0 0;}
.sec_02 .box_01 .img{ height: 280px;}
.sec_02 .txt_01{ text-align: left; padding: 30px 0; font-size: 15px; line-height: 1.7;}
.sec_02 .box_slide{ line-height: 0; width: 90%; margin: 0 auto;}
.sec_02 .box_slide .slick-slide{ margin: 0!important; position: relative;}
.sec_02 .box_slide .slick-slide img{ width: 100%;}
.sec_02 .box_slide .slick-slide .cap{ position: absolute; bottom: 0; left: 0; background: #fff; font-size: 14px; line-height: 1; padding: 5px 10px;}
.slick-dotted.slick-slider{ margin-bottom: 40px!important;}
.sec_02 .box_slide .slick-dots{ bottom: -30px!important;}
.sec_02 .txt_02{ padding: 0 0 50px 0; font-size: 15px; line-height: 1.7;}
.box_07{padding: 5%;}
.box_07 h3{font-size: 20px;padding: 0 0 10px;line-height: 1.4;}
.box_07 div{display:initial;}
.box_07 div dl{width:initial;    padding: 20px 30px 10px;}


.sec_02 .pictxt{display:initial;}
.sec_02 .pictxt div{width: 90%; max-width: 1200px;margin: 0 auto;}
.sec_02 .pictxt div:last-child{margin-bottom:40px;}

.sec_02 .box_02 > div { padding: 30px 5% 50px; }
.sec_02 .box_02 h3 { font-size: 22px; margin-bottom: 15px; }
.sec_02 .box_02 ul { flex-direction: column; gap: 30px; }
.sec_02 .box_02 ul li { width: 100%; }
.sec_02 .box_02 ul li p[class^=season] { width: 50px; height: 50px; margin: 0 auto -25px; font-size: 26px;  }
.sec_02 .box_02 ul li .tit { font-size: 16px; margin-top: 5px; }
}

/* ---------------------------------------------------
Section 03
------------------------------------------------------ */
.sec_03{ padding: 120px 0 100px;}
/*.sec_03 .tit_01{ width: 100%; text-align: center; display: flex; flex-direction: column;}
.sec_03 .tit_01 .ja{ font-size: 35px; color: #603219;}
.sec_03 .tit_01 .en{ font-size: 13px; color: #e78c67; background: #E78C67; background: linear-gradient(to right, #E78C67 0%, #C88BCA 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; padding: 0 0 60px;}*/
.sec_03 .tit_01{ padding: 0 0 30px;}
.sec_03 .box_msg{ background: #f3efe9; display: flex; justify-content: space-between; align-items: center;}
.sec_03 .box_img{ width: 31.6%;}
.sec_03 .box_img img{ width: 100%; height: auto;}
.sec_03 .box_txt{ width: 68.4%; padding: 0 80px; box-sizing: border-box;}
.sec_03 .name{ font-size: 28px; line-height: 1; display: flex; align-items: center;}
.sec_03 .name .kana{ font-size: 13px; padding: 0 0 0 2em;}
.sec_03 .txt_01{ font-size: 24px; line-height: 1; color: rgba(96,50,25,0.7); padding: 40px 0 20px;}
.sec_03 .txt_02{ font-size: 16px; line-height: 1.9;}

@media screen and (max-width: 600px) {
.sec_03{ padding: 50px 0;}
/*.sec_03 .tit_01{ width: 100%; text-align: center; display: flex; flex-direction: column;}
.sec_03 .tit_01 .ja{ font-size: 24px;}
.sec_03 .tit_01 .en{ font-size: 10px; padding: 0 0 20px;}*/
.sec_03 .tit_01{ padding: 0 0 10px;}
.sec_03 .box_msg{ flex-direction: column; padding: 10vw 0 0;}
.sec_03 .box_img{ width: 70%; margin: 0 auto;}
.sec_03 .box_txt{ width: 100%; padding: 5%;}
.sec_03 .name{ font-size: 20px; line-height: 1; align-items: center; padding: 15px 0 0 0; flex-direction: column;}
.sec_03 .name .kana{ font-size: 12px; padding: 1em 0 0 7em;}
.sec_03 .txt_01{ font-size: 20px; line-height: 1.5; padding: 15px 0 10px;}
.sec_03 .txt_02{ font-size: 15px; line-height: 1.7;}
}

@media screen and (max-width: 330px) {
.sec_03 .name{ font-size: 18px;}
.sec_03 .txt_01{ font-size: 18px;}
}

/* ---------------------------------------------------
Section 04
------------------------------------------------------ */
.sec_04{ padding: 90px 0; border-top: solid 1px #dfd6d1; border-bottom: solid 1px #dfd6d1;}
.sec_04 .tit_01{ font-size: 35px; color: #9a847b; text-align: center;}
.sec_04 .tit_02{ font-size: 22px; padding: 50px 0 20px;}
.sec_04 .txt_01{ font-size: 16px; line-height: 2;}
.sec_04 .list_01{ list-style-type: none; padding: 0 0 30px; font-size: 16px; line-height: 2;}
.sec_04 .list_01 li:before{ content: "・ "}
.sec_04 .list_01 li{ padding: 0 0 0 1em; text-indent: -1em;}

@media screen and (max-width: 600px) {
.sec_04{ padding: 40px 0; border-top: solid 1px #dfd6d1; border-bottom: solid 1px #dfd6d1;}
.sec_04 .tit_01{ font-size: 24px; color: #9a847b; text-align: center;}
.sec_04 .tit_02{ font-size: 18px; padding: 20px 0 10px;}
.sec_04 .txt_01{ font-size: 15px; line-height: 1.7;}
.sec_04 .list_01{ list-style-type: none; padding: 0 0 20px; font-size: 15px; line-height: 1.7;}
.sec_04 .list_01 li:before{ content: "・ "}
.sec_04 .list_01 li{ padding: 0 0 0 1em; text-indent: -1em;}
}