/**
Theme Name: CSS
Author: Hitoshi Sasaki
Version: 1.00
**/
img { border:0; }
html,body  { margin: 0; padding: 16px 0; font-family:"Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif; overflow-x:hidden;}
header,footer,section { width:100%; max-width:842px; margin:0 auto; }
footer { text-align:center; font-size:14px; padding:6px 0; }
footer strong { font-size:16px;  }
section { padding:32px; box-sizing: border-box; }
h1 { margin:0; padding:0; }
h1 img { vertical-align:bottom; }
h2 { margin:0; padding:0; text-align:center; background:url("images/box_bk.png") repeat 0 0; color:#45B035; }

.flexBox { display:flex; justify-content: space-between; }

#aboutImg { padding:32px; }
#aboutBox { width:540px; }
#aboutBox h3 { color:#ED6C00; font-size:32px; margin:0; padding:0; }

section.ctsBox { background:url("images/box_bk.png") repeat 0 0; }
section.ctsBox h3 { font-size:20px; text-align:center; color:#45B035; margin:0; padding:0; }

.howToBox { background-color:#FFF; border-radius:6px; box-shadow: 6px 6px 6px rgba(0,0,0,0.6); width:760px; margin:14px auto 32px; padding:24px; box-sizing:border-box; display:flex; }
.caption { font-size:12px; padding-left:24px; }
.recipebox h4 { color:#ED6C00; background:url("images/h4_bk.png") no-repeat left bottom; margin:0; padding:0 0 12px 24px; font-size:24px; }
.recipebox ol { font-size:14px; }

.supplement { font-size:13px; margin:0 24px; padding-left:1em; text-indent:-1em; }

@media screen and ( max-width:842px ) {
  h1 img { width:100%; height:auto; }
  h2 { font-size:3.2vw; }
  .flexBox { display:block; }

  #aboutImg { padding:0; text-align:center; width:100%; box-sizing: border-box; }
  #aboutBox { width:100%; box-sizing: border-box; margin:0; padding:0;  }
    #aboutBox h3 { font-size:5.4vw; text-align:center; }
    #aboutBox img { width:100%; height: auto; }

  section.ctsBox {  }
  section.ctsBox h3 { font-size:3.6vw; }
  .howToBox { width:100%; display:block; overflow:hidden;  }
  .howToimg { text-align:center; }
  .howToimg img { width:100%; max-width:291px; height:auto; }
  .caption { padding-left:0; }
  .recipebox h4 { margin:0; padding:0 0 12px 0; font-size:4.0vw; }
  .recipebox ol { margin:14px 1em; padding:0; }
  .supplement { font-size:3.0vw; margin:0; }
}