@charset "UTF-8";
/*
Theme Name: 有限会社中島商店
Theme URI: http://www.nakashima-milk.com/
Author: SPEC
Author URI: http://www.nakashima-milk.com/
Description: 有限会社中島商店 WebサイトのWordPressテーマです。
Version: 1.0
*/
/* ==================================================
[Style]
	 1. Reset
	 2. Animation
	 3. General
	 4. Container
	 5. Header
	 6. Breadcrumb
	 7. Content
	 8. Footer
	 9. Home
	10. Lineup
	11. Dietician
	12. Wholesale
	13. Retail
	14. About
	15. Topics
	16. Contact
	98. Error
	99. WordPress
================================================== */
/* --------------------------------------------------
	 1. Reset
-------------------------------------------------- */
/*
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com 
Twitter: @rich_clark
*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, main, menu, nav, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

body {
  line-height: 1;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, main, menu, nav, section {
  display: block;
}

nav ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: "";
  content: none;
}

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

/* change colours to suit your needs */
ins {
  background-color: #ff9;
  color: #000;
  text-decoration: none;
}

/* change colours to suit your needs */
mark {
  background-color: #ff9;
  color: #000;
  font-style: italic;
  font-weight: bold;
}

del {
  text-decoration: line-through;
}

abbr[title], dfn[title] {
  border-bottom: 1px dotted;
  cursor: help;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* change border colour to suit your needs */
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #cccccc;
  margin: 1em 0;
  padding: 0;
}

input, select {
  vertical-align: middle;
}

/* --------------------------------------------------
	 2. Animation
-------------------------------------------------- */
/* --------------------------------------------------
	 3. General
-------------------------------------------------- */
*,
*:before,
*:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

body {
  color: #333;
  font-family: "Century Gothic", CenturyGothic, Geneva, AppleGothic, "游ゴシック", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  line-height: 1.8;
  word-break: normal;
  overflow-wrap: normal;
  word-wrap: normal;
  background-color: #fff;
  -webkit-font-smoothing: antialiased;
  -webkit-text-size-adjust: 100%;
}

a {
  outline: none;
  word-break: break-all;
  overflow-wrap: break-word;
  word-wrap: break-word;
}

a:link, a:visited {
  color: #db0505;
  text-decoration: none;
}

a:hover, a:active {
  color: #db0505;
  text-decoration: underline;
}

ul, ol {
  list-style: none;
}

em, dl, i, address {
  font-style: normal;
}

sup, sub {
  font-size: 0.71429rem;
  line-height: 1.35;
}

sup {
  vertical-align: text-top;
}

sub {
  vertical-align: text-bottom;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
  font-size: 1rem;
  font-family: inherit;
}

table th, table td {
  text-align: left;
  vertical-align: middle;
  padding: 10px;
}

table th {
  font-weight: normal;
}

table td {
  word-break: break-all;
  overflow-wrap: break-word;
  word-wrap: break-word;
}

select,
textarea,
input[type="text"],
input[type="email"],
input[type="password"] {
  margin: 5px;
  padding: 6px;
  color: #333;
  font-size: 1rem;
  font-family: "Century Gothic", CenturyGothic, Geneva, AppleGothic, "游ゴシック", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  border: 1px solid #999999;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
}

textarea,
input[type="text"],
input[type="email"],
input[type="password"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

input[type="text"].align_left {
  text-align: left;
}

input[type="text"].align_center {
  text-align: center;
}

input[type="text"].align_right {
  text-align: right;
}

input[type="radio"], input[type="checkbox"] {
  margin: 3px 0 5px 5px;
  outline: none;
  cursor: pointer;
}

input[type="radio"] + label,
input[type="checkbox"] + label {
  padding: 0 8px 0 2px;
  cursor: pointer;
}

input:-moz-placeholder, textarea:-moz-placeholder {
  color: gray;
}

input::-moz-placeholder, textarea::-moz-placeholder {
  color: gray;
}

input:-ms-input-placeholder, textarea:-ms-input-placeholder {
  color: gray;
}

input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
  color: gray;
}

a:link, a:visited {
  text-decoration: none;
}

a:hover, a:active {
  text-decoration: underline;
}

