.wrapper { background: #fff; }

sub { vertical-align: sub; font-size: 10px; }

.keep { word-break: keep-all; display: inline; }

header:before { background-color: #000; opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; }

header { width: 100%; height: 210px; position: relative; background: #000; }

header:before { content: ''; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; background-color: #000; opacity: 0.6; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; }

header .header__logo { position: absolute; -webkit-transition: all .3s ease-in-out 0s; transition: all .3s ease-in-out 0s; }

header .header__logo:hover { opacity: 0.6; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; }

header .header__logo--webcg { position: absolute; top: 28px; right: auto; bottom: auto; left: 29px; }

header .header__logo--jaguar { position: absolute; top: auto; right: 28px; bottom: 29px; left: auto; }

header h1 { width: 372px; margin: 0 auto; padding: 57px 0 0; position: relative; -webkit-transition: all .3s ease-in-out 0s; transition: all .3s ease-in-out 0s; }

header h1:hover { opacity: 0.6; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; }

header ul.header__sns { position: absolute; top: 26px; right: 15px; bottom: auto; left: auto; letter-spacing: -.4em; }

header ul.header__sns li.sns-btn { display: inline-block; margin: 0 13px 0 0; }

header ul.header__sns li.sns-btn a { -webkit-transition: all .3s ease-in-out 0s; transition: all .3s ease-in-out 0s; display: inline-block; }

header ul.header__sns li.sns-btn:hover a { opacity: 0.6; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; }

header .header__menu { width: 50px; height: 50px; position: absolute; top: auto; right: auto; bottom: 29px; left: 29px; background: #a11931; cursor: pointer; -webkit-transition: all .3s ease-in-out 0s; transition: all .3s ease-in-out 0s; }

header .header__menu:hover { background: #c13951; }

header .header__menu span.menu-bar { width: 14px; height: 2px; position: absolute; left: 18px; background: #fff; }

header .header__menu span.menu-bar--01 { top: 17px; }

header .header__menu span.menu-bar--02 { top: 24px; }

header .header__menu span.menu-bar--03 { top: 31px; }

footer { background: #000; }

.thumb .img-caption { padding-top: 10px; color: #666666; font-size: 85%; line-height: 1.5; }

.thumb .img-caption span { font-size: 110%; font-weight: bold; }

@media screen and (max-width: 768px) { header { width: 100%; height: 150px; position: relative; }
  header:before { content: ''; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; background-color: #000; opacity: 0.6; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; }
  header .header__logo { display: none; }
  header h1 { width: 230px; padding: 40px 0 0; }
  header ul.header__sns { display: none; }
  header .header__menu { width: 40px; height: 40px; position: absolute; top: auto; right: auto; bottom: 0; left: 0; background: #a11931; cursor: pointer; }
  header .header__menu span.menu-bar { width: 12px; height: 2px; position: absolute; left: 14px; background: #fff; }
  header .header__menu span.menu-bar--01 { top: 14px; }
  header .header__menu span.menu-bar--02 { top: 19px; }
  header .header__menu span.menu-bar--03 { top: 24px; }
  footer { background: #000; } }