@charset "UTF-8";
/* http://meyerweb.com/eric/tools/css/reset/  v2.0 | 20110126 License: none (public domain)
*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

body { line-height: 1; }

ol, ul { list-style: none; }

blockquote, q { quotes: none; }

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

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

html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td, figure, figcaption { margin: 0; padding: 0; }

html { font-size: 62.5%; -webkit-tap-highlight-color: rgba(148, 34, 67, 0.1); height: 100%; -ms-touch-action: manipulation; -webkit-text-size-adjust: 100%; }

html, body { width: 100%; -webkit-font-smoothing: antialiased; }

body { font-size: 10px; font-size: 1.0rem; font-weight: 300; line-height: 1; color: #000; min-height: 100%; background: #fff; position: relative; -webkit-animation: opacityAnime 0.5s ease 0.1s; -moz-animation: opacityAnime 0.5s ease 0.1s; animation: opacityAnime 0.5s ease 0.1s; -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both; animation-fill-mode: both; }

@-webkit-keyframes opacityAnime { 0% { opacity: 0; }
  100% { opacity: 1; } }
@-moz-keyframes opacityAnime { 0% { opacity: 0; }
  100% { opacity: 1; } }
@keyframes opacityAnime { 0% { opacity: 0; }
  100% { opacity: 1; } }
#main, section { display: block; position: relative; }

#oldBrowser { position: fixed; top: 0; left: 0; width: 100%; background: rgba(97, 97, 97, 0.8); color: #fff; font-size: 10px; letter-spacing: 0.04em; line-height: 1.2; text-align: center; padding: 1px 10px; z-index: 9999999; }

a { color: #6594fa; -webkit-tap-highlight-color: rgba(78, 196, 197, 0.2); }

a:hover { color: #6fa3ff; text-decoration: underline; }

* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; }

#container.is-scroll { position: fixed; }

.spOnly { display: block; }

.spTabOnly { display: none; }

.pcOnly { display: none; }

.pcTabOnly { display: none; }

#container { position: relative; width: 100%; }

@media screen and (min-width: 0px) and (max-width: 479px) { #container { max-width: 479px; min-width: 300px; } }
@media screen and (min-width: 478px) and (max-width: 767px) { #container { max-width: 767px; } }
@media print, screen and (min-width: 768px) { #container { min-width: 768px; }
  .tabOnly { display: block; }
  .pcTabOnly { display: block; }
  .spTabOnly { display: block; }
  .spOnly { display: none; } }
@media print, screen and (min-width: 769px) { #container { min-width: 769px; }
  .spTabOnly { display: none; } }
/*
// screen for tablet landscape and desktop
@media print, screen and (min-width: 959px) and (max-width: 1024px) { #container{ max-width:1024px; }
}
// screen for desktop
@media print, screen and (min-width: 1025px) { #container{ max-width:1365px; } .tabOnly{ display: none; } .pcOnly{ display: block; }
}
// screen for desktop wide
@media print, screen and(min-width: 1366px) { #container{ max-width:100%; }
}
*/
img { vertical-align: bottom; }

/* item align
------------------------------------------------------------------------------------------------------------- */
.layoutAlign-left { text-align: left !important; }

.layoutAlign-center { text-align: center !important; }

.layoutAlign-right { text-align: right !important; }

.layoutVertical-top, .layoutVertical-top th, .layoutVertical-top td { vertical-align: top !important; }

.layoutVertical-middle, .layoutVertical-middle th, .layoutVertical-middle td { vertical-align: middle !important; }

.layoutVertical-bottom, .layoutVertical-bottom th, .layoutVertical-bottom td { vertical-align: bottom !important; }

/* width height
------------------------------------------------------------------------------------------------------------- */
.width-auto { width: auto !important; }

.width-100 { width: 100% !important; }

/* display
------------------------------------------------------------------------------------------------------------- */
.layoutDisplay-inline { display: inline !important; }

.layoutDisplay-inlineBlock { display: inline-block !important; }

.layoutDisplay-table { display: table !important; }
.layoutDisplay-table > div { display: table-cell; }

/* item is
------------------------------------------------------------------------------------------------------------- */
.is-visible { display: block !important; }

.is-hidden { display: none !important; }