.gothic {
  font-family: "Century Gothic", CenturyGothic, Geneva, AppleGothic, "游ゴシック", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

.mincho {
  font-family: "Century Gothic", CenturyGothic, Geneva, AppleGothic, "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
}

.font_big {
  font-size: 1.28571rem !important;
}

.font_large {
  font-size: 1.14286rem !important;
}

.font_normal {
  font-size: 1rem !important;
}

.font_small {
  font-size: 0.85714rem !important;
}

.font_little {
  font-size: 0.71429rem !important;
}

.mt_0 {
  margin-top: 0rem !important;
}

.mr_0 {
  margin-right: 0rem !important;
}

.mb_0 {
  margin-bottom: 0rem !important;
}

.ml_0 {
  margin-left: 0rem !important;
}

.m_0 {
  margin: 0rem !important;
}

.mx_0 {
  margin-left: 0rem !important;
  margin-right: 0rem !important;
}

.my_0 {
  margin-top: 0rem !important;
  margin-bottom: 0rem !important;
}

.pt_0 {
  padding-top: 0rem !important;
}

.pr_0 {
  padding-right: 0rem !important;
}

.pb_0 {
  padding-bottom: 0rem !important;
}

.pl_0 {
  padding-left: 0rem !important;
}

.p_0 {
  padding: 0rem !important;
}

.px_0 {
  padding-left: 0rem !important;
  padding-right: 0rem !important;
}

.py_0 {
  padding-top: 0rem !important;
  padding-bottom: 0rem !important;
}

.mt_1 {
  margin-top: 1rem !important;
}

.mr_1 {
  margin-right: 1rem !important;
}

.mb_1 {
  margin-bottom: 1rem !important;
}

.ml_1 {
  margin-left: 1rem !important;
}

.m_1 {
  margin: 1rem !important;
}

.mx_1 {
  margin-left: 1rem !important;
  margin-right: 1rem !important;
}

.my_1 {
  margin-top: 1rem !important;
  margin-bottom: 1rem !important;
}

.pt_1 {
  padding-top: 1rem !important;
}

.pr_1 {
  padding-right: 1rem !important;
}

.pb_1 {
  padding-bottom: 1rem !important;
}

.pl_1 {
  padding-left: 1rem !important;
}

.p_1 {
  padding: 1rem !important;
}

.px_1 {
  padding-left: 1rem !important;
  padding-right: 1rem !important;
}

.py_1 {
  padding-top: 1rem !important;
  padding-bottom: 1rem !important;
}

.mt_2 {
  margin-top: 2rem !important;
}

.mr_2 {
  margin-right: 2rem !important;
}

.mb_2 {
  margin-bottom: 2rem !important;
}

.ml_2 {
  margin-left: 2rem !important;
}

.m_2 {
  margin: 2rem !important;
}

.mx_2 {
  margin-left: 2rem !important;
  margin-right: 2rem !important;
}

.my_2 {
  margin-top: 2rem !important;
  margin-bottom: 2rem !important;
}

.pt_2 {
  padding-top: 2rem !important;
}

.pr_2 {
  padding-right: 2rem !important;
}

.pb_2 {
  padding-bottom: 2rem !important;
}

.pl_2 {
  padding-left: 2rem !important;
}

.p_2 {
  padding: 2rem !important;
}

.px_2 {
  padding-left: 2rem !important;
  padding-right: 2rem !important;
}

.py_2 {
  padding-top: 2rem !important;
  padding-bottom: 2rem !important;
}

.mt_3 {
  margin-top: 3rem !important;
}

.mr_3 {
  margin-right: 3rem !important;
}

.mb_3 {
  margin-bottom: 3rem !important;
}

.ml_3 {
  margin-left: 3rem !important;
}

.m_3 {
  margin: 3rem !important;
}

.mx_3 {
  margin-left: 3rem !important;
  margin-right: 3rem !important;
}

.my_3 {
  margin-top: 3rem !important;
  margin-bottom: 3rem !important;
}

.pt_3 {
  padding-top: 3rem !important;
}

.pr_3 {
  padding-right: 3rem !important;
}

.pb_3 {
  padding-bottom: 3rem !important;
}

.pl_3 {
  padding-left: 3rem !important;
}

.p_3 {
  padding: 3rem !important;
}

.px_3 {
  padding-left: 3rem !important;
  padding-right: 3rem !important;
}

.py_3 {
  padding-top: 3rem !important;
  padding-bottom: 3rem !important;
}

.mt_4 {
  margin-top: 4rem !important;
}

.mr_4 {
  margin-right: 4rem !important;
}

.mb_4 {
  margin-bottom: 4rem !important;
}

.ml_4 {
  margin-left: 4rem !important;
}

.m_4 {
  margin: 4rem !important;
}

.mx_4 {
  margin-left: 4rem !important;
  margin-right: 4rem !important;
}

.my_4 {
  margin-top: 4rem !important;
  margin-bottom: 4rem !important;
}

.pt_4 {
  padding-top: 4rem !important;
}

.pr_4 {
  padding-right: 4rem !important;
}

.pb_4 {
  padding-bottom: 4rem !important;
}

.pl_4 {
  padding-left: 4rem !important;
}

.p_4 {
  padding: 4rem !important;
}

.px_4 {
  padding-left: 4rem !important;
  padding-right: 4rem !important;
}

.py_4 {
  padding-top: 4rem !important;
  padding-bottom: 4rem !important;
}

.mt_5 {
  margin-top: 5rem !important;
}

.mr_5 {
  margin-right: 5rem !important;
}

.mb_5 {
  margin-bottom: 5rem !important;
}

.ml_5 {
  margin-left: 5rem !important;
}

.m_5 {
  margin: 5rem !important;
}

.mx_5 {
  margin-left: 5rem !important;
  margin-right: 5rem !important;
}

.my_5 {
  margin-top: 5rem !important;
  margin-bottom: 5rem !important;
}

.pt_5 {
  padding-top: 5rem !important;
}

.pr_5 {
  padding-right: 5rem !important;
}

.pb_5 {
  padding-bottom: 5rem !important;
}

.pl_5 {
  padding-left: 5rem !important;
}

.p_5 {
  padding: 5rem !important;
}

.px_5 {
  padding-left: 5rem !important;
  padding-right: 5rem !important;
}

.py_5 {
  padding-top: 5rem !important;
  padding-bottom: 5rem !important;
}

body#tinymce section,
body#tinymce h3,
body#tinymce h4,
body#tinymce h5,
body#tinymce h6,
article section,
article h3,
article h4,
article h5,
article h6 {
  clear: both;
}

body#tinymce h2,
article h2 {
  text-align: center;
}

body#tinymce h2.title em,
article h2.title em {
  display: block;
  overflow: hidden;
  color: transparent;
  text-decoration: none;
  text-indent: 110%;
  white-space: nowrap;
  font-size: 0;
  display: block;
  background: transparent no-repeat center center;
  background-size: contain;
}

body#tinymce h2.image,
article h2.image {
  display: block;
  overflow: hidden;
  color: transparent;
  text-decoration: none;
  text-indent: 110%;
  white-space: nowrap;
  font-size: 0;
  display: block;
  margin: 0 auto;
  background: transparent no-repeat center center;
  background-size: contain;
}

body#tinymce h3,
body#tinymce h4,
body#tinymce h5,
body#tinymce h6,
article h3,
article h4,
article h5,
article h6 {
  color: #db0505;
}

body#tinymce h3,
article h3 {
  margin-bottom: 2em;
  padding: 2em 0 .25em;
  font-size: 1.85714rem;
  text-align: center;
  border-bottom: 1px solid #666666;
}

body#tinymce h4,
article h4 {
  margin-bottom: 2em;
  padding-top: 1em;
  font-size: 1.64286rem;
  text-align: center;
  border-bottom: 1px dashed #666666;
}

body#tinymce h5,
article h5 {
  padding-top: 1em;
  font-size: 1.42857rem;
}

body#tinymce h6,
article h6 {
  padding-top: 1em;
  font-size: 1.28571rem;
}

body#tinymce h3:first-child,
body#tinymce h4:first-child,
body#tinymce h5:first-child,
body#tinymce h6:first-child,
article h3:first-child,
article h4:first-child,
article h5:first-child,
article h6:first-child {
  padding-top: 0;
}

body#tinymce h2 + h3,
body#tinymce h3 + h4,
body#tinymce h4 + h5,
body#tinymce h5 + h6,
article h2 + h3,
article h3 + h4,
article h4 + h5,
article h5 + h6 {
  padding-top: 0 !important;
}

body#tinymce p,
article p {
  margin-bottom: 1em;
}

body#tinymce .catch,
article .catch {
  margin: 0 auto 1em;
  font-weight: bold;
}

body#tinymce .note,
article .note {
  margin-bottom: 1em;
  font-size: 0.85714rem;
}

body#tinymce .text_left,
article .text_left {
  text-align: left;
}

body#tinymce .text_center,
article .text_center {
  text-align: center;
}

body#tinymce .text_right,
article .text_right {
  text-align: right;
}

body#tinymce a:link, body#tinymce a:visited,
article a:link,
article a:visited {
  text-decoration: underline;
}

body#tinymce a:hover, body#tinymce a:active,
article a:hover,
article a:active {
  text-decoration: none;
}

body#tinymce a[target="_blank"]:after, body#tinymce a[href^="http"]:after, body#tinymce a[href$=".pdf"]:after, body#tinymce a[href$=".doc"]:after, body#tinymce a[href$=".docx"]:after, body#tinymce a[href$=".xls"]:after, body#tinymce a[href$=".xlsx"]:after,
article a[target="_blank"]:after,
article a[href^="http"]:after,
article a[href$=".pdf"]:after,
article a[href$=".doc"]:after,
article a[href$=".docx"]:after,
article a[href$=".xls"]:after,
article a[href$=".xlsx"]:after {
  display: inline-block;
  vertical-align: middle;
  content: "";
  margin-top: -5px;
  height: 15px;
  background: transparent no-repeat center top;
  background-size: contain;
}

body#tinymce a[target="_blank"]:after, body#tinymce a[href^="http"]:after,
article a[target="_blank"]:after,
article a[href^="http"]:after {
  width: 25px;
}

body#tinymce a[target="_blank"]:after,
article a[target="_blank"]:after {
  background-image: url(img/icon/icon_window.png);
}

body#tinymce a[href^="http"]::after,
article a[href^="http"]::after {
  background-image: url(img/icon/icon_external.png);
}

body#tinymce a[href^="http://localhost/"]::after, body#tinymce a[href^="http://nakashima-milk.jp/"]::after, body#tinymce a[href^="https://nakashima-milk.jp/"]::after,
article a[href^="http://localhost/"]::after,
article a[href^="http://nakashima-milk.jp/"]::after,
article a[href^="https://nakashima-milk.jp/"]::after {
  display: none;
}

body#tinymce a[href$=".pdf"]:after, body#tinymce a[href$=".doc"]:after, body#tinymce a[href$=".docx"]:after, body#tinymce a[href$=".xls"]:after, body#tinymce a[href$=".xlsx"]:after,
article a[href$=".pdf"]:after,
article a[href$=".doc"]:after,
article a[href$=".docx"]:after,
article a[href$=".xls"]:after,
article a[href$=".xlsx"]:after {
  margin-top: 0;
  width: 60px;
}

body#tinymce a[href$=".pdf"]:after,
article a[href$=".pdf"]:after {
  background-image: url(img/icon/icon_pdf.png);
}

body#tinymce a[href$=".doc"]:after, body#tinymce a[href$=".docx"]:after,
article a[href$=".doc"]:after,
article a[href$=".docx"]:after {
  background-image: url(img/icon/icon_pdf.png);
}

body#tinymce a[href$=".xls"]:after, body#tinymce a[href$=".xlsx"]:after,
article a[href$=".xls"]:after,
article a[href$=".xlsx"]:after {
  background-image: url(img/icon/icon_pdf.png);
}

body#tinymce a.non_style:after,
article a.non_style:after {
  display: none !important;
}

body#tinymce label,
article label {
  cursor: pointer;
}

body#tinymce table,
article table {
  margin: 2em auto;
  width: 90%;
  background-color: transparent;
  border-right: 1px solid #d4d4d4;
  border-bottom: 1px solid #d4d4d4;
}

body#tinymce table th,
body#tinymce table td,
article table th,
article table td {
  border-left: 1px solid #d4d4d4;
  border-top: 1px solid #d4d4d4;
}

body#tinymce table th.left,
body#tinymce table td.left,
article table th.left,
article table td.left {
  text-align: left !important;
}

body#tinymce table th.center,
body#tinymce table td.center,
article table th.center,
article table td.center {
  text-align: center !important;
}

body#tinymce table th.right,
body#tinymce table td.right,
article table th.right,
article table td.right {
  text-align: right !important;
}

body#tinymce table th.top,
body#tinymce table td.top,
article table th.top,
article table td.top {
  vertical-align: top !important;
}

body#tinymce table th.middle,
body#tinymce table td.middle,
article table th.middle,
article table td.middle {
  vertical-align: middle !important;
}

body#tinymce table th.bottom,
body#tinymce table td.bottom,
article table th.bottom,
article table td.bottom {
  vertical-align: bottom !important;
}

body#tinymce table th,
article table th {
  text-align: center;
  white-space: nowrap;
  font-weight: bold;
  width: 8em;
  background-color: #ededed;
}

body#tinymce .flex > .row > [class^=col],
body#tinymce .block > .row > [class^=col],
article .flex > .row > [class^=col],
article .block > .row > [class^=col] {
  padding: 10px;
}

body#tinymce .flex > .row > [class^=col].left,
body#tinymce .block > .row > [class^=col].left,
article .flex > .row > [class^=col].left,
article .block > .row > [class^=col].left {
  text-align: left;
}

body#tinymce .flex > .row > [class^=col].center,
body#tinymce .block > .row > [class^=col].center,
article .flex > .row > [class^=col].center,
article .block > .row > [class^=col].center {
  text-align: center;
}

body#tinymce .flex > .row > [class^=col].right,
body#tinymce .block > .row > [class^=col].right,
article .flex > .row > [class^=col].right,
article .block > .row > [class^=col].right {
  text-align: right;
}

body#tinymce .flex > .row > [class^=col].no_padding,
body#tinymce .block > .row > [class^=col].no_padding,
article .flex > .row > [class^=col].no_padding,
article .block > .row > [class^=col].no_padding {
  padding: 0;
}

body#tinymce .flex > .row > .col1,
body#tinymce .block > .row > .col1,
article .flex > .row > .col1,
article .block > .row > .col1 {
  width: 8.33333%;
}

body#tinymce .flex > .row > .col2,
body#tinymce .block > .row > .col2,
article .flex > .row > .col2,
article .block > .row > .col2 {
  width: 16.66667%;
}

body#tinymce .flex > .row > .col3,
body#tinymce .block > .row > .col3,
article .flex > .row > .col3,
article .block > .row > .col3 {
  width: 25%;
}

body#tinymce .flex > .row > .col4,
body#tinymce .block > .row > .col4,
article .flex > .row > .col4,
article .block > .row > .col4 {
  width: 33.33333%;
}

body#tinymce .flex > .row > .col5,
body#tinymce .block > .row > .col5,
article .flex > .row > .col5,
article .block > .row > .col5 {
  width: 41.66667%;
}

body#tinymce .flex > .row > .col6,
body#tinymce .block > .row > .col6,
article .flex > .row > .col6,
article .block > .row > .col6 {
  width: 50%;
}

body#tinymce .flex > .row > .col7,
body#tinymce .block > .row > .col7,
article .flex > .row > .col7,
article .block > .row > .col7 {
  width: 58.33333%;
}

body#tinymce .flex > .row > .col8,
body#tinymce .block > .row > .col8,
article .flex > .row > .col8,
article .block > .row > .col8 {
  width: 66.66667%;
}

body#tinymce .flex > .row > .col9,
body#tinymce .block > .row > .col9,
article .flex > .row > .col9,
article .block > .row > .col9 {
  width: 75%;
}

body#tinymce .flex > .row > .col10,
body#tinymce .block > .row > .col10,
article .flex > .row > .col10,
article .block > .row > .col10 {
  width: 83.33333%;
}

body#tinymce .flex > .row > .col11,
body#tinymce .block > .row > .col11,
article .flex > .row > .col11,
article .block > .row > .col11 {
  width: 91.66667%;
}

body#tinymce .flex > .row > .col12,
body#tinymce .block > .row > .col12,
article .flex > .row > .col12,
article .block > .row > .col12 {
  width: 100%;
}

body#tinymce .flex > .row.gutter > [class^=col],
body#tinymce .block > .row.gutter > [class^=col],
article .flex > .row.gutter > [class^=col],
article .block > .row.gutter > [class^=col] {
  margin-bottom: 2%;
  padding: 0;
}

body#tinymce .flex > .row.gutter > .col1,
body#tinymce .block > .row.gutter > .col1,
article .flex > .row.gutter > .col1,
article .block > .row.gutter > .col1 {
  width: 6.5%;
}

body#tinymce .flex > .row.gutter > .col2,
body#tinymce .block > .row.gutter > .col2,
article .flex > .row.gutter > .col2,
article .block > .row.gutter > .col2 {
  width: 15%;
}

body#tinymce .flex > .row.gutter > .col3,
body#tinymce .block > .row.gutter > .col3,
article .flex > .row.gutter > .col3,
article .block > .row.gutter > .col3 {
  width: 23.5%;
}

body#tinymce .flex > .row.gutter > .col4,
body#tinymce .block > .row.gutter > .col4,
article .flex > .row.gutter > .col4,
article .block > .row.gutter > .col4 {
  width: 32%;
}

body#tinymce .flex > .row.gutter > .col5,
body#tinymce .block > .row.gutter > .col5,
article .flex > .row.gutter > .col5,
article .block > .row.gutter > .col5 {
  width: 40.5%;
}

body#tinymce .flex > .row.gutter > .col6,
body#tinymce .block > .row.gutter > .col6,
article .flex > .row.gutter > .col6,
article .block > .row.gutter > .col6 {
  width: 49%;
}

body#tinymce .flex > .row.gutter > .col7,
body#tinymce .block > .row.gutter > .col7,
article .flex > .row.gutter > .col7,
article .block > .row.gutter > .col7 {
  width: 57.5%;
}

body#tinymce .flex > .row.gutter > .col8,
body#tinymce .block > .row.gutter > .col8,
article .flex > .row.gutter > .col8,
article .block > .row.gutter > .col8 {
  width: 66%;
}

body#tinymce .flex > .row.gutter > .col9,
body#tinymce .block > .row.gutter > .col9,
article .flex > .row.gutter > .col9,
article .block > .row.gutter > .col9 {
  width: 74.5%;
}

body#tinymce .flex > .row.gutter > .col10,
body#tinymce .block > .row.gutter > .col10,
article .flex > .row.gutter > .col10,
article .block > .row.gutter > .col10 {
  width: 83%;
}

body#tinymce .flex > .row.gutter > .col11,
body#tinymce .block > .row.gutter > .col11,
article .flex > .row.gutter > .col11,
article .block > .row.gutter > .col11 {
  width: 91.5%;
}

body#tinymce .flex > .row.gutter > .col12,
body#tinymce .block > .row.gutter > .col12,
article .flex > .row.gutter > .col12,
article .block > .row.gutter > .col12 {
  width: 100%;
}

body#tinymce .flex > .row,
article .flex > .row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
}

