#overlay{ position: fixed; top: 0; z-index: 999; width: 100%; height:100%; display: none; background: rgba(0,0,0,0.6);} .cv-spinner { height: 100%; display: flex; justify-content: center; align-items: center;} .spinner { width: 40px; height: 40px; border: 4px #ddd solid; border-top: 4px #2e93e6 solid; border-radius: 50%; animation: sp-anime 0.8s infinite linear;} @keyframes sp-anime { 100% { transform: rotate(360deg);}} .is-hide{ display:none;} .post-wrapper-single .entry-header-wrapper{ width:99%; margin: 0 auto 1rem;} .entry-title{ font-size: 2rem; background: linear-gradient(transparent 70%, #ffcf8c 70%);} .entry-content h3{ width: auto; padding: 0.25rem; background: #D8F6CE; font-weight: 600;} .entry-content h4{ text-decoration: solid underline #cccc99 3px; font-weight: 600;} .entry-summery-block{ border-radius: 0.5em; padding: 0.75em; margin-bottom: 0.75rem; box-shadow: 0 5px 15px 0 rgba(200, 200, 200, 0.5);} .entry-summery-block .entry-title{ clear: none; font-size: 28px; font-size: 1.75rem; font-weight: 700; line-height: 1.4; margin: 0.75rem 0rem; padding: 0.25rem 0.75rem; text-transform: uppercase; word-wrap: break-word; background: #fefcdd; border-radius: 0.5rem;} .entry-summery-block .entry-summary ul{ padding: 0.25rem; line-height: 1.25rem; list-style: none;} span.cooking_point:before{ font-family: "Font Awesome 5 Free"; content: '\f0a4'; font-weight: 400; margin: 0 0.25rem; color: #666;} ul.recipe_list{ list-style: none;} ul.recipe_list li:before{ font-family: "Font Awesome 5 Free"; content: '\f2e7'; font-weight: 900; margin: 0 0.25rem; color: #666;} .block-column-entry:first-child{ flex-basis:30%;} .block-column-entry:not(first-child){ flex-basis:70%; margin-left: 2em;} .recipe-ingredient-quantity{ font-size: 0.875em;} table.recipe-ingredient-list{ } table.recipe-ingredient-list tr{ } table.recipe-ingredient-list tr td{ font-size: 0.875em; padding: 0.125rem;} table.recipe-ingredient-list tr td.amount{ text-align: right;} table.recipe-ingredient-list tr td.ingredient-group{ background: #eef; vertical-align: middle; text-align: center;} .entry-item-block{ margin: 0.75rem 0; padding: 0.525rem; border-radius: 0.125rem; box-shadow: 0 5px 15px 0 rgba(200, 200, 200, 0.5);} .no-shadow{ box-shadow: none;} .entry-item-block-header{ position: relative; margin: 0.125rem 0; padding-top: 1.25rem; font-size: 1.75rem; font-weight: 600; border-bottom: 1px solid rgba(5,62,98,1);} .entry-item-block-header span { position: relative; z-index: 2;} .entry-item-block-header:before { content: attr(data-en); position: absolute; top: 0; left: 0; color: rgba(5,62,98,0.1); font-size: 2.25rem; z-index: 1;} .entry-item-block-body{ padding: 0.125rem; line-height: 1.5rem;} .entry-catch-phrase:before{ font-family: "Font Awesome 5 Free"; content: '\f005'; font-weight: 700; margin: 0 0.25rem; color: #fcf;} .recipe-supervisor{ margin: 15px 0px;} .required_minutes, .calory, .salt, .nutrition_unit{ font-size: 0.9rem;} .required_minutes:before{ content: "所要時間: "; color: #996699;} .required_minutes:after{ content: "分";} .calory:before{ content: "カロリー: "; color: #996699;} .calory:after{ content: "kcal";} .salt:before{ content: "塩分: "; color: #996699;} .salt:after{ content: "g";} .nutrition_unit:before{ content: "栄養価などは";} .nutrition_unit:after{ content: "の値";} .block-columns-cooking-procedure{ display: flex; margin-bottom: 1.125em;} .block-column-cooking-procedure{ padding: 0.25rem; border-radius: 0.125rem; margin: 0 0.5rem 0.125rem; box-shadow: 0 5px 15px 0 rgba(200, 200, 200, 0.5); flex-basis: 50%;} .fourframes-cooking-procedure{ width: 50%; float: left;} .fourframes-cooking-procedure-header{ color: #6a9; font-weight: 600; line-height: 1rem; border-bottom: solid 0.125rem #6a9; margin: 0.125rem;} .frame1 .fourframes-cooking-procedure-header:before{content: "1 "; font-size: 1.625rem;} .frame2 .fourframes-cooking-procedure-header:before{content: "2 "; font-size: 1.625rem;} .frame3 .fourframes-cooking-procedure-header:before{content: "3 "; font-size: 1.625rem;} .frame4 .fourframes-cooking-procedure-header:before{content: "4 "; font-size: 1.625rem;} .fourframes-cooking-procedure-body{ font-size: 0.875rem; line-height: 1rem;} .fourframes-cooking-procedure-image{ } .banner-block{ margin: 0.5rem 0;} .banner-block img{ width: 166px; height: 45px;} @media (max-width: 780px){ .post-wrapper-single .entry-header-wrapper{ margin: 0 auto 1rem;} .block-column-entry:first-child{ margin-bottom: 2em;} .block-columns-cooking-procedure{ flex-wrap: wrap !important; margin-bottom: 0;} .block-column-cooking-procedure{ flex-basis: 100% !important; flex-grow: 1;} .block-column-cooking-procedure:not(:only-child){ flex-basis: 100% !important; flex-grow: 1;} .fourframes-cooking-procedure{ width: 100%;}} @media (min-width: 781px) and (max-width: 1379px) { .post-wrapper-single .entry-header-wrapper{ width:99%; margin: 0 auto 1rem;} .block-column-entry:first-child{ flex-basis:30%;} .block-column-entry:not(first-child){ flex-basis:70%; margin-left: 2em;} .block-column-entry[style*=flex-basis] { flex-grow: 0;} .fourframes-cooking-procedure{ width: 100%;}} @media (min-width: 1380px) { .fourframes-cooking-procedure{ width: 50%;}}