@charset "utf-8";

/* ===================================================
Meal Index Unique Style （モバイルファースト）
====================================================== */
section:nth-of-type(odd) {
	background: #f2efea;
}

/* ---------------------------------------------------
lead
------------------------------------------------------ */
.cmn_sec_lead { padding-bottom: 0; }
.cmn_sec_lead .cmn_tit_01 span { padding-bottom: 30px; }
.cmn_sec_lead .img01 { margin: 0 0 20px; }
.cmn_sec_lead .img01 img { width: 100%; }
.cmn_sec_lead .box_txt_01 { margin-bottom: 30px; }

/* ticker */
@keyframes loop {
0% { transform: translateX(100%); }
100% { transform: translateX(-100%); }
}
@keyframes loop2 {
0% { transform: translateX(0); }
100% { transform: translateX(-200%); }
}
.cmn_sec_lead .ticker,
.cmn_sec_lead .ticker ul { display: flex; }
.cmn_sec_lead .ticker { position: relative; z-index: 0; width: 100%; overflow: hidden; }
.cmn_sec_lead .ticker ul { backface-visibility: hidden; will-change: transform; }
.cmn_sec_lead .ticker ul:first-child { animation: loop 50s -25s linear infinite; }
.cmn_sec_lead .ticker ul:last-child { animation: loop2 50s linear infinite; }
.cmn_sec_lead .ticker li { position: relative; z-index: 0; width: 50vw; padding: 0 5px 0 0; }
.cmn_sec_lead .ticker li img { width: 100%; }

@media screen and (min-width: 601px) {
.cmn_sec_lead { padding-bottom: 30px; }
.cmn_sec_lead .cmn_tit_01 { padding-bottom: 80px; }
.cmn_sec_lead .img01 { margin-bottom: 50px; }
.cmn_sec_lead .img01 img { height: 800px; }
.cmn_sec_lead .box_txt_01 { margin-bottom: 50px; font-size: 16px; }

/* ticker */
.cmn_sec_lead .ticker li { width: 345px; min-width: 22vw; }
}

/* ---------------------------------------------------
box_flex
------------------------------------------------------ */
.box_flex { display: flex; flex-direction: column; padding: 50px 0; }
.box_flex .box_txt { display: contents; }
.box_flex .box_txt .cmn_tit_01 { order: -1; padding: 0 5% 20px; }
.box_flex .box_txt .cmn_tit_01 .sub{ font-size: 15px; color: #a3974b;}
.box_flex .box_txt .txt { margin: 25px 5% 0; line-height: 2; font-size: 15px; }
.box_flex .box_img { order: -1; }
.box_flex .box_img img { width: 100%; }

#sec07 .box_flex .box_img,
#sec07 .box_flex .img_02 { position: relative; width: 90%; margin: 0 auto;}
#sec07 .box_flex .img_02{ margin: 20px auto 0;}
#sec07 .box_flex .img_02 img { width: 100%;}
#sec07 .cap{ position: absolute; top: 0; right: 0; background-color: rgba(0, 0, 0, 0.5); color: #fff; font-size: 15px; line-height: 1; padding: 5px 10px;}

@media screen and (min-width: 601px) {
.box_flex { display: grid; padding: 100px 0; }
.box_flex .box_txt { display: flex; flex-direction: column; align-items: center; }
.box_flex .box_txt .cmn_tit_01 { padding: 0 0 45px; font-feature-settings: "palt" 0; text-align: left; writing-mode: vertical-rl; }
.box_flex .box_txt .cmn_tit_01 .sub{ font-size: 18px;}
.box_flex .box_txt .txt { margin: 0; font-size: 16px; }
.box_flex .box_txt .txt p { min-width: 0; overflow-wrap: anywhere; line-break: strict; }
.box_flex .box_img { order: unset; }
.box_flex .box_img .ofi { height: 487px; }
.box_flex.txt_l { grid-template-columns: calc((100% - 1200px) / 2) 400px minmax(60px, 1fr) 56.25%; }
.box_flex.txt_l .box_txt { grid-column: 2; }
.box_flex.txt_l .box_img { grid-column: 4; }
.box_flex.txt_r { grid-template-columns: 56.25% minmax(60px, 1fr) 400px calc((100% - 1200px) / 2); }
.box_flex.txt_r .box_txt { grid-column: 3; }
.box_flex.txt_r .box_img { grid-row: 1; grid-column: 1; }

#sec07 .box_flex.txt_l{ width: 1200px; margin: 0 auto;}
#sec07 .box_flex.txt_l .box_txt { grid-area: 1 / 2 / 4 / 3;}
#sec07 .box_flex .box_img,
#sec07 .box_flex .img_02 { grid-column: 4; position: relative; width: 100%; margin: 0;}
#sec07 .box_flex .img_02 { margin: 10px 0 0;}
#sec07 .cap{ position: absolute; top: 0; right: 0; background-color: rgba(0, 0, 0, 0.5); color: #fff; font-size: 18px; line-height: 1; padding: 15px;}

}