body#tinymce .flex > .row.gutter,
article .flex > .row.gutter {
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

body#tinymce .flex > .row.reverse,
article .flex > .row.reverse {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
  -ms-flex-direction: row-reverse;
  flex-direction: row-reverse;
}

body#tinymce .block > .row:after,
article .block > .row:after {
  display: block;
  content: "";
  clear: both;
}

body#tinymce .block > .row > [class^=col],
article .block > .row > [class^=col] {
  float: left;
}

body#tinymce .block > .row.gutter > [class^=col],
article .block > .row.gutter > [class^=col] {
  margin-left: 2%;
}

body#tinymce .block > .row.gutter > [class^=col]:first-child,
article .block > .row.gutter > [class^=col]:first-child {
  margin-left: 0;
}

body#tinymce .block > .row.reverse > [class^=col],
article .block > .row.reverse > [class^=col] {
  float: right;
}

body#tinymce .block > .row.reverse.gutter > [class^=col],
article .block > .row.reverse.gutter > [class^=col] {
  margin-left: 0;
  margin-right: 2%;
}

body#tinymce .block > .row.reverse.gutter > [class^=col]:first-child,
article .block > .row.reverse.gutter > [class^=col]:first-child {
  margin-right: 0;
}

body#tinymce ul[class^=col],
body#tinymce ol[class^=col],
article ul[class^=col],
article ol[class^=col] {
  margin: 0;
  list-style: none;
}

body#tinymce ul[class^=col]:after,
body#tinymce ol[class^=col]:after,
article ul[class^=col]:after,
article ol[class^=col]:after {
  display: block;
  content: "";
  clear: both;
}

body#tinymce ul[class^=col] > li,
body#tinymce ol[class^=col] > li,
article ul[class^=col] > li,
article ol[class^=col] > li {
  float: left;
  margin-bottom: 0;
  padding: 10px;
}

body#tinymce ul[class^=col] > li:before,
body#tinymce ol[class^=col] > li:before,
article ul[class^=col] > li:before,
article ol[class^=col] > li:before {
  display: none;
}

body#tinymce ul[class^=col] > li.left,
body#tinymce ol[class^=col] > li.left,
article ul[class^=col] > li.left,
article ol[class^=col] > li.left {
  text-align: left;
}

body#tinymce ul[class^=col] > li.center,
body#tinymce ol[class^=col] > li.center,
article ul[class^=col] > li.center,
article ol[class^=col] > li.center {
  text-align: center;
}

body#tinymce ul[class^=col] > li.right,
body#tinymce ol[class^=col] > li.right,
article ul[class^=col] > li.right,
article ol[class^=col] > li.right {
  text-align: right;
}

body#tinymce ul[class^=col].gutter > li,
body#tinymce ol[class^=col].gutter > li,
article ul[class^=col].gutter > li,
article ol[class^=col].gutter > li {
  margin: 0 0 2% 2%;
  padding: 0;
}

body#tinymce ul.col2 > li,
body#tinymce ol.col2 > li,
article ul.col2 > li,
article ol.col2 > li {
  width: 50%;
}

body#tinymce ul.col2 > li:nth-child(2n+1),
body#tinymce ol.col2 > li:nth-child(2n+1),
article ul.col2 > li:nth-child(2n+1),
article ol.col2 > li:nth-child(2n+1) {
  clear: both;
  margin-left: 0;
}

body#tinymce ul.col2.gutter > li,
body#tinymce ol.col2.gutter > li,
article ul.col2.gutter > li,
article ol.col2.gutter > li {
  width: 49%;
}

body#tinymce ul.col3 > li,
body#tinymce ol.col3 > li,
article ul.col3 > li,
article ol.col3 > li {
  width: 33.33333%;
}

body#tinymce ul.col3 > li:nth-child(3n+1),
body#tinymce ol.col3 > li:nth-child(3n+1),
article ul.col3 > li:nth-child(3n+1),
article ol.col3 > li:nth-child(3n+1) {
  clear: both;
  margin-left: 0;
}

body#tinymce ul.col3.gutter > li,
body#tinymce ol.col3.gutter > li,
article ul.col3.gutter > li,
article ol.col3.gutter > li {
  width: 32%;
}

body#tinymce ul.col4 > li,
body#tinymce ol.col4 > li,
article ul.col4 > li,
article ol.col4 > li {
  width: 25%;
}

body#tinymce ul.col4 > li:nth-child(4n+1),
body#tinymce ol.col4 > li:nth-child(4n+1),
article ul.col4 > li:nth-child(4n+1),
article ol.col4 > li:nth-child(4n+1) {
  clear: both;
  margin-left: 0;
}

body#tinymce ul.col4.gutter > li,
body#tinymce ol.col4.gutter > li,
article ul.col4.gutter > li,
article ol.col4.gutter > li {
  width: 23.5%;
}

body#tinymce ul.col5 > li,
body#tinymce ol.col5 > li,
article ul.col5 > li,
article ol.col5 > li {
  width: 20%;
}

body#tinymce ul.col5 > li:nth-child(5n+1),
body#tinymce ol.col5 > li:nth-child(5n+1),
article ul.col5 > li:nth-child(5n+1),
article ol.col5 > li:nth-child(5n+1) {
  clear: both;
  margin-left: 0;
}

body#tinymce ul.col5.gutter > li,
body#tinymce ol.col5.gutter > li,
article ul.col5.gutter > li,
article ol.col5.gutter > li {
  width: 18.4%;
}

body#tinymce ul,
body#tinymce ol,
article ul,
article ol {
  margin: 0 0 1em 1em;
}

body#tinymce ul > li > ul,
body#tinymce ul > li > ol,
body#tinymce ol > li > ul,
body#tinymce ol > li > ol,
article ul > li > ul,
article ul > li > ol,
article ol > li > ul,
article ol > li > ol {
  margin: 0 0 0 1.5em;
}

body#tinymce ul.inline > li,
body#tinymce ol.inline > li,
article ul.inline > li,
article ol.inline > li {
  display: inline-block;
  padding-right: 3em;
}

body#tinymce ul.non_style,
body#tinymce ol.non_style,
article ul.non_style,
article ol.non_style {
  margin: 0;
  list-style: none;
}

body#tinymce ul.non_style > li,
body#tinymce ol.non_style > li,
article ul.non_style > li,
article ol.non_style > li {
  padding-left: 0;
}

body#tinymce ul.non_style > li:before,
body#tinymce ol.non_style > li:before,
article ul.non_style > li:before,
article ol.non_style > li:before {
  display: none;
  position: static;
  left: auto;
  top: auto;
  width: auto;
  height: auto;
  background-color: transparent;
  border: none;
  border-radius: 0;
}

body#tinymce ul > li,
article ul > li {
  position: relative;
}

body#tinymce ul > li:before,
article ul > li:before {
  position: absolute;
  left: -1.05em;
  top: 0.65em;
  display: block;
  content: "";
  width: 7px;
  height: 7px;
  background-color: #db0505;
  border: 2px solid #db0505;
  border-radius: 50%;
}

body#tinymce ul > li > ul > li:before,
article ul > li > ul > li:before {
  background-color: transparent;
  border-color: #db0505;
}

body#tinymce ol,
article ol {
  list-style: decimal;
}

body#tinymce ol > li:before,
article ol > li:before {
  display: none;
}

body#tinymce dl dt,
article dl dt {
  color: #db0505;
  font-weight: bold;
}

body#tinymce dl dd,
article dl dd {
  margin-left: 1em;
}

body#tinymce em,
article em {
  font-style: italic;
}

body#tinymce blockquote,
article blockquote {
  position: relative;
  margin: 20px 0;
  padding: 20px 50px;
  font-size: 0.85714rem;
  background-color: #f6f6f6;
}

body#tinymce blockquote:before, body#tinymce blockquote:after,
article blockquote:before,
article blockquote:after {
  position: absolute;
  display: block;
  width: 50px;
  height: 50px;
  color: #000000;
  font-size: 50px;
  text-align: center;
  line-height: 1.5;
}

body#tinymce blockquote:before,
article blockquote:before {
  left: 0;
  top: 0;
  content: "“";
}

body#tinymce blockquote:after,
article blockquote:after {
  right: 0;
  bottom: 0;
  content: "”";
}

body#tinymce img,
article img {
  max-width: 100%;
  height: auto;
  vertical-align: bottom;
}

body#tinymce img.center, body#tinymce img.aligncenter,
article img.center,
article img.aligncenter {
  clear: both;
  display: block;
  margin: 0 auto 1.5em;
}

body#tinymce img.left, body#tinymce img.alignleft,
article img.left,
article img.alignleft {
  clear: both;
  float: left;
  margin: 0 1.5em 1em 0;
}

body#tinymce img.right, body#tinymce img.alignright,
article img.right,
article img.alignright {
  clear: both;
  float: right;
  margin: 0 0 1em 1.5em;
}

body#tinymce iframe,
article iframe {
  width: 100%;
}

body#tinymce div.focus, body#tinymce div.attention,
article div.focus,
article div.attention {
  margin: 15px auto 20px;
  padding: 10px 20px;
  width: 90%;
  border-radius: 3px;
}

body#tinymce div.focus > ul,
body#tinymce div.focus > ol, body#tinymce div.attention > ul,
body#tinymce div.attention > ol,
article div.focus > ul,
article div.focus > ol,
article div.attention > ul,
article div.attention > ol {
  margin: 0 0 0 2em;
}

body#tinymce div.focus,
article div.focus {
  background-color: #f4f4f4;
}

body#tinymce div.attention,
article div.attention {
  background-color: #f9d7da;
}

body#tinymce div.attention strong,
article div.attention strong {
  color: #db0505;
}

body#tinymce .btn,
article .btn {
  position: relative;
  display: inline-block;
  margin: 10px 0;
  padding: 5px 50px;
  color: #db0505;
  text-align: center;
  vertical-align: middle;
  background-color: #fff;
  cursor: pointer;
  text-decoration: none !important;
  border: 1px solid #db0505;
  border-radius: 50px;
}

body#tinymce .btn:before, body#tinymce .btn:after,
article .btn:before,
article .btn:after {
  position: absolute;
  right: 20px;
  top: 50%;
  display: block;
  content: "";
  margin-top: -5px;
  width: 10px !important;
  height: 10px !important;
  background: transparent no-repeat center center;
  background-size: contain;
}

body#tinymce .btn:before,
article .btn:before {
  background-image: url(img/icon/arrow_red.png) !important;
}

body#tinymce .btn:after,
article .btn:after {
  opacity: 0;
  background-image: url(img/icon/arrow_white.png) !important;
}

body#tinymce .image_col2,
article .image_col2 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

body#tinymce .image_col2 .image,
article .image_col2 .image {
  margin-bottom: .5em;
  text-align: center;
}

body#tinymce .image_col2 .comment strong,
article .image_col2 .comment strong {
  color: #db0505;
  font-size: 1.14286rem;
}

body#tinymce .image_visual,
article .image_visual {
  position: relative;
}

body#tinymce .image_visual .image,
body#tinymce .image_visual .comment,
article .image_visual .image,
article .image_visual .comment {
  margin-bottom: 1em;
}

body#tinymce .image_visual .comment,
article .image_visual .comment {
  padding: 20px;
  background-color: #fff;
}

body#tinymce .image_visual .comment strong,
article .image_visual .comment strong {
  color: #db0505;
}

body#tinymce .internal_link,
article .internal_link {
  text-align: center;
}

body#tinymce .internal_link li,
article .internal_link li {
  display: inline-block;
  vertical-align: middle;
}

body#tinymce .internal_link a,
article .internal_link a {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  margin: 10px 5px;
  padding: 5px 50px;
  min-width: 280px;
  color: #fff;
  font-weight: bold;
  text-align: center;
  text-decoration: none !important;
  background-color: #db0505;
  border: 1px solid #db0505;
  border-radius: 50px;
  cursor: pointer;
}

body#tinymce .internal_link a:before, body#tinymce .internal_link a:after,
article .internal_link a:before,
article .internal_link a:after {
  position: absolute;
  right: 20px;
  top: 50%;
  display: block;
  content: "";
  margin-top: -5px;
  width: 10px;
  height: 10px;
  background: transparent no-repeat center center;
  background-size: contain;
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
}

body#tinymce .internal_link a:before,
article .internal_link a:before {
  background-image: url(img/icon/arrow_white.png);
}

body#tinymce .internal_link a:after,
article .internal_link a:after {
  opacity: 0;
  background-image: url(img/icon/arrow_red.png);
}

body#tinymce .internal_link a.beginner,
article .internal_link a.beginner {
  padding-left: 75px;
}

body#tinymce .internal_link a.beginner span,
article .internal_link a.beginner span {
  position: relative;
}

body#tinymce .internal_link a.beginner span:before, body#tinymce .internal_link a.beginner span:after,
article .internal_link a.beginner span:before,
article .internal_link a.beginner span:after {
  position: absolute;
  left: -25px;
  top: 50%;
  display: block;
  content: "";
  margin-top: -10px;
  width: 20px;
  height: 20px;
  background: transparent no-repeat center center;
  background-size: contain;
}

body#tinymce .internal_link a.beginner span:before,
article .internal_link a.beginner span:before {
  background-image: url(img/icon/beginner_white.png);
}

body#tinymce .internal_link a.beginner span:after,
article .internal_link a.beginner span:after {
  background-image: url(img/icon/beginner_red.png);
  opacity: 0;
}

body#tinymce .text_indent,
article .text_indent {
  margin-left: 1em;
  text-indent: -1em;
}

body#tinymce .pagination ul,
article .pagination ul {
  text-align: center;
  font-size: 0;
}

body#tinymce .pagination ul li,
article .pagination ul li {
  display: inline-block;
  vertical-align: middle;
  font-size: 1rem;
}

body#tinymce .pagination ul li a,
body#tinymce .pagination ul li span,
article .pagination ul li a,
article .pagination ul li span {
  display: inline-block;
  font-weight: bold;
  text-align: center;
  vertical-align: middle;
}

body#tinymce .pagination ul li a,
article .pagination ul li a {
  color: #db0505;
  text-decoration: none;
  border: 2px solid #db0505;
}

body#tinymce .pagination ul li a[href="javascript:;"],
article .pagination ul li a[href="javascript:;"] {
  color: #000000;
  text-decoration: none;
  border: 2px solid #db0505;
  cursor: default;
}

body#tinymce .pagination ul li span,
article .pagination ul li span {
  color: #fff;
  background-color: #f40606;
  border: 2px solid #db0505;
}

@media only screen and (min-width: 740px) {
  html {
    font-size: 14px;
  }
  #content:before {
    height: 350px;
  }
  body#tinymce,
  article {
    margin: 0 auto;
    padding-bottom: 100px;
    width: 980px;
  }
  body#tinymce p + section,
  body#tinymce section,
  article p + section,
  article section {
    padding: 60px 0;
  }
  body#tinymce h2,
  article h2 {
    margin-bottom: 40px;
    font-size: 1.35714rem;
  }
  body#tinymce h2.title em,
  article h2.title em {
    height: 50px;
  }
  body#tinymce .catch,
  article .catch {
    width: 750px;
  }
  body#tinymce a,
  article a {
    -webkit-transition: color 0.4s;
    transition: color 0.4s;
  }
  body#tinymce a img,
  article a img {
    -webkit-transition: opacity 0.4s;
    transition: opacity 0.4s;
  }
  body#tinymce a:hover img,
  article a:hover img {
    opacity: 0.8;
  }
  body#tinymce table.fixed,
  article table.fixed {
    table-layout: fixed;
  }
  body#tinymce .btn,
  article .btn {
    min-width: 300px;
    font-size: 1.5rem;
    -webkit-transition: color 0.6s, background-color 0.6s;
    transition: color 0.6s, background-color 0.6s;
  }
  body#tinymce .btn:after,
  article .btn:after {
    -webkit-transition: opacity 0.6s;
    transition: opacity 0.6s;
  }
  body#tinymce .btn:hover,
  article .btn:hover {
    color: #fff;
    background-color: #db0505;
  }
  body#tinymce .btn:hover:after,
  article .btn:hover:after {
    opacity: 1;
  }
  body#tinymce .image_col2,
  article .image_col2 {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
  }
  body#tinymce .image_col2 li,
  article .image_col2 li {
    margin: 0 50px 2em;
    width: 350px;
  }
  body#tinymce .image_visual .comment,
  article .image_visual .comment {
    position: absolute;
    right: 0;
    top: 50px;
    width: 480px;
  }
  body#tinymce .internal_link a,
  article .internal_link a {
    font-size: 1.28571rem;
    -webkit-transition: color 0.6s, background-color 0.6s;
    transition: color 0.6s, background-color 0.6s;
  }
  body#tinymce .internal_link a:after,
  article .internal_link a:after {
    -webkit-transition: opacity 0.6s;
    transition: opacity 0.6s;
  }
  body#tinymce .internal_link a:hover,
  article .internal_link a:hover {
    color: #db0505;
    background-color: #fff;
  }
  body#tinymce .internal_link a:hover:after,
  article .internal_link a:hover:after {
    opacity: 1;
  }
  body#tinymce .internal_link a:hover.beginner span:after,
  article .internal_link a:hover.beginner span:after {
    opacity: 1;
  }
  body#tinymce .internal_link a.beginner span:after,
  article .internal_link a.beginner span:after {
    -webkit-transition: opacity 0.6s;
    transition: opacity 0.6s;
  }
  body#tinymce .pagination ul li a,
  body#tinymce .pagination ul li span,
  article .pagination ul li a,
  article .pagination ul li span {
    margin: 5px;
    padding: 5px 15px;
  }
  body#tinymce .pagination ul li a,
  article .pagination ul li a {
    -webkit-transition: color 0.4s, background-color 0.4s, border-color 0.4s;
    transition: color 0.4s, background-color 0.4s, border-color 0.4s;
  }
  body#tinymce .pagination ul li a:hover,
  article .pagination ul li a:hover {
    color: #fff;
    background-color: #f40606;
    border: 2px solid #db0505;
  }
  body#tinymce .pagination ul li a[href="javascript:;"],
  article .pagination ul li a[href="javascript:;"] {
    color: #000000;
    background-color: transparent;
    border: 2px solid #db0505;
  }
}