@font-face { font-family: 'Noto Sans Japanese'; font-style: normal; font-weight: 200; src: url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Light.woff2) format("woff2"), url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Light.woff) format("woff"), url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Light.otf) format("opentype"); }
@font-face { font-family: 'Noto Sans Japanese'; font-style: normal; font-weight: 300; src: local("NotoSansJP-DemiLight.otf"), url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-DemiLight.woff2) format("woff2"), url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-DemiLight.woff) format("woff"), url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-DemiLight.otf) format("opentype"); }
@font-face { font-family: 'Noto Sans Japanese'; font-style: normal; font-weight: 500; src: url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Medium.woff2) format("woff2"), url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Medium.woff) format("woff"), url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Medium.otf) format("opentype"); }
@font-face { font-family: 'Noto Sans Japanese'; font-style: normal; font-weight: 700; src: url(//fonts.gstatic.com/ea/notosansjapanese/v3/NotoSansJP-Bold.woff2) format("woff2"), url(//fonts.gstatic.com/ea/notosansjapanese/v3/NotoSansJP-Bold.woff) format("woff"), url(//fonts.gstatic.com/ea/notosansjapanese/v3/NotoSansJP-Bold.otf) format("opentype"); }
body { font-family: 'Noto Sans Japanese',"游ゴシック体", "Yu Gothic", YuGothic,"ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" , Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif; }

.txtE { font-family: 'Poiret One', sans-serif; }

body { padding: 0 10px; background: url(../img/body_bg.png) repeat left top; background-size: 387px auto; }

#container { margin: 0 auto; max-width: 972px; width: 100%; position: relative; }

#contentsWrap { background: url(../img/contents_bg.png) repeat left top; background-size: 34px auto; border: #f3b693 solid 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; border-radius: 3px; }

@media (min-width: 767px) { body { padding: 0 10px; background: url(../img/body_bg.png) repeat left top; background-size: 774px auto; }
  #contentsWrap { background: url(../img/contents_bg.png) repeat left top; background-size: 68px auto; border: #f3b693 solid 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; border-radius: 6px; } }
header { display: block; position: relative; width: 100%; height: 34px; text-align: left; }

.logoWatabe { position: absolute; left: 3px; top: 10px; display: block; width: 100px; height: 24px; z-index: 9999; cursor: pointer; }

.no-svg .logoWatabe { background: url(../img/logo_watabe.png) no-repeat left top; background-size: contain; }

.no-svg .logoWatabe img { display: none; }

@media (min-width: 767px) { header { height: 68px; }
  .logoWatabe { left: 6px; top: 20px; width: 180px; height: 34px; } }
footer { padding: 10px 0 40px; position: relative; display: block; text-align: center; font-size: 10px; font-size: 1.0rem; letter-spacing: 0.1em; color: #6e3f23; }

@media (min-width: 767px) { footer { padding: 20px 0 100px; font-size: 14px; font-size: 1.4rem; letter-spacing: 0.1em; } }
@-webkit-keyframes view01 { 0% { opacity: 0; filter: alpha(opacity=0); }
  100% { opacity: 1; filter: alpha(opacity=100); } }
@-moz-keyframes view01 { 0% { opacity: 0; filter: alpha(opacity=0); }
  100% { opacity: 1; filter: alpha(opacity=100); } }
@keyframes view01 { 0% { opacity: 0; filter: alpha(opacity=0); }
  100% { opacity: 1; filter: alpha(opacity=100); } }
#titleWrap img { max-width: 960px; width: 100%; height: auto; }

.section { position: relative; }
.section .picView { position: absolute; left: 0; top: 0; }
.section img { max-width: 944px; width: 100%; height: auto; }

#sec01, #sec02, #sec03 { padding: 3px 3px 0; }

#sec04 { padding: 3px; }

@media (min-width: 767px) { #sec01, #sec02, #sec03 { padding: 7px 7px 0; }
  #sec04 { padding: 7px; } }
#sec01.is-viewOn .picView01 { -webkit-animation: view01 1s cubic-bezier(0.27, 1.19, 1, 0.97) 0.2s; -moz-animation: view01 1s cubic-bezier(0.27, 1.19, 1, 0.97) 0.2s; animation: view01 1s cubic-bezier(0.27, 1.19, 1, 0.97) 0.2s; -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both; animation-fill-mode: both; }
#sec01.is-viewOn .picView02 { -webkit-animation: view01 1s cubic-bezier(0.27, 1.19, 1, 0.97) 0.6s; -moz-animation: view01 1s cubic-bezier(0.27, 1.19, 1, 0.97) 0.6s; animation: view01 1s cubic-bezier(0.27, 1.19, 1, 0.97) 0.6s; -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both; animation-fill-mode: both; }

#sec02.is-viewOn .picView01 { -webkit-animation: view01 1s cubic-bezier(0.27, 1.19, 1, 0.97) 0.2s; -moz-animation: view01 1s cubic-bezier(0.27, 1.19, 1, 0.97) 0.2s; animation: view01 1s cubic-bezier(0.27, 1.19, 1, 0.97) 0.2s; -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both; animation-fill-mode: both; }

#sec03.is-viewOn .picView01 { -webkit-animation: view01 1s cubic-bezier(0.27, 1.19, 1, 0.97) 0.2s; -moz-animation: view01 1s cubic-bezier(0.27, 1.19, 1, 0.97) 0.2s; animation: view01 1s cubic-bezier(0.27, 1.19, 1, 0.97) 0.2s; -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both; animation-fill-mode: both; }
#sec03.is-viewOn .picView02 { -webkit-animation: view01 1s cubic-bezier(0.27, 1.19, 1, 0.97) 0.7s; -moz-animation: view01 1s cubic-bezier(0.27, 1.19, 1, 0.97) 0.7s; animation: view01 1s cubic-bezier(0.27, 1.19, 1, 0.97) 0.7s; -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both; animation-fill-mode: both; }

#sec04.is-viewOn .picView01 { -webkit-animation: view01 1s cubic-bezier(0.27, 1.19, 1, 0.97) 0.2s; -moz-animation: view01 1s cubic-bezier(0.27, 1.19, 1, 0.97) 0.2s; animation: view01 1s cubic-bezier(0.27, 1.19, 1, 0.97) 0.2s; -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both; animation-fill-mode: both; }
#sec04.is-viewOn .picView02 { -webkit-animation: view01 1s cubic-bezier(0.27, 1.19, 1, 0.97) 0.7s; -moz-animation: view01 1s cubic-bezier(0.27, 1.19, 1, 0.97) 0.7s; animation: view01 1s cubic-bezier(0.27, 1.19, 1, 0.97) 0.7s; -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both; animation-fill-mode: both; }

/*# sourceMappingURL=main.css.map */