@media only screen and (max-width: 739px) {
  html {
    font-size: 0.85714rem;
  }
  #content:before {
    height: 200px;
  }
  body#tinymce,
  article {
    padding-bottom: 50px;
  }
  body#tinymce section,
  article section {
    padding: 30px 0;
  }
  body#tinymce h2,
  article h2 {
    margin-bottom: 20px;
  }
  body#tinymce h2.title em,
  article h2.title em {
    height: 25px;
  }
  body#tinymce .catch,
  article .catch {
    width: 90%;
  }
  body#tinymce table.vertical > thead > tr > th,
  body#tinymce table.vertical > thead > tr > td,
  body#tinymce table.vertical > tbody > tr > th,
  body#tinymce table.vertical > tbody > tr > td,
  article table.vertical > thead > tr > th,
  article table.vertical > thead > tr > td,
  article table.vertical > tbody > tr > th,
  article table.vertical > tbody > tr > td {
    display: block;
    white-space: normal !important;
    width: 100%;
  }
  body#tinymce table.vertical > thead > tr > th:empty,
  body#tinymce table.vertical > thead > tr > td:empty,
  body#tinymce table.vertical > tbody > tr > th:empty,
  body#tinymce table.vertical > tbody > tr > td:empty,
  article table.vertical > thead > tr > th:empty,
  article table.vertical > thead > tr > td:empty,
  article table.vertical > tbody > tr > th:empty,
  article table.vertical > tbody > tr > td:empty {
    display: none;
  }
  body#tinymce .flex > .row.vertical,
  article .flex > .row.vertical {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }
  body#tinymce .flex > .row.vertical > [class^=col],
  article .flex > .row.vertical > [class^=col] {
    margin-right: 0;
    margin-left: 0;
    padding-right: 0;
    padding-left: 0;
    width: 100%;
  }
  body#tinymce .block > .row.vertical > [class^=col],
  article .block > .row.vertical > [class^=col] {
    float: none;
    margin-right: 0;
    margin-left: 0;
    padding-right: 0;
    padding-left: 0;
    width: 100%;
  }
  body#tinymce ul[class^=col].vertical > li,
  body#tinymce ol[class^=col].vertical > li,
  article ul[class^=col].vertical > li,
  article ol[class^=col].vertical > li {
    float: none;
    margin-right: 0;
    margin-left: 0;
    padding-right: 0;
    padding-left: 0;
    width: 100%;
  }
  body#tinymce .btn,
  article .btn {
    min-width: 240px;
    font-size: 1.14286rem;
  }
  body#tinymce .image_col2,
  article .image_col2 {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }
  body#tinymce .image_col2 li,
  article .image_col2 li {
    margin: 0 10% 2em;
    width: 80%;
  }
  body#tinymce .image_visual .image,
  article .image_visual .image {
    text-align: center;
  }
  body#tinymce .internal_link a,
  article .internal_link a {
    font-size: 1.14286rem;
  }
  body#tinymce .pagination ul,
  article .pagination ul {
    margin: 0 -10px;
  }
  body#tinymce .pagination ul li a,
  body#tinymce .pagination ul li span,
  article .pagination ul li a,
  article .pagination ul li span {
    margin: 2px;
    padding: 0 10px;
  }
}

/* --------------------------------------------------
	 4. Container
-------------------------------------------------- */
#container #header,
#container #content,
#container #footer {
  clear: both;
}

#container #header .inner,
#container #content .inner,
#container #footer .inner {
  position: relative;
  margin: 0 auto;
}

@media all and (min-width: 740px) {
  #container #header,
  #container #content,
  #container #footer {
    min-width: 1280px;
  }
  #container #header .inner,
  #container #content .inner,
  #container #footer .inner {
    padding: 0 20px;
    width: 1240px;
    min-width: 1240px;
  }
}

@media only screen and (max-width: 739px) {
  #container #header,
  #container #content,
  #container #footer {
    min-width: 320px;
  }
  #container #header .inner,
  #container #content .inner,
  #container #footer .inner {
    padding: 0 20px;
    min-width: 280px;
  }
}

/* --------------------------------------------------
	 5. Header
-------------------------------------------------- */
#header {
  position: fixed !important;
  left: 0;
  top: 0;
  width: 100%;
  background-color: #f7f7f7;
  z-index: 10;
}

#header a {
  text-decoration: none;
}

#header .logo a {
  display: block;
  overflow: hidden;
  color: transparent;
  text-decoration: none;
  text-indent: 110%;
  white-space: nowrap;
  font-size: 0;
  width: 200px;
  height: 50px;
  background: transparent url(img/header/logo.png) no-repeat center center;
  background-size: contain;
}

#header nav.menu .nav li a {
  display: block;
}

#header nav.menu .nav li a strong,
#header nav.menu .nav li a em {
  display: block;
}

#header .information {
  color: #db0505;
}

#header .information .contact a {
  display: block;
  color: #db0505;
  font-size: 0.85714rem;
  text-align: center;
  border: 1px solid #db0505;
}

@media all and (min-width: 740px) {
  #header {
    height: 120px;
    -webkit-box-shadow: 0 3px 10px 3px rgba(0, 0, 0, 0.1);
    box-shadow: 0 3px 10px 3px rgba(0, 0, 0, 0.1);
  }
  #header .logo {
    position: absolute;
    left: 20px;
    top: 35px;
  }
  #header .logo a {
    -webkit-transition: opacity 0.4s;
    transition: opacity 0.4s;
  }
  #header .logo a:hover {
    opacity: 0.8;
  }
  #header nav.menu {
    padding: 25px 0 25px 220px;
  }
  #header nav.menu > .menu {
    display: none;
  }
  #header nav.menu .nav li {
    position: relative;
    display: inline-block;
    padding: 0 20px;
    text-align: center;
    vertical-align: middle;
  }
  #header nav.menu .nav li:before {
    position: absolute;
    left: 0;
    top: 20%;
    display: block;
    content: "";
    width: 1px;
    height: 60%;
    background-color: rgba(51, 51, 51, 0.5);
    -webkit-transform: rotate(30deg);
    transform: rotate(30deg);
  }
  #header nav.menu .nav li.lineup:before {
    display: none;
  }
  #header nav.menu .nav li.lineup a:before {
    background-image: url(img/header/menu_lineup_off.png);
  }
  #header nav.menu .nav li.lineup a:after {
    background-image: url(img/header/menu_lineup_on.png);
  }
  #header nav.menu .nav li.dietician a:before {
    background-image: url(img/header/menu_dietician_off.png);
  }
  #header nav.menu .nav li.dietician a:after {
    background-image: url(img/header/menu_dietician_on.png);
  }
  #header nav.menu .nav li.wholesale a:before {
    background-image: url(img/header/menu_wholesale_off.png);
  }
  #header nav.menu .nav li.wholesale a:after {
    background-image: url(img/header/menu_wholesale_on.png);
  }
  #header nav.menu .nav li.retail a:before {
    background-image: url(img/header/menu_retail_off.png);
  }
  #header nav.menu .nav li.retail a:after {
    background-image: url(img/header/menu_retail_on.png);
  }
  #header nav.menu .nav li.about a:before {
    background-image: url(img/header/menu_about_off.png);
  }
  #header nav.menu .nav li.about a:after {
    background-image: url(img/header/menu_about_on.png);
  }
  #header nav.menu .nav a {
    position: relative;
    display: block;
    padding-top: 30px;
    color: #333;
  }
  #header nav.menu .nav a:before, #header nav.menu .nav a:after {
    position: absolute;
    left: 0;
    top: 0;
    display: block;
    content: "";
    width: 100%;
    height: 30px;
    background: transparent no-repeat center center;
    background-size: contain;
  }
  #header nav.menu .nav a:after {
    opacity: 0;
    -webkit-transition: opacity 0.4s;
    transition: opacity 0.4s;
  }
  #header nav.menu .nav a:hover:after {
    opacity: 1;
  }
  #header nav.menu .nav strong {
    font-size: 1.14286rem;
    line-height: 1.2;
  }
  #header nav.menu .nav em {
    color: #db0505;
    font-size: 0.78571rem;
  }
  #header nav.menu .nav .home,
  #header nav.menu .nav .tel,
  #header nav.menu .nav .contact {
    display: none;
  }
  #header .information {
    position: absolute;
    right: 20px;
    top: 15px;
  }
  #header .information .contact {
    margin-bottom: 5px;
  }
  #header .information .contact a {
    padding: 2px 10px 0;
    font-weight: bold;
    -webkit-transition: color 0.4s, background-color 0.4s;
    transition: color 0.4s, background-color 0.4s;
  }
  #header .information .contact a:hover {
    color: #fff;
    background-color: #db0505;
  }
  #header .information .tel {
    font-size: 1.57143rem;
    font-weight: bold;
    line-height: 1.2;
  }
  #header .information .tel:before {
    display: inline-block;
    vertical-align: middle;
    content: "";
    margin-top: -5px;
    margin-right: 5px;
    width: 20px;
    height: 20px;
    background: transparent url(img/header/information_tel.png) no-repeat center center;
    background-size: contain;
  }
  #header .information .time {
    position: relative;
    line-height: 1.4;
  }
  #header .information .time dt {
    position: absolute;
    left: 0;
    top: 0;
  }
  #header .information .time dd {
    padding-left: 4em;
  }
}

@media only screen and (max-width: 739px) {
  body.opened {
    position: fixed;
    width: 100%;
  }
  body.opened #header nav.menu > .menu:before, body.opened #header nav.menu > .menu:after {
    opacity: 0;
  }
  body.opened #header nav.menu > .menu span:before {
    -webkit-transform: rotate(40deg);
    transform: rotate(40deg);
  }
  body.opened #header nav.menu > .menu span:after {
    -webkit-transform: rotate(-40deg);
    transform: rotate(-40deg);
  }
  body.opened #header nav.menu .nav {
    left: 0;
  }
  #header {
    position: relative;
  }
  #header .logo {
    padding: 5px 0;
  }
  #header nav.menu {
    margin-right: 0;
  }
  #header nav.menu > .menu {
    position: absolute;
    right: 0;
    top: 0;
    width: 60px;
    height: 60px;
    color: #fff;
    font-size: 0.57143rem;
    background-color: #000000;
    border-left: 1px solid #666666;
    border-bottom: 1px solid #666666;
    cursor: pointer;
    z-index: 30;
  }
  #header nav.menu > .menu:before, #header nav.menu > .menu:after {
    position: absolute;
    left: 15px;
    display: block;
    content: "";
    width: 30px;
    height: 1px;
    background-color: #fff;
    -webkit-transition: opacity 0.4s;
    transition: opacity 0.4s;
  }
  #header nav.menu > .menu:before {
    top: 20px;
  }
  #header nav.menu > .menu:after {
    bottom: 20px;
  }
  #header nav.menu > .menu span {
    display: block;
    overflow: hidden;
    color: transparent;
    text-decoration: none;
    text-indent: 110%;
    white-space: nowrap;
    font-size: 0;
  }
  #header nav.menu > .menu span:before, #header nav.menu > .menu span:after {
    position: absolute;
    left: 15px;
    top: 50%;
    display: block;
    content: "";
    width: 30px;
    height: 1px;
    background-color: #fff;
    -webkit-transition: -webkit-transform 0.4s;
    transition: -webkit-transform 0.4s;
    transition: transform 0.4s;
    transition: transform 0.4s, -webkit-transform 0.4s;
  }
  #header nav.menu .nav {
    position: fixed !important;
    left: 100%;
    top: 0;
    padding: 60px 0 100px;
    width: 100%;
    height: 100%;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
    background-color: rgba(0, 0, 0, 0.5);
    filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#80000000', endColorstr='#80000000');
    -webkit-transition: left 0.2s;
    transition: left 0.2s;
    z-index: 20;
  }
  #header nav.menu .nav:after {
    display: block;
    content: "";
    clear: both;
  }
  #header nav.menu .nav li {
    background-color: #000000;
    border-bottom: 1px solid #666666;
  }
  #header nav.menu .nav li.tel, #header nav.menu .nav li.contact {
    float: left;
    padding: 30px 10px 60px;
    width: 50%;
    border-bottom: none;
  }
  #header nav.menu .nav li.tel a, #header nav.menu .nav li.contact a {
    display: block;
    overflow: hidden;
    color: transparent;
    text-decoration: none;
    text-indent: 110%;
    white-space: nowrap;
    font-size: 0;
    height: 50px;
    background: #db0505 no-repeat center center;
    background-size: contain;
  }
  #header nav.menu .nav li.tel {
    padding-left: 20px;
  }
  #header nav.menu .nav li.tel a {
    background-image: url(img/header/menu_tel_sp.png);
  }
  #header nav.menu .nav li.contact {
    padding-right: 20px;
  }
  #header nav.menu .nav li.contact a {
    background-image: url(img/header/menu_contact_sp.png);
  }
  #header nav.menu .nav a {
    padding: 10px 20px;
    color: #fff;
    font-size: 1.14286rem;
  }
  #header nav.menu .nav a em {
    display: none !important;
  }
  #header .information .contact,
  #header .information .time {
    display: none;
  }
  #header .information .tel a {
    display: block;
    overflow: hidden;
    color: transparent;
    text-decoration: none;
    text-indent: 110%;
    white-space: nowrap;
    font-size: 0;
    width: 60px;
    height: 60px;
    position: absolute;
    right: 60px;
    top: 0;
    background: #db0505 url(img/header/menu_tel.png) no-repeat center center;
    background-size: 60px 60px;
  }
}

/* --------------------------------------------------
	 6. Breadcrumb
-------------------------------------------------- */
#breadcrumb {
  position: relative;
  margin: 10px 20px 20px;
}

#breadcrumb ul {
  position: relative;
}

#breadcrumb ul:after {
  display: block;
  content: "";
  clear: both;
}

#breadcrumb ul li {
  float: left;
}

#breadcrumb ul li a {
  color: #333;
  text-decoration: underline;
}

#breadcrumb ul li a:hover {
  text-decoration: none;
}

#breadcrumb ul li .divider {
  padding: 0 10px;
}

@media only screen and (max-width: 739px) {
  #breadcrumb {
    display: none;
  }
}

/* --------------------------------------------------
	 7. Content
-------------------------------------------------- */
#content:before {
  display: block;
  content: "";
  width: 100%;
  background: transparent no-repeat center center;
  background-size: cover;
}

@media all and (min-width: 740px) {
  #content {
    padding-top: 120px;
  }
  #content:before {
    min-width: 1280px;
  }
}

@media only screen and (max-width: 739px) {
  #content {
    padding-top: 60px;
  }
}

/* --------------------------------------------------
	 8. Footer
-------------------------------------------------- */
#footer {
  position: relative;
  background-color: #c0f7f3;
}

#footer .wave {
  position: absolute;
  left: 0;
  top: -40px;
  width: 100%;
  height: 80px;
}

#footer nav.floating {
  position: fixed;
  z-index: 10;
}

#footer nav.floating a {
  position: relative;
  display: block;
  color: #fff;
  text-align: center;
  text-decoration: none;
  font-size: 1.07143rem;
}

#footer nav.floating .shopping a {
  background-color: #fa5694;
}

#footer nav.floating .contact a {
  background-color: #db0505;
}

#footer nav.floating #pagetop a {
  display: block;
  overflow: hidden;
  color: transparent;
  text-decoration: none;
  text-indent: 110%;
  white-space: nowrap;
  font-size: 0;
  background: #333333 url(img/footer/floating_pagetop.png) no-repeat center center;
  background-size: 20px 20px;
}

#footer div.contact {
  padding: 30px 40px 20px;
  font-weight: bold;
  background-color: #fff;
  text-align: center;
}

#footer div.contact h3 {
  position: absolute;
  left: 50%;
  top: 0;
  margin-top: -1em;
  margin-left: -8em;
  width: 16em;
  color: #fff;
  font-size: 1.28571rem;
  background-color: #333333;
  border-radius: 20px;
}

#footer div.contact .tel {
  color: #db0505;
  font-size: 2.85714rem;
  line-height: 1.2;
}

#footer div.contact .tel:before {
  display: inline-block;
  vertical-align: middle;
  margin: -8px 5px 0 0;
  content: "";
  width: 30px;
  height: 30px;
  background: transparent url(img/footer/contact_tel.png) no-repeat center center;
  background-size: contain;
}

#footer div.contact .time dt,
#footer div.contact .time dd {
  display: inline-block;
  vertical-align: middle;
}

#footer .company h2 span {
  font-weight: bold;
  font-size: 1.07143rem;
}

#footer .company h2 em {
  display: none;
}

#footer .company h2 strong {
  display: block;
  overflow: hidden;
  color: transparent;
  text-decoration: none;
  text-indent: 110%;
  white-space: nowrap;
  font-size: 0;
  width: 200px;
  height: 50px;
  background: transparent url(img/footer/logo.png) no-repeat left top;
  background-size: contain;
}

#footer .company address span {
  display: inline-block;
  vertical-align: middle;
}

#footer .company address span:first-child {
  margin-right: 1em;
}

#footer .company .tel_fax > span {
  display: inline-block;
  vertical-align: middle;
}

#footer .company .tel_fax .tel {
  margin-right: 1em;
}

#footer .company .tel_fax .tel a {
  color: #333;
}

#footer .copyright {
  padding: 20px;
  color: #828282;
  text-align: center;
}

@media all and (min-width: 740px) {
  #footer nav.floating {
    right: 0;
    top: 240px;
  }
  #footer nav.floating a {
    padding: 10px 15px;
    width: 50px;
    line-height: 1;
    -webkit-transition: background-color 0.4s;
    transition: background-color 0.4s;
  }
  #footer nav.floating .shopping a:before,
  #footer nav.floating .contact a:before {
    display: block;
    content: "";
    margin-bottom: 5px;
    width: 20px;
    height: 20px;
    background: transparent no-repeat center center;
    background-size: contain;
  }
  #footer nav.floating .shopping a:before {
    background-image: url(img/footer/floating_shopping.png);
  }
  #footer nav.floating .shopping a:hover {
    background-color: rgba(250, 86, 148, 0.8);
  }
  #footer nav.floating .contact a:before {
    background-image: url(img/footer/floating_contact.png);
  }
  #footer nav.floating .contact a:hover {
    background-color: rgba(219, 5, 5, 0.8);
  }
  #footer nav.floating #pagetop a {
    height: 50px;
  }
  #footer nav.floating #pagetop a:hover {
    background-color: rgba(51, 51, 51, 0.8);
  }
  #footer div.contact {
    position: absolute;
    right: 0;
    top: 50px;
  }
  #footer .company {
    padding: 40px 0 20px 10px;
    min-height: 200px;
  }
  #footer .company h2 {
    margin-bottom: .5em;
  }
  #footer .company h2 span {
    display: block;
    margin-bottom: 1em;
    padding-left: .5em;
  }
}

@media only screen and (max-width: 739px) {
  #footer {
    padding-top: 40px;
    padding-bottom: 90px;
  }
  #footer nav.floating {
    left: 0;
    bottom: 0;
    width: 100%;
  }
  #footer nav.floating ul:after {
    display: block;
    content: "";
    clear: both;
  }
  #footer nav.floating .contact a {
    display: block;
    overflow: hidden;
    color: transparent;
    text-decoration: none;
    text-indent: 110%;
    white-space: nowrap;
    font-size: 0;
    height: 50px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
  }
  #footer nav.floating .contact a {
    background-image: url(img/footer/floating_contact_sp.png);
  }
  #footer nav.floating #pagetop {
    clear: both;
  }
  #footer nav.floating #pagetop a {
    height: 50px;
  }
  #footer div.contact {
    margin-bottom: 30px;
    padding: 30px 20px 20px;
  }
  #footer div.contact p {
    margin-bottom: .5em;
  }
  #footer div.contact .tel {
    font-size: 2rem;
  }
  #footer div.contact .tel a {
    color: #db0505;
  }
  #footer div.contact .time dt {
    display: block;
  }
  #footer .company {
    text-align: center;
  }
  #footer .company h2 strong {
    margin: 10px auto;
  }
}

/* --------------------------------------------------
	 9. Home
-------------------------------------------------- */
body.home #content:before {
  display: none;
}

body.home #content > .inner {
  padding: 0 !important;
  width: auto !important;
}

body.home article {
  padding-bottom: 0;
  width: auto;
}

body.home section.main_img {
  position: relative;
  padding: 0;
}

body.home section.main_img #slider li {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: transparent no-repeat center center;
  background-size: cover;
  opacity: 0;
  -webkit-transition: opacity 2s;
  transition: opacity 2s;
}

body.home section.main_img #slider li.active {
  opacity: 1;
}

body.home section.main_img h2 {
  display: block;
  overflow: hidden;
  color: transparent;
  text-decoration: none;
  text-indent: 110%;
  white-space: nowrap;
  font-size: 0;
  background: transparent url(img/home/main_catch.png) no-repeat left top;
  background-size: contain;
}

body.home section.main_img .delivery {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 320px;
  padding: 10px 0 5px;
  color: #fff;
  background-color: #db0505;
  border-radius: 10px;
  z-index: 1;
}

body.home section.main_img .delivery:before, body.home section.main_img .delivery:after {
  position: absolute;
  display: block;
  content: "";
}

body.home section.main_img .delivery:before {
  left: 50%;
  top: -60px;
  margin-left: -80px;
  width: 160px;
  height: 160px;
  background-color: #db0505;
  border-radius: 50%;
  z-index: -1;
}

body.home section.main_img .delivery:after {
  left: 50%;
  top: -35px;
  margin-left: -30px;
  width: 60px;
  height: 40px;
  background: transparent url(img/home/main_delivery.png) no-repeat left top;
  background-size: contain;
}

body.home section.main_img .delivery h3 {
  margin-bottom: 0;
  padding: 0;
  color: #fff;
  font-size: 1.57143rem;
  text-align: center;
  border-bottom: none;
}

body.home section.main_img .delivery ul {
  display: block;
  overflow: hidden;
  color: transparent;
  text-decoration: none;
  text-indent: 110%;
  white-space: nowrap;
  font-size: 0;
  width: 100%;
  padding-top: 50%;
  background: transparent url(img/home/main_delivery_area.png) no-repeat center center;
  background-size: 90% auto;
}

body.home section.main_img .delivery .attention {
  display: block;
  font-size: 12px;
  text-align: center;
}

body.home section.lineup {
  position: relative;
  background-color: #c0f7f3;
}

body.home section.lineup h2 em {
  background-image: url(img/home/lineup_title.png);
}

body.home section.lineup div.goods ul:after {
  display: block;
  content: "";
  clear: both;
}

body.home section.lineup div.goods li {
  float: left;
  padding: 5px;
  width: 25%;
}

body.home section.lineup div.goods li:nth-child(4n+1) {
  clear: both;
}

body.home section.lineup div.goods li a {
  display: block;
  overflow: hidden;
  color: transparent;
  text-decoration: none;
  text-indent: 110%;
  white-space: nowrap;
  font-size: 0;
  position: relative;
}

body.home section.lineup div.goods li a:before {
  display: block;
  content: "";
  padding-top: 100%;
  background: #fff no-repeat center center;
  background-size: contain;
  border-radius: 50%;
}

body.home section.lineup div.goods li a:after {
  display: none;
}

body.home section.lineup div.goods li a.popular:after, body.home section.lineup div.goods li a.pickup:after {
  position: absolute;
  right: 0;
  top: 0;
  display: block;
  content: "";
  width: 29.41176%;
  padding-top: 29.41176%;
  background: transparent no-repeat center center;
  background-size: contain;
}

body.home section.lineup div.goods li a.popular:after {
  background-image: url(img/home/lineup_goods_popular.png);
}

body.home section.lineup div.goods li a.pickup:after {
  background-image: url(img/home/lineup_goods_pickup.png);
}

body.home section.lineup div.goods li.milk a:before {
  background-image: url(img/home/lineup_goods_milk.png);
}

body.home section.lineup div.goods li.pudding a:before {
  background-image: url(img/home/lineup_goods_pudding.png);
}

body.home section.lineup div.goods li.functional a:before {
  background-image: url(img/home/lineup_goods_functional.png);
}

body.home section.lineup div.goods li.health a:before {
  background-image: url(img/home/lineup_goods_health.png);
}

body.home section.lineup div.goods li.kids a:before {
  background-image: url(img/home/lineup_goods_kids.png);
}

body.home section.lineup div.goods li.nursing a:before {
  background-image: url(img/home/lineup_goods_nursing.png);
}

body.home section.lineup div.goods li.hospital a:before {
  background-image: url(img/home/lineup_goods_hospital.png);
}

body.home section.lineup div.goods li.shop a:before {
  background-image: url(img/home/lineup_goods_shop.png);
}

body.home section.lineup div.maker {
  padding: 30px;
  background-color: #fff;
}

body.home section.lineup div.maker h3 {
  position: relative;
  margin-bottom: 0;
  padding: 0;
  border-top: 1px solid rgba(51, 51, 51, 0.5);
  border-bottom: none;
}

body.home section.lineup div.maker h3 span {
  position: absolute;
  left: 50%;
  width: 12em;
  margin-left: -6em;
  margin-top: -.75em;
  color: #db0505;
  font-size: 1.35714rem;
  text-align: center;
  background-color: #fff;
}

body.home section.lineup div.maker h3 span:before {
  display: inline-block;
  vertical-align: middle;
  content: "";
  margin-top: -5px;
  margin-right: 10px;
  width: 30px;
  height: 30px;
  background: transparent url(img/home/lineup_functional.png) no-repeat center center;
  background-size: contain;
}

body.home section.lineup div.maker ul {
  padding-top: 30px;
}

body.home section.lineup div.maker ul:after {
  display: block;
  content: "";
  clear: both;
}

body.home section.lineup div.maker li {
  float: left;
  padding: 10px;
  width: 33.33333%;
}

body.home section.lineup div.maker li:nth-child(3n+1) {
  clear: both;
}

body.home section.lineup div.maker li a {
  display: block;
  overflow: hidden;
  color: transparent;
  text-decoration: none;
  text-indent: 110%;
  white-space: nowrap;
  font-size: 0;
  width: 100%;
  height: 50px;
  background: transparent no-repeat center center;
  background-size: contain;
}

body.home section.lineup div.maker li a:after {
  display: none;
}

body.home section.lineup div.maker li.glico a {
  background-image: url(img/home/maker_glico.png);
}

body.home section.lineup div.maker li.meiji a {
  background-image: url(img/home/maker_meiji.png);
}

body.home section.lineup div.maker li.morinaga_milk a {
  background-image: url(img/home/maker_morinaga_milk.png);
}

body.home section.lineup div.maker li.kagome a {
  background-image: url(img/home/maker_kagome.png);
}

body.home section.lineup div.maker li.meg_snow a {
  background-image: url(img/home/maker_meg_snow.png);
}

body.home section.lineup div.maker li.mothers a {
  background-image: url(img/home/maker_mothers.png);
}

body.home section.lineup div.maker li.dairy a {
  background-image: url(img/home/maker_dairy.png);
}

body.home section.lineup div.maker li.kyusyu_nyugyo a {
  background-image: url(img/home/maker_kyusyu_nyugyo.png);
}

body.home section.lineup div.maker li.tamanoi a {
  background-image: url(img/home/maker_tamanoi.png);
}

body.home section.lineup .wave {
  position: absolute;
  left: 0;
  bottom: -40px;
  width: 100%;
  height: 80px;
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}

body.home section.lineup .more {
  margin-top: 40px;
  text-align: center;
}

body.home section.lineup .more a {
  position: relative;
  display: inline-block;
  font-size: 20px;
  width: 100%;
  max-width: 355px;
  padding: 10px 50px;
  color: #fff;
  font-weight: bold;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  text-decoration: none;
  background-color: #db0505;
  border: 1px solid #db0505;
  border-radius: 50px;
}

body.home section.lineup .more a:before, body.home section.lineup .more a:after {
  position: absolute;
  right: 20px;
  top: 50%;
  display: block;
  content: "";
  margin-top: -5px;
  width: 10px;
  height: 10px;
  background: transparent no-repeat center center;
  background-size: contain;
}

body.home section.lineup .more a:before {
  background-image: url(img/icon/arrow_white.png);
}

body.home section.lineup .more a:after {
  opacity: 0;
  background-image: url(img/icon/arrow_red.png);
}

body.home section.goods h3 {
  position: relative;
  margin: 0 auto 40px;
  padding: 0;
  width: 80%;
  border-top: 1px solid rgba(51, 51, 51, 0.5);
  border-bottom: none;
}

body.home section.goods h3 span {
  position: absolute;
  left: 50%;
  width: 12em;
  margin-left: -6em;
  margin-top: -.75em;
  color: #db0505;
  font-size: 1.35714rem;
  text-align: center;
  background-color: #fff;
}

body.home section.goods h3 span:before {
  display: inline-block;
  vertical-align: middle;
  content: "";
  margin-top: -5px;
  margin-right: 10px;
  width: 30px;
  height: 30px;
  background: transparent no-repeat center center;
  background-size: contain;
}

body.home section.goods ul:after {
  display: block;
  content: "";
  clear: both;
}

body.home section.goods li {
  float: left;
  margin-bottom: 20px;
  padding: 10px;
  width: 50%;
}

body.home section.goods li:nth-child(2n+1) {
  clear: both;
}

body.home section.goods li .image a::after {
  display: none;
}

body.home section.goods li .name {
  margin-bottom: 10px;
  font-size: 1.14286rem;
}

body.home section.goods li .comment {
  margin-bottom: 10px;
}

body.home section.goods .basic h3 span:before {
  background-image: url(img/home/goods_basic.png);
}

body.home section.goods .pickup h3 span:before {
  background-image: url(img/home/goods_pickup.png);
}

body.home section.topics {
  background-color: #f7f7f7;
}

body.home section.topics h2 em {
  background-image: url(img/home/topics_title.png);
}

body.home section.topics li a {
  display: block;
  color: #333;
  text-decoration: none;
  border-bottom: 1px solid rgba(51, 51, 51, 0.5);
}

body.home section.topics li a .date {
  color: #db0505;
  font-weight: bold;
}

body.home section.topics li a .title {
  display: block;
  margin-bottom: .5em;
}

body.home section.topics .more {
  text-align: center;
}

body.home section.deliverry > .inner {
  padding: 0 !important;
  width: auto !important;
}

body.home section.deliverry h2 em {
  background-image: url(img/home/deliverry_title.png);
}

body.home section.deliverry .information,
body.home section.deliverry .map {
  position: relative;
  background: transparent no-repeat;
  background-size: cover;
}

body.home section.deliverry .information {
  background-image: url(img/home/deliverry_information.jpg);
  background-position: right center;
}

body.home section.deliverry .information .frame {
  text-align: center;
  background-color: rgba(255, 255, 255, 0.7);
}

body.home section.deliverry .information .frame p {
  position: relative;
  margin: 0 auto 1em;
  width: 95%;
  color: #db0505;
  font-size: 1.42857rem;
  font-weight: bold;
}

body.home section.deliverry .information .frame p:before, body.home section.deliverry .information .frame p:after {
  position: absolute;
  top: 20%;
  display: block;
  content: "";
  width: 1px;
  height: 60%;
  background-color: #db0505;
}

body.home section.deliverry .information .frame p:before {
  left: 0;
  -webkit-transform: rotate(-20deg);
  transform: rotate(-20deg);
}

body.home section.deliverry .information .frame p:after {
  right: 0;
  -webkit-transform: rotate(20deg);
  transform: rotate(20deg);
}

body.home section.deliverry .information .frame a {
  position: relative;
  display: inline-block;
  margin: 10px 0;
  padding: 5px 50px;
  color: #fff;
  font-weight: bold;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  text-decoration: none;
  background-color: #db0505;
  border: 1px solid #db0505;
  border-radius: 50px;
}

body.home section.deliverry .information .frame a:before, body.home section.deliverry .information .frame a:after {
  position: absolute;
  right: 20px;
  top: 50%;
  display: block;
  content: "";
  margin-top: -5px;
  width: 10px;
  height: 10px;
  background: transparent no-repeat center center;
  background-size: contain;
}

body.home section.deliverry .information .frame a:before {
  background-image: url(img/icon/arrow_white.png);
}

body.home section.deliverry .information .frame a:after {
  opacity: 0;
  background-image: url(img/icon/arrow_red.png);
}

body.home section.deliverry .map {
  background-image: url(img/home/deliverry_map.png);
  background-position: left center;
}

body.home section.deliverry .map ul {
  display: none;
}

body.home section.maker {
  margin-bottom: 10px;
}

body.home section.maker h3 {
  position: relative;
  margin-bottom: 20px;
  padding: 0;
  color: #333;
  border-top: 1px solid rgba(51, 51, 51, 0.5);
  border-bottom: none;
}

body.home section.maker h3 span {
  position: absolute;
  left: 50%;
  width: 10em;
  margin-top: -.75em;
  margin-left: -5em;
  text-align: center;
  background-color: #fff;
}

body.home section.maker ul {
  padding-top: 30px;
  text-align: center;
}

body.home section.maker li {
  display: inline-block;
  vertical-align: middle;
  margin: 10px 20px;
}

body.home section.maker li a {
  display: block;
  overflow: hidden;
  color: transparent;
  text-decoration: none;
  text-indent: 110%;
  white-space: nowrap;
  font-size: 0;
  background: transparent no-repeat center center;
  background-size: contain;
}

body.home section.maker li a:after {
  display: none;
}

body.home section.maker li.glico a {
  width: 100px;
  height: 70px;
  background-image: url(img/home/maker_glico.png);
}

body.home section.maker li.meiji a {
  width: 100px;
  height: 70px;
  background-image: url(img/home/maker_meiji.png);
}

body.home section.maker li.morinaga_milk a {
  width: 180px;
  height: 70px;
  background-image: url(img/home/maker_morinaga_milk.png);
}

body.home section.maker li.kagome a {
  width: 120px;
  height: 70px;
  background-image: url(img/home/maker_kagome.png);
}

body.home section.maker li.meg_snow a {
  width: 130px;
  height: 70px;
  background-image: url(img/home/maker_meg_snow.png);
}

body.home section.maker li.mothers a {
  width: 120px;
  height: 70px;
  background-image: url(img/home/maker_mothers.png);
}

body.home section.maker li.dairy a {
  width: 130px;
  height: 70px;
  background-image: url(img/home/maker_dairy.png);
}

body.home section.maker li.kyusyu_nyugyo a {
  width: 130px;
  height: 70px;
  background-image: url(img/home/maker_kyusyu_nyugyo.png);
}

body.home section.maker li.tamanoi a {
  width: 130px;
  height: 70px;
  background-image: url(img/home/maker_tamanoi.png);
}

body.home section.maker .none {
  text-align: center;
}

body.home section.lunch h2 em {
  background-image: url(img/home/lunch_title.png);
}

body.home section.lunch .container {
  max-width: 1000px;
  margin: 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 32px 16px;
}

body.home section.lunch .container .text {
  color: #333;
  font-size: 20px;
  font-weight: bold;
  line-height: 2;
}

body.home section.lunch .container .more {
  margin-top: 90px;
}

body.home section.lunch .container a {
  position: relative;
  display: inline-block;
  width: 100%;
  max-width: 355px;
  padding: 10px 50px;
  color: #fff;
  font-weight: bold;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  text-decoration: none;
  background-color: #db0505;
  border: 1px solid #db0505;
  border-radius: 50px;
}

body.home section.lunch .container a:before, body.home section.lunch .container a:after {
  position: absolute;
  right: 20px;
  top: 50%;
  display: block;
  content: "";
  margin-top: -5px;
  width: 10px;
  height: 10px;
  background: transparent no-repeat center center;
  background-size: contain;
}

body.home section.lunch .container a:before {
  background-image: url(img/icon/arrow_white.png);
}

body.home section.lunch .container a:after {
  opacity: 0;
  background-image: url(img/icon/arrow_red.png);
}

@media all and (min-width: 740px) {
  body.home section.main_img .inner {
    height: 760px;
  }
  body.home section.main_img h2 {
    position: absolute;
    left: 0;
    top: 100px;
    width: 840px;
    height: 240px;
  }
  body.home section.main_img .delivery {
    left: 60px;
    bottom: -30px;
  }
  body.home section.lineup .inner {
    padding: 0 40px !important;
  }
  body.home section.lineup .inner:after {
    display: block;
    content: "";
    clear: both;
  }
  body.home section.lineup div.goods {
    float: left;
    width: 700px;
  }
  body.home section.lineup div.goods a {
    -webkit-transition: opacity 0.4s;
    transition: opacity 0.4s;
  }
  body.home section.lineup div.goods a:hover {
    opacity: 0.8;
  }
  body.home section.lineup div.maker {
    float: right;
    margin-top: 20px;
    width: 400px;
  }
  body.home section.lineup div.maker a {
    -webkit-transition: opacity 0.4s;
    transition: opacity 0.4s;
  }
  body.home section.lineup div.maker a:hover {
    opacity: 0.8;
  }
  body.home section.goods {
    padding-top: 100px;
    background: transparent url(img/home/goods_bg.png) no-repeat right 200px;
    background-attachment: fixed;
  }
  body.home section.goods .inner {
    width: 1040px !important;
    min-width: 980px !important;
  }
  body.home section.goods .inner:after {
    display: block;
    content: "";
    clear: both;
  }
  body.home section.goods a:hover {
    color: #db0505;
    -webkit-transition: border-color 0.4s;
    transition: border-color 0.4s;
  }
  body.home section.goods .basic,
  body.home section.goods .pickup {
    float: left;
    width: 50%;
  }
  body.home section.goods .basic {
    padding-right: 30px;
  }
  body.home section.goods .pickup {
    padding-left: 30px;
  }
  body.home section.topics ul:after {
    display: block;
    content: "";
    clear: both;
  }
  body.home section.topics li {
    float: left;
    margin-bottom: 40px;
    padding: 5px;
    width: 33.33333%;
  }
  body.home section.topics li:nth-child(3n+1) {
    clear: both;
  }
  body.home section.topics li a {
    position: relative;
  }
  body.home section.topics li a .image {
    display: block;
    margin-bottom: 5px;
    padding-top: 50%;
    background: transparent no-repeat center center;
    background-size: contain;
    -webkit-transition: opacity 0.4s;
    transition: opacity 0.4s;
  }
  body.home section.topics li a.new:after {
    position: absolute;
    left: 0;
    top: 5px;
    display: block;
    content: "";
    width: 40px;
    height: 40px;
    background: transparent url(img/home/topics_new.png) no-repeat left top;
    background-size: contain;
  }
  body.home section.topics li a:hover {
    color: #db0505;
  }
  body.home section.topics li a:hover .image {
    opacity: 0.8;
  }
  body.home section.deliverry {
    padding-bottom: 0;
  }
  body.home section.deliverry .inner:after {
    display: block;
    content: "";
    clear: both;
  }
  body.home section.deliverry .information,
  body.home section.deliverry .map {
    float: left;
    width: 50%;
    aspect-ratio: 640/480;
  }
  body.home section.deliverry .information .frame {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    padding: 30px;
    width: 500px;
  }
  body.home section.deliverry .information .frame a {
    min-width: 300px;
    font-size: 1.35714rem;
    -webkit-transition: color 0.4s, background-color 0.4s;
    transition: color 0.4s, background-color 0.4s;
  }
  body.home section.deliverry .information .frame a:after {
    -webkit-transition: opacity 0.4s;
    transition: opacity 0.4s;
  }
  body.home section.deliverry .information .frame a:hover {
    color: #db0505;
    background-color: #fff;
  }
  body.home section.deliverry .information .frame a:hover:after {
    opacity: 1;
  }
  body.home section.maker {
    padding-top: 120px;
    background: transparent url(img/home/maker_bg.png) no-repeat left 300px;
    background-attachment: fixed;
  }
  body.home section.maker h3 span {
    font-size: 1.5rem;
  }
  body.home section.maker ul {
    margin: 0 auto;
    width: 980px;
  }
  body.home section.maker ul a {
    -webkit-transition: opacity 0.4s;
    transition: opacity 0.4s;
  }
  body.home section.maker ul a:hover {
    opacity: 0.6;
  }
  body.home section.lunch .container a {
    min-width: 300px;
    font-size: 1.42857rem;
    -webkit-transition: color 0.4s, background-color 0.4s;
    transition: color 0.4s, background-color 0.4s;
  }
  body.home section.lunch .container a:after {
    -webkit-transition: opacity 0.4s;
    transition: opacity 0.4s;
  }
  body.home section.lunch .container a:hover {
    color: #db0505;
    background-color: #fff;
  }
  body.home section.lunch .container a:hover:after {
    opacity: 1;
  }
}

@media only screen and (max-width: 739px) {
  body.home section.main_img .inner {
    height: 350px;
  }
  body.home section.main_img h2 {
    position: absolute;
    left: 10%;
    top: 50%;
    width: 80%;
    margin-top: -21.42857%;
    padding-top: 28.57143%;
  }
  body.home section.main_img .delivery {
    left: 50%;
    margin-left: -140px;
    bottom: -180px;
    width: 280px;
  }
  body.home section.lineup div.goods {
    margin-bottom: 40px;
  }
  body.home section.lineup div.maker {
    padding: 30px 10px 20px;
  }
  body.home section.lineup div.maker h3 {
    margin: 0 10px;
  }
  body.home section.lineup .more a {
    min-width: 260px;
    font-size: 1rem;
  }
  body.home section.goods {
    padding-top: 80px;
    padding-bottom: 10px;
  }
  body.home section.goods h3 {
    margin-left: 10px;
    margin-right: 10px;
    width: auto;
  }
  body.home section.goods .basic {
    margin-bottom: 30px;
  }
  body.home section.topics ul {
    margin-bottom: 20px;
  }
  body.home section.topics li a {
    padding: 10px 0;
  }
  body.home section.topics li a.new .date::after {
    display: inline-block;
    content: "NEW";
    margin-left: 10px;
    padding: 0 5px;
    color: #fff;
    font-size: 0.85714rem;
    background-color: #db0505;
  }
  body.home section.deliverry {
    padding-top: 220px;
  }
  body.home section.deliverry .information {
    padding: 30px 0;
  }
  body.home section.deliverry .information .frame {
    margin: 0 auto;
    padding: 30px 10px 20px;
    max-width: 360px;
  }
  body.home section.deliverry .information .frame p {
    width: 90%;
    font-size: 1rem;
  }
  body.home section.deliverry .information .frame a {
    min-width: 260px;
    font-size: 1rem;
  }
  body.home section.deliverry .map {
    margin-bottom: 20px;
    padding-top: 80%;
  }
  body.home section.maker {
    margin-left: 10px;
    margin-right: 10px;
    padding-bottom: 40px;
  }
  body.home section.maker h3 span {
    font-size: 1.28571rem;
  }
  body.home section.lunch {
    padding-bottom: 80px;
  }
  body.home section.lunch .container {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }
  body.home section.lunch .container .image img {
    width: 306px;
  }
  body.home section.lunch .container .text {
    font-size: 1.14286rem;
  }
  body.home section.lunch .container .more {
    margin-top: 70px;
  }
  body.home section.lunch .container a {
    min-width: 260px;
    font-size: 1rem;
  }
}

/* --------------------------------------------------
	10. Lineup
-------------------------------------------------- */
body.lineup #content:before {
  background-image: url(img/lineup/title_bg.jpg);
}

body.lineup article h2.image {
  background-image: url(img/lineup/title.png);
}

article.lineup div.goods ul:after {
  display: block;
  content: "";
  clear: both;
}

article.lineup div.goods li {
  float: left;
  padding: 10px;
  width: 25%;
}

article.lineup div.goods li:nth-child(4n+1) {
  clear: both;
}

article.lineup div.goods li a {
  display: block;
  overflow: hidden;
  color: transparent;
  text-decoration: none;
  text-indent: 110%;
  white-space: nowrap;
  font-size: 0;
  position: relative;
}

article.lineup div.goods li a:before {
  display: block;
  content: "";
  padding-top: 100%;
  background: #edfdfc no-repeat center center;
  background-size: contain;
  border-radius: 50%;
}

article.lineup div.goods li a:after {
  display: none;
}

article.lineup div.goods li a.popular:after, article.lineup div.goods li a.pickup:after {
  position: absolute;
  right: 0;
  top: 0;
  display: block;
  content: "";
  width: 29.41176%;
  padding-top: 29.41176%;
  background: transparent no-repeat center center;
  background-size: contain;
}

article.lineup div.goods li a.popular:after {
  background-image: url(img/home/lineup_goods_popular.png);
}

article.lineup div.goods li a.pickup:after {
  background-image: url(img/home/lineup_goods_pickup.png);
}

article.lineup div.goods li.milk a:before {
  background-image: url(img/home/lineup_goods_milk.png);
}

article.lineup div.goods li.pudding a:before {
  background-image: url(img/home/lineup_goods_pudding.png);
}

article.lineup div.goods li.functional a:before {
  background-image: url(img/home/lineup_goods_functional.png);
}

article.lineup div.goods li.health a:before {
  background-image: url(img/home/lineup_goods_health.png);
}

article.lineup div.goods li.kids a:before {
  background-image: url(img/home/lineup_goods_kids.png);
}

article.lineup div.goods li.nursing a:before {
  background-image: url(img/home/lineup_goods_nursing.png);
}

article.lineup div.goods li.hospital a:before {
  background-image: url(img/home/lineup_goods_hospital.png);
}

article.lineup div.goods li.shop a:before {
  background-image: url(img/home/lineup_goods_shop.png);
}

article.lineup section ul.goods li {
  padding: 0 10px;
}

article.lineup section ul.goods li .image a::after {
  display: none !important;
}

article.lineup section ul.goods li .name {
  margin-bottom: 10px;
  font-size: 1.14286rem;
}

article.lineup section ul.goods li .comment {
  margin-bottom: 10px;
}

@media all and (min-width: 740px) {
  body.lineup #header nav.menu .nav li.lineup a:after {
    opacity: 1;
  }
  body.lineup article h2.image {
    margin-top: -120px;
    width: 360px;
    height: 180px;
  }
  article.lineup div.goods {
    padding-top: 60px;
  }
  article.lineup div.goods li a:before {
    -webkit-transition: background-color 0.4s;
    transition: background-color 0.4s;
  }
  article.lineup div.goods li a:hover:before {
    background-color: #c0f7f3;
  }
  article.lineup section ul.goods:after {
    display: block;
    content: "";
    clear: both;
  }
  article.lineup section ul.goods li {
    float: left;
    width: 33.33333%;
  }
}

@media only screen and (max-width: 739px) {
  body.lineup article h2.image {
    margin-top: -90px;
    width: 270px;
    height: 135px;
  }
  article.lineup div.goods {
    padding-top: 30px;
  }
  article.lineup section ul.goods li {
    margin-bottom: 40px;
  }
}

/* --------------------------------------------------
	11. Dietician
-------------------------------------------------- */
body.dietician #content:before {
  background-image: url(img/dietician/title_bg.jpg);
}

body.dietician article h2.image {
  background-image: url(img/dietician/title.png);
}

article.dietician section.yogurt_functionality .goods {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

article.dietician section.yogurt_functionality .goods li {
  text-align: center;
}

@media all and (min-width: 740px) {
  body.dietician #header nav.menu .nav li.dietician a:after {
    opacity: 1;
  }
  body.dietician article h2.image {
    margin-top: -120px;
    width: 360px;
    height: 180px;
  }
  article.dietician section.goods ul.goods {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: distribute;
    justify-content: space-around;
  }
  article.dietician section.goods ul.goods li {
    width: 350px;
  }
  article.dietician section.goods ul.goods .image {
    margin-bottom: 2em;
  }
  article.dietician section.yogurt_functionality .goods li {
    width: 25%;
  }
}

@media only screen and (max-width: 739px) {
  body.dietician article h2.image {
    margin-top: -90px;
    width: 270px;
    height: 135px;
  }
  article.dietician section.goods ul.goods li + li {
    padding-top: 2em;
  }
  article.dietician section.goods ul.goods .image {
    margin-bottom: 1em;
  }
  article.dietician section.yogurt_functionality .goods {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
  article.dietician section.yogurt_functionality .goods li {
    width: 50%;
  }
}

/* --------------------------------------------------
	12. Wholesale
-------------------------------------------------- */
body.wholesale #content:before {
  background-image: url(img/wholesale/title_bg.jpg);
}

body.wholesale article h2.image {
  background-image: url(img/wholesale/title.png);
}

@media all and (min-width: 740px) {
  body.wholesale #header nav.menu .nav li.wholesale a:after {
    opacity: 1;
  }
  body.wholesale article h2.image {
    margin-top: -120px;
    width: 360px;
    height: 180px;
  }
  article.wholesale section .content:after {
    display: block;
    content: "";
    clear: both;
  }
  article.wholesale section .content.right .image {
    float: right;
    width: 350px;
  }
  article.wholesale section .content.right p {
    float: left;
    width: calc(100% - 390px);
  }
  article.wholesale section .content.left .image {
    float: left;
    width: 350px;
  }
  article.wholesale section .content.left p {
    float: right;
    width: calc(100% - 390px);
  }
}

@media only screen and (max-width: 739px) {
  body.wholesale article h2.image {
    margin-top: -90px;
    width: 270px;
    height: 135px;
  }
  article.wholesale section .content .image {
    margin-bottom: 1em;
  }
}

/* --------------------------------------------------
	13. Retail
-------------------------------------------------- */
body.retail #content:before {
  background-image: url(img/retail/title_bg.jpg);
}

body.retail article h2.image {
  background-image: url(img/retail/title.png);
}

article.retail .support {
  margin: 0 auto !important;
  padding: 2em 1em 0 2em;
  max-width: 400px;
}

article.retail .flow {
  padding-top: 2em;
}

article.retail .flow .step li,
article.retail .flow .next li {
  margin-bottom: 1em;
  text-align: center;
}

article.retail .flow .step li p,
article.retail .flow .next li p {
  padding-top: .5em;
}

article.retail .flow .step li p {
  text-align: left;
}

article.retail .flow .images li {
  text-align: center;
}

article.retail .flow dl {
  margin: 2em 0;
  border: 2px solid #6aa0ba;
  border-radius: 6px;
}

article.retail .flow dl dt {
  padding: 1em;
  color: #fff;
  background-color: #84c8e9;
}

article.retail .flow dl dd {
  margin-left: 0;
  padding: 1em;
}

article.retail section.capacity .goods {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

article.retail section.capacity .goods li {
  text-align: center;
}

@media all and (min-width: 740px) {
  body.retail #header nav.menu .nav li.retail a:after {
    opacity: 1;
  }
  body.retail article h2.image {
    margin-top: -120px;
    width: 360px;
    height: 180px;
  }
  article.retail .support {
    max-width: 450px;
    font-size: 1.14286rem;
  }
  article.retail .flow .step,
  article.retail .flow .next {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-pack: distribute;
    justify-content: space-around;
  }
  article.retail .flow .step li {
    width: 27.5%;
  }
  article.retail .flow .next li {
    width: 22.5%;
  }
  article.retail .flow .images {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: distribute;
    justify-content: space-around;
  }
  article.retail .flow .images li {
    width: 45%;
  }
  article.retail section .content:after {
    display: block;
    content: "";
    clear: both;
  }
  article.retail section .content.right .image {
    float: right;
    width: 350px;
  }
  article.retail section .content.right p {
    float: left;
    width: calc(100% - 390px);
  }
  article.retail section .content.left .image {
    float: left;
    width: 350px;
  }
  article.retail section .content.left p {
    float: right;
    width: calc(100% - 390px);
  }
  article.retail section.capacity .goods li {
    width: 20%;
  }
}

@media only screen and (max-width: 739px) {
  body.retail article h2.image {
    margin-top: -90px;
    width: 270px;
    height: 135px;
  }
  article.retail section .content .image {
    margin-bottom: 1em;
  }
  article.retail section.capacity .goods {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
  article.retail section.capacity .goods li {
    width: 50%;
  }
}

/* --------------------------------------------------
	14. About
-------------------------------------------------- */
body.about #content:before {
  background-image: url(img/about/title_bg.jpg);
}

body.about article h2.image {
  background-image: url(img/about/title.png);
}

article.about section.corporate .message {
  font-weight: bold;
  text-align: center;
}

article.about section.corporate .support {
  margin: 0 auto !important;
  padding: 2em 1em 0 2em;
  max-width: 400px;
}

@media all and (min-width: 740px) {
  body.about #header nav.menu .nav li.about a:after {
    opacity: 1;
  }
  body.about article h2.image {
    margin-top: -120px;
    width: 360px;
    height: 180px;
  }
  article.about section.corporate .message {
    font-size: 2.57143rem;
  }
  article.about section.corporate .support {
    max-width: 450px;
    font-size: 1.14286rem;
  }
}

@media only screen and (max-width: 739px) {
  body.about article h2.image {
    margin-top: -90px;
    width: 270px;
    height: 135px;
  }
  article.about section.corporate .message {
    font-size: 4.44444vw;
  }
}

/* --------------------------------------------------
	15. Topics
-------------------------------------------------- */
body.topics #content:before {
  background-image: url(img/topics/title_bg.jpg);
}

body.topics article h2.image {
  background-image: url(img/topics/title.png);
}

article.topics section.list .list li a {
  display: block;
  color: #333;
  text-decoration: none;
  border-bottom: 1px solid rgba(51, 51, 51, 0.5);
}

article.topics section.list .list li a .date {
  color: #db0505;
  font-weight: bold;
}

article.topics section.list .list li a .title {
  display: block;
  margin-bottom: .5em;
}

article.topics section.detail > .date span {
  display: inline-block;
  margin-bottom: 2em;
  padding: 0 10px;
  color: #fff;
  background-color: #db0505;
}

article.topics section.detail > .content:after {
  display: block;
  content: "";
  clear: both;
}

article.topics section.detail > .link {
  padding-top: 2em;
  text-align: center;
}

article.topics section.detail > .link a {
  padding: 10px 50px;
  min-width: 240px;
  font-size: 14px;
}

@media all and (min-width: 740px) {
  body.topics article h2.image {
    margin-top: -120px;
    width: 360px;
    height: 180px;
  }
  article.topics section.list .list:after {
    display: block;
    content: "";
    clear: both;
  }
  article.topics section.list .list li {
    float: left;
    margin-bottom: 40px;
    padding: 5px;
    width: 33.33333%;
  }
  article.topics section.list .list li:nth-child(3n+1) {
    clear: both;
  }
  article.topics section.list .list li a {
    position: relative;
  }
  article.topics section.list .list li a .image {
    display: block;
    margin-bottom: 5px;
    padding-top: 50%;
    background: transparent no-repeat center center;
    background-size: contain;
    -webkit-transition: opacity 0.4s;
    transition: opacity 0.4s;
  }
  article.topics section.list .list li a.new:after {
    position: absolute;
    left: 0;
    top: 5px;
    display: block;
    content: "";
    width: 40px;
    height: 40px;
    background: transparent url(img/home/topics_new.png) no-repeat left top;
    background-size: contain;
  }
  article.topics section.list .list li a:hover {
    color: #db0505;
  }
  article.topics section.list .list li a:hover .image {
    opacity: 0.8;
  }
}

@media only screen and (max-width: 739px) {
  body.topics article h2.image {
    margin-top: -90px;
    width: 270px;
    height: 135px;
  }
  article.topics section.list .list {
    margin-bottom: 20px;
  }
  article.topics section.list .list li a {
    padding: 10px 0;
  }
  article.topics section.list .list li a.new .date::after {
    display: inline-block;
    content: "NEW";
    margin-left: 10px;
    padding: 0 5px;
    color: #fff;
    font-size: 0.85714rem;
    background-color: #db0505;
  }
}

/* --------------------------------------------------
	16. Contact
-------------------------------------------------- */
body.contact #content:before {
  background-image: url(img/contact/title_bg.jpg);
}

body.contact article h2.image {
  background-image: url(img/contact/title.png);
}

article.contact section.tel .tel {
  font-weight: bold;
  font-size: 2.28571rem;
  text-align: center;
}

article.contact section.tel .date {
  margin: 0 auto;
  width: 13em;
}

article.contact section.tel .date:after {
  display: block;
  content: "";
  clear: both;
}

article.contact section.tel .date dt {
  clear: both;
  float: left;
  width: 4em;
  color: #333;
}

article.contact section.tel .date dd {
  float: left;
  width: 8em;
}

article.contact section.mail .required {
  margin-left: 1em;
  color: #db0505;
}

article.contact section.mail .wpcf7-list-item-label {
  cursor: pointer;
}

article.contact section.mail input[name="your-zip"] {
  width: 8em;
}

article.contact section.mail input[name="your-tel"] {
  width: 10em;
}

article.contact section.mail textarea {
  width: 90%;
}

article.contact section.mail .form-button {
  text-align: center;
}

article.contact section.mail .form-button .wpcf7-submit {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  margin: 10px 0;
  padding: 10px 50px;
  color: #db0505;
  text-align: center;
  background-color: #fff;
  border: 1px solid #db0505;
  border-radius: 50px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

article.contact section.mail .form-button .wpcf7-submit[disabled] {
  color: #999999;
  border-color: #999999;
}

article.contact section.mail .form-button .wpcf7-submit:not([disabled]) {
  cursor: pointer;
}

article.contact section.mail .wpcf7 .wpcf7-not-valid-tip {
  position: static;
  display: block;
  margin-top: 0;
  padding: 0;
  width: auto;
  font-size: 14px;
  color: #c00;
  background: none;
  border: none;
  z-index: auto;
}

article.contact section.mail .wpcf7 .wpcf7-list-item {
  display: inline-block;
  vertical-align: middle;
}

article.contact section.mail .wpcf7 .wpcf7-not-valid {
  background-color: #f2dede;
}

article.contact section.mail .wpcf7 .wpcf7-response-output {
  margin: 20px 0;
  padding: 8px 30px 8px 15px;
  border-radius: 4px;
}

article.contact section.mail .wpcf7 .wpcf7-validation-errors {
  color: #b94a48;
  background-color: #f2dede;
  border-color: #eed3d7;
}

article.contact section.mail .wpcf7 .wpcf7-mail-sent-ok {
  color: #3a87ad;
  background-color: #d9edf7;
  border-color: #bce8f1;
}

article.contact section.mail .wpcf7 .wpcf7-mail-sent-ng {
  color: #b94a48;
  background-color: #f2dede;
  border-color: #eed3d7;
}

@media all and (min-width: 740px) {
  body.contact #header nav.menu .nav li.contact a:after {
    opacity: 1;
  }
  body.contact article h2.image {
    margin-top: -120px;
    width: 360px;
    height: 180px;
  }
  article.contact section.mail .form-button .wpcf7-submit {
    min-width: 240px;
    font-size: 1.14286rem;
    -webkit-transition: color 0.6s, background-color 0.6s;
    transition: color 0.6s, background-color 0.6s;
  }
  article.contact section.mail .form-button .wpcf7-submit:not([disabled]):hover {
    color: #fff;
    background-color: #db0505;
  }
}

@media only screen and (max-width: 739px) {
  body.contact article h2.image {
    margin-top: -90px;
    width: 270px;
    height: 135px;
  }
}

/* --------------------------------------------------
	17. Business Lunch
-------------------------------------------------- */
body.business-lunch #content:before {
  background-image: url(img/business-lunch/title_bg.jpg);
}

body.business-lunch article h2.image {
  background-image: url(img/business-lunch/title.png);
}

article.business-lunch section.lunch .lunch-main {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 20px;
}

article.business-lunch section.lunch .lunch-main .text {
  max-width: 440px;
  color: #333;
  font-size: 1.42857rem;
  font-weight: bold;
  line-height: 2;
}

article.business-lunch section.lunch .lunch-main .img {
  width: 320px;
}

article.business-lunch section.lunch ul.lunchset {
  max-width: 930px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 80px 20px;
}

article.business-lunch section.lunch ul.lunchset li .image {
  max-width: 230px;
  margin-bottom: 32px;
}

article.business-lunch section.lunch ul.lunchset li .name {
  font-size: 1.14286rem;
  color: #DB0505;
}

article.business-lunch section.lunch ul.lunchset li .comment {
  font-size: 1.14286rem;
}

article.business-lunch section.lunch .lunch-button {
  position: relative;
  display: inline-block;
  width: 100%;
  max-width: 355px;
  padding: 10px 50px;
  color: #fff;
  font-weight: bold;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  text-decoration: none;
  background-color: #db0505;
  border: 1px solid #db0505;
  border-radius: 50px;
}

article.business-lunch section.lunch .lunch-button:before, article.business-lunch section.lunch .lunch-button:after {
  position: absolute;
  right: 20px;
  top: 50%;
  display: block;
  content: "";
  margin-top: -5px;
  width: 10px;
  height: 10px;
  background: transparent no-repeat center center;
  background-size: contain;
}

article.business-lunch section.lunch .lunch-button:before {
  background-image: url(img/icon/arrow_white.png);
}

article.business-lunch section.lunch .lunch-button:after {
  opacity: 0;
  background-image: url(img/icon/arrow_red.png);
}

@media all and (min-width: 740px) {
  body.business-lunch #header nav.menu .nav li.about a:after {
    opacity: 1;
  }
  body.business-lunch article h2.image {
    margin-top: -120px;
    width: 360px;
    height: 180px;
  }
  article.business-lunch section.lunch .lunch-button {
    min-width: 300px;
    font-size: 1.42857rem;
    -webkit-transition: color 0.4s, background-color 0.4s;
    transition: color 0.4s, background-color 0.4s;
  }
  article.business-lunch section.lunch .lunch-button:after {
    -webkit-transition: opacity 0.4s;
    transition: opacity 0.4s;
  }
  article.business-lunch section.lunch .lunch-button:hover {
    color: #db0505;
    background-color: #fff;
  }
  article.business-lunch section.lunch .lunch-button:hover:after {
    opacity: 1;
  }
}

@media only screen and (max-width: 739px) {
  body.business-lunch article h2.image {
    margin-top: -90px;
    width: 270px;
    height: 135px;
  }
  article.business-lunch section.lunch .lunch-main {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 20px;
  }
  article.business-lunch section.lunch .lunch-main .text {
    max-width: 100%;
    font-size: 1rem;
  }
  article.business-lunch section.lunch .lunch-main .img {
    width: 100%;
    text-align: center;
  }
  article.business-lunch section.lunch ul.lunchset {
    grid-template-columns: repeat(1, 1fr);
  }
  article.business-lunch section.lunch ul.lunchset li {
    max-width: 240px;
    margin: 0 auto;
  }
  article.business-lunch section.lunch .lunch-button {
    min-width: 260px;
    font-size: 1rem;
  }
}

/* --------------------------------------------------
	98. Error
-------------------------------------------------- */
/* --------------------------------------------------
	99. WordPress
-------------------------------------------------- */
.aligncenter {
  display: block;
  margin-right: auto;
  margin-left: auto;
}

.alignleft {
  float: left;
}

.alignright {
  float: right;
}

img.aligncenter {
  margin: 0 auto 1.5em;
}

img.alignleft {
  margin: 0 1.5em 1em 0;
}

img.alignright {
  margin: 0 0 1em 1.5em;
}