@charset "utf-8";
@import 'https://fonts.googleapis.com/css?family=Cabin:500,600,700';
@import 'https://fonts.googleapis.com/css?family=Open+Sans:700';

@font-face { font-family: "HWYGEXPD"; font-style: normal; src: url("../fonts/HWYGEXPD.eot"); src: url("../fonts/HWYGEXPD.eot?#iefix") format("embedded-opentype"), url("../fonts/HWYGEXPD.woff") format("woff"), url("../fonts/HWYGEXPD.ttf") format("truetype"); }

@font-face { font-family: "NotoSansCJKjp"; font-style: normal; font-weight: 300; src: url("../fonts/NotoSansCJKjp-DemiLight.eot"); src: url("../fonts/NotoSansCJKjp-DemiLight.eot?#iefix") format("embedded-opentype"), url("../fonts/NotoSansCJKjp-DemiLight.woff") format("woff"), url("../fonts/NotoSansCJKjp-DemiLight.ttf") format("truetype"); }

@font-face { font-family: "NotoSansCJKjp"; font-style: normal; font-weight: 400; src: url("../fonts/NotoSansCJKjp-Regular.eot"); src: url("../fonts/NotoSansCJKjp-Regular.eot?#iefix") format("embedded-opentype"), url("../fonts/NotoSansCJKjp-Regular.woff") format("woff"), url("../fonts/NotoSansCJKjp-Regular.ttf") format("truetype"); }

@font-face { font-family: "NotoSansCJKjp"; font-style: normal; font-weight: 500; src: url("../fonts/NotoSansCJKjp-Medium.eot"); src: url("../fonts/NotoSansCJKjp-Medium.eot?#iefix") format("embedded-opentype"), url("../fonts/NotoSansCJKjp-Medium.woff") format("woff"), url("../fonts/NotoSansCJKjp-Medium.ttf") format("truetype"); }

@font-face { font-family: "NotoSansCJKjp"; font-style: normal; font-weight: 700; src: url("../fonts/NotoSansCJKjp-Bold.eot"); src: url("../fonts/NotoSansCJKjp-Bold.eot?#iefix") format("embedded-opentype"), url("../fonts/NotoSansCJKjp-Bold.woff") format("woff"), url("../fonts/NotoSansCJKjp-Bold.ttf") format("truetype"); }

@font-face { font-family: "NotoSansCJKjp"; font-style: normal; font-weight: 900; src: url("../fonts/NotoSansCJKjp-Black.eot"); src: url("../fonts/NotoSansCJKjp-Black.eot?#iefix") format("embedded-opentype"), url("../fonts/NotoSansCJKjp-Black.woff") format("woff"), url("../fonts/NotoSansCJKjp-Black.ttf") format("truetype"); }

/* ===================================
PET ECO / YONEYAMA PLANTATION
Base Style Sheet
First Update  2016-08-27
Last Update	  2016-11-15
=================================== */

/* ----------------------------------------------------------
1. normalize.css v3.0.2 | MIT License | git.io/normalize
2. Primary styles
2-1. Structure Module
2-2. Link Classes
2-3. Text Classes
2-4. Effect Classes
2-5. Helper Classes
3. Print styles
---------------------------------------------------------- */

/* ==========================================================
1. normalize.css v3.0.2 | MIT License | git.io/normalize
========================================================== */

html { font-family: sans-serif; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; }

body { margin: 0; }

/* HTML5 display definitions
========================================================== */

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

audio, canvas, progress, video { display: inline-block; vertical-align: baseline; }

audio:not([controls]) { display: none; height: 0; }

[hidden], template { display: none; }

/* Links
---------------------------------------------------------- */

a { background: transparent; }

a:active, a:hover { outline: 0; }

/* Text-level semantics
---------------------------------------------------------- */

abbr[title] { border-bottom: 1px dotted; }

b, strong { font-weight: bold; }

dfn { font-style: italic; }

h1 { font-size: 2em; margin: 0.67em 0; }

mark { background: #FF0; color: #000; }

small { font-size: 80%; }

sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }

sup { top: -0.5em; }

sub { bottom: -0.25em; }

/* Embedded content
---------------------------------------------------------- */

img { border: 0; }

svg:not(:root) { overflow: hidden; }

/* Grouping content
---------------------------------------------------------- */

figure { margin: 1em 40px; }

hr { box-sizing: content-box; height: 0; }

pre { overflow: auto; }

code, kbd, pre, samp { font-family: monospace; font-size: 1em; }

/* Forms
---------------------------------------------------------- */

button, input, optgroup, select, textarea { color: inherit; font: inherit; margin: 0; }

button { overflow: visible; }

button, select { text-transform: none; }

buttonbutton, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; cursor: pointer; }

button[disabled], html input[disabled] { cursor: default; }
 button::-moz-focus-inner, input::-moz-focus-inner {
 border: 0;
 padding: 0;
}

input { line-height: normal; }

input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; }
 input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button {
 height: auto;
}

input[type="search"] { -webkit-appearance: textfield; box-sizing: content-box; }
 input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {
 -webkit-appearance: none;
}

fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; }

legend { border: 0; padding: 0; }

textarea { overflow: auto; }

optgroup { font-weight: bold; }

/* Tables 
---------------------------------------------------------- */

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

td, th { padding: 0; }

/* ==========================================================
2. Primary styles
Author: Basic Plus Design Inc.
===========================================================*/


/* ----------------------------------------------------------
2-1. Structure Module
---------------------------------------------------------- */

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

html { font-size: 62.5%; margin: 0; padding: 0; -webkit-text-size-adjust: 100%; -o-text-size-adjust: 100%; -ms-text-size-adjust: 100%; text-size-adjust: 100%; }

html, body { height: 100%; }

body { background: #FFF; color: #5E250E; font-family: "Cabin", "NotoSansCJKjp", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", "Meiryo UI", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", sans-serif; font-size: 13px; font-size: 1.3rem; font-weight: 400; height: 100%; letter-spacing: .1em; line-height: 1; margin: 0; padding: 0; position: relative; width: 100%; -webkit-font-smoothing: subpixel-antialiased; -moz-osx-font-smoothing: subpixel-antialiased; }

h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal; line-height: 1; margin: 0; padding: 0; }

h1, h2, h3, h4 { font-weight: 700; }

p, li, dl, dt, dd, dd li { font-size: 100%; line-height: 1.5; margin: 0; padding: 0; }

ul, ol { padding-left: 0; -webkit-padding-start: 0; }

ul > li { list-style: none; }

img { vertical-align: middle; }

img a, img a:visited, img a:hover, img a:active { border: 0; }

th, td { white-space: nowrap; }

header, footer { clear: both; margin: 0; width: 100%; }

.container { font-size: 100%; margin: 0 auto; max-width: 100%; width: 100%; }

.content { margin: 0 auto; max-width: 1024px; width: 100%; }

.mainContent { margin: 64px auto 0; max-width: 1174px; width: 94%; }

.mainContent .content { margin: 0 auto; max-width: 1024px; padding: 40px 20px; position: relative; width: 100%; }

.content:after { clear: both; content: ""; display: table; }

::-moz-selection {
 background: rgba(12, 167, 193, .4);
}

::selection { background: rgba(12, 167, 193, .4); }

::-moz-selection {
 background: rgba(12, 167, 193, .4);
}

@media only screen and (min-width: 480px) {

.mainContent { margin-top: 78px; }
}

@media print, screen and (min-width: 640px) {

.content { padding: 0 40px; }

.mainContent { margin-top: 110px; padding: 0 75px; }

.mainContent .content { padding: 60px 40px; }
}

/* header
---------------------------------------------------------- */

header { background: #FFF; height: 64px; left: 0; position: fixed; top: 0; width: 100%; z-index: 10; }

header .content { text-align: center; width: 100%; }

header h1 .logo { margin-top: 18px; width: 120px; }

@media only screen and (min-width: 480px) {

header { height: 78px; }

header h1 .logo { margin-top: 12px; width: 160px; }
}

@media print, screen and (min-width: 640px) {

header { height: 110px; }

header h1 .logo { margin-top: 20px; width: 215px; }
}

@media print {

header { height: 60px; position: relative; }
}

/* sidemenu
---------------------------------------------------------- */

.sideMN { background: #FFF; cursor: pointer; font-size: 90%; height: 55px; position: fixed; top: 0; width: 300px; z-index: 11; }

.sideMN.on { background: #5E250E; height: 100%; }

.sideMN .nav-btn { display: block; height: 55px; position: absolute; text-indent: -9999px; top: 6px; width: 55px; z-index: 11; }

.sideMN .nav-btn span { display: block; background: #5E250E; width: 32px; height: 6px; margin-left: 10px; position: absolute; transition: all 0.4s; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; }

.sideMN ul { position: absolute; top: 0; }

.sideMN li { font-size: 105%; }

.sideMN a { display: block; z-index: 11; }

.sideMN.on a { color: #FFF; }

@media only screen and (min-width: 640px) {

.sideMN { height: 100%; }

.sideMN.on { background: #FFF; }

.sideMN .nav-btn { top: 20%; }

.sideMN li { margin-top: 20px; padding: .5em; }

.sideMN.on a { color: #532B18; }
}

/* sideL */

#sideL { left: -245px; }

#sideL ul { text-align: right; right: 75px; top: 55px; }

#sideL.on ul { right: 20px; }

#sideL li { background: url(../images/menu/arrow@2x.png) no-repeat right -5px; background-size: 6px auto; color: #FFF; line-height: 1; margin-right: 15px; padding: .8em 1em .7em .5em; position: relative; }

#sideL li span.en { display: none; }

#sideL.on li:hover { margin-right: 0; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; }

#sideL .nav-btn { background: url(../images/menu/btn-txt_menu@2x.png) no-repeat 0 -90px; background-size: 55px 300px; height: 48px; right: 0px; width: 55px; }

#sideL.on .nav-btn { background: url(../images/menu/btn-txt_menu@2x.png) no-repeat right -230px; background-size: 55px 300px; right: 20px; width: 200px; }

#sideL .nav-btn span:first-child { top: 20px; }

#sideL .nav-btn span:nth-child(2) { top: 31px; }

#sideL .nav-btn span:last-child { top: 42px; }

#sideL.on .nav-btn span { background: #FFF; }

#sideL.on .nav-btn span:first-child { -webkit-transform: translateY(11px) rotate(45deg); transform: translateY(11px) rotate(45deg); top: 0; }

#sideL.on .nav-btn span:nth-child(2) { opacity: 0; top: 11px; }

#sideL.on .nav-btn span:last-child { -webkit-transform: translateY(-11px) rotate(-45deg); transform: translateY(-11px) rotate(-45deg); top: 22px; }

@media only screen and (min-width: 640px) {

#sideL { border-right: 1px solid #5E250E; left: -225px; }

#sideL ul { top: 5%; }

#sideL.on ul { right: 0; }

#sideL li { background: url(../images/menu/arrow@2x.png) no-repeat 90% 9px; background-size: 6px auto; color: #5E250E; font-weight: 500; margin-right: 70px; padding: .2em 2em .2em 0; transition: all 0.4s; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; }

#sideL.on li:hover { background: url(../images/menu/arrow@2x.png) no-repeat 95% 9px; background-size: 6px auto; margin-right: 70px; transition: all 0.4s; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; }

#sideL .nav-btn { background: url(../images/menu/btn-txt_menu@2x.png) no-repeat center 0; background-size: 55px 300px; display: block; height: 90px; right: 26px; top: 18%; width: 30px; }

#sideL.on .nav-btn { background: url(../images/menu/btn-txt_menu@2x.png) no-repeat center 0; background-size: 55px 300px; height: 90px; right: 18px; width: 30px; }

#sideL .nav-btn span { display: block; background: #5E250E; width: 30px; height: 6px; position: absolute; right: 0; transition: all 0.4s; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; }

#sideL.on .nav-btn span { background: #532B18; }

#sideL .nav-btn span:first-child, #sideL.on .nav-btn span:first-child { top: 60px; }

#sideL .nav-btn span:nth-child(2), #sideL.on .nav-btn span:nth-child(2) { top: 71px; }

#sideL .nav-btn span:last-child, #sideL.on .nav-btn span:last-child { top: 82px; }

#sideL .nav-btn span:nth-child(2) { right: 0; }

#sideL .nav-btn:hover span:nth-child(2) { right: 15px; }
}

@media only screen and (min-width: 1264px) {

#sideL.on { background: transparent; border-right: none; left: -160px; margin: 0; padding: 0; width: 100%; }

#sideL.on ul { height: 780px; left: -40px; margin: 110px auto 0 auto; position: relative; width: 1024px; }

#sideL.on li { background: #F4F4EF; float: left; height: 260px; margin: 0!important; max-width: 256px; padding: 95px 15px 0 15px; text-align: center; width: 25%; -webkit-transition: all 0s; -moz-transition: all 0s; }

#sideL.on li:hover { background: #E7F1F2; margin-right: 0; transition: all 0.4s; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; }

#sideL.on li p { font-size: 180%; font-weight: 700; line-height: 1; }

#sideL.on li p span.jp { border-bottom: 3px solid #532B18; }

#sideL.on li p span.en { display: block; font-size: 70%; }

#sideL.on li p span:after { clear: both; content: "\A"; line-height: 1.5; white-space: pre; }

#sideL.on li p span.bold:after { clear: none; content: ""; white-space: nowrap; }

#sideL.on .nav-btn { left: 15px; }

#sideL li.mn13, #sideL.on li.mn13 { display: none; }

/* sideL menu */
#sideL.on li.mn1 p, #sideL.on li.mn3 p, #sideL.on li.mn6 p, #sideL.on li.mn8 p, #sideL.on li.mn9 p, #sideL.on li.mn11 p { background: rgba(255, 255, 255, .4); border: 3px solid #532B18; display: block; line-height: .5em; margin: 0 auto; padding: .8em 0 .5em 0; width: 90%; }

#sideL.on li.mn1 p span.jp, #sideL.on li.mn3 p span.jp, #sideL.on li.mn6 p span.jp, #sideL.on li.mn8 p span.jp, #sideL.on li.mn9 p span.jp, #sideL.on li.mn11 p span.jp { border-bottom: none; }

#sideL.on li.mn1 { background: url(../images/menu/gmn-bk1.jpg) no-repeat; background-size: cover; }

#sideL.on li.mn3 { background: url(../images/menu/gmn-bk3.jpg) no-repeat; background-size: cover; }

#sideL.on li.mn6 { background: url(../images/menu/gmn-bk6c.jpg) no-repeat; background-size: cover; }

#sideL.on li.mn8 { background: url(../images/menu/gmn-bk8.jpg) no-repeat; background-size: cover; }

#sideL.on li.mn9 { background: url(../images/menu/gmn-bk9a.jpg) no-repeat; background-size: cover; }

#sideL.on li.mn11 { background: url(../images/menu/gmn-bk11.jpg) no-repeat; background-size: cover; }

#sideL.on li.mn2 p, #sideL.on li.mn5 p, #sideL.on li.mn7 p, #sideL.on li.mn10 p, #sideL.on li.mn12 p { padding-top: 40px; }

#sideL.on li.mn4 p { padding-top: 70px; }

#sideL.on li.mn2 { background: #F4F4EF url(../images/menu/ico-shop.png) no-repeat center 60px; background-size: 60px 67px; }

#sideL.on li.mn4 { background: #E7F1F2 url(../images/menu/ico-dogcat.png) no-repeat center 60px; background-size: 95px 86px; }

#sideL.on li.mn5 { background: #FFF url(../images/menu/ico-appli.png) no-repeat center 70px; background-size: 50px 51px; }

#sideL.on li.mn7 { background: #FFF url(../images/menu/ico-news.png) no-repeat center 80px; background-size: 52px 39px; }

#sideL.on li.mn10 { background: #E7F1F2 url(../images/menu/ico-member.png) no-repeat center 80px; background-size: 82px 41px; }

#sideL.on li.mn12 { background: #F4F4EF url(../images/menu/ico-event.png) no-repeat center 80px; background-size: 46px 44px; }

#sideL.on li { display: inline-block; vertical-align: middle; -webkit-transform: translateZ(0); transform: translateZ(0); -webkit-backface-visibility: hidden; backface-visibility: hidden; -moz-osx-font-smoothing: grayscale; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-property: box-shadow; transition-property: box-shadow; box-shadow: inset 0 0 0 0 #e1e1e1, 0 0 1px rgba(0, 0, 0, 0); }

#sideL.on li:hover { box-shadow: inset 0 0 0 6px #0CA7C1, 0 0 1px rgba(0, 0, 0, 0); z-index: 100; }
}

/* sideR */

#sideR { right: -245px; }

#sideR ul { left: 100px; top: 45px; }

#sideR li { color: #fff; font-size: 115%; font-weight: 500; height: 55px; margin-top: 10px; padding-left: 75px; position: relative; }

#sideR.on ul { left: 8px; }

#sideR.on li { padding-left: 5px; }

#sideR li a.rollover { left: 50px; }

#sideR.on li a.rollover { left: 0; }

#sideR li span.ico { border: 2px solid #FFF; border-radius: 50%; float: left; height: 46px; margin-right: 20px; width: 46px; }

#sideR.on li span.ico { margin-right: 6px; }

#sideR.on li span.en { font-family: "Cabin", sans-serif; font-size: 80%; font-weight: 700; }

#sideR.on li span.en:after { content: "\A"; white-space: pre; }

#sideR .mn1 span.ico { background: url(../images/menu/sideR-ico@2x.png) no-repeat -55px 5px; background-size: 90px 281px; }

#sideR .mn2 span.ico { background: url(../images/menu/sideR-ico@2x.png) no-repeat -56px -77px; background-size: 90px 281px; }

#sideR .mn3 span.ico { background: url(../images/menu/sideR-ico@2x.png) no-repeat -55px -158px; background-size: 90px 281px; }

#sideR .mn4 span.ico { background: url(../images/menu/sideR-ico@2x.png) no-repeat -55px -241px; background-size: 90px 281px; }

#sideR .mn5 { display: none; }

#sideR.on .mn5 { background: url(../images/logo-w.png) no-repeat; background-size: 150px 31px; bottom: -10px; display: block; right: 40px; position: fixed; text-indent: -9999px; width: 150px; }

#sideR .nav-btn { background: url(../images/menu/btn-txt_bioinfo@2x.png) no-repeat 0 -290px; background-size: 55px auto; height: 48px; left: 0px; top: 6px; width: 55px; }

#sideR.on .nav-btn { background: url(../images/menu/btn-txt_bioinfo@2x.png) no-repeat 0 -230px; background-size: 55px auto; left: 15px; width: 200px; }

#sideR .nav-btn span { display: none; }

#sideR .nav-btn span:first-child { top: 20px; }

#sideR .nav-btn span:nth-child(2) { top: 31px; }

#sideR .nav-btn span:last-child { top: 42px; }

#sideR.on .nav-btn span { background: #FFF; display: block; right: 0; }

#sideR.on .nav-btn span:first-child { -webkit-transform: translateY(11px) rotate(45deg); transform: translateY(11px) rotate(45deg); top: 0; }

#sideR.on .nav-btn span:nth-child(2) { opacity: 0; top: 11px; }

#sideR.on .nav-btn span:last-child { -webkit-transform: translateY(-11px) rotate(-45deg); transform: translateY(-11px) rotate(-45deg); top: 22px; }

@media only screen and (min-width: 640px) {

#sideR { border-left: 1px solid #5E250E; right: -225px; }

#sideR ul { left: 8px; top: 20%; }

#sideR li { color: #532B18; padding-left: 6px; }

#sideR li span.ico { display: block; vertical-align: middle; -webkit-transform: translateZ(0); -ms-transform: translateZ(0); transform: translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); -moz-osx-font-smoothing: grayscale; border: 2px solid #5E250E; }

#sideR li:hover span.ico, #sideR.on li:hover span.ico { -webkit-animation-name: pulse-shrink; animation-name: pulse-shrink; -webkit-animation-duration: 0.3s; animation-duration: 0.3s; -webkit-animation-timing-function: linear; animation-timing-function: linear; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-direction: alternate; animation-direction: alternate; }

#sideR .mn1 span.ico { background-position: 5px 5px; }

#sideR .mn2 span.ico { background-position: 4px -78px; }

#sideR .mn3 span.ico { background-position: 4px -158px; }

#sideR .mn4 span.ico { background-position: 3px -240px; }

#sideR.on .mn5 { background: url(../images/logo.png) no-repeat; right: 60px; }

#sideR .nav-btn { background: url(../images/menu/btn-txt_bioinfo@2x.png) no-repeat 0 -56px; background-size: 55px auto; height: 75px; left: 10px; top: 15%; }

#sideR.on .nav-btn { background: url(../images/menu/btn-txt_bioinfo@2x.png) no-repeat 0 0; background-size: 47px auto; }

#sideR.on .nav-btn span { background: #532B18; display: block; right: 0; }
}

/* pagetop */
#sideR .pagetop a { background: url(../images/menu/btn-pagetop@2x.png) no-repeat center top; background-size: 16px 183px; bottom: 60px; display: block; height: 87px; right: -3px; position: fixed; text-indent: -9999px; width: 16px; z-index: 200; }

#sideR.on .pagetop a { background-position: center -97px; right: 3px; }

@media only screen and (min-width: 640px) {

#sideR .pagetop a { bottom: 20px; height: 107px; right: 26px; }

#sideR.on .pagetop a { background-position: center top; right: 26px; }
}

/* footer
---------------------------------------------------------- */

footer { font-size: 95%; margin: 0 auto; max-width: 1174px; width: 100%; }

footer:before, footer:after { content: ""; display: table; clear: both; }

footer .content { margin: 20px auto 0; max-width: 1024px; padding: 1em 0; width: 100%; }

.footNav { display: none; }

.footNav:before, .footNav:after { content: ""; display: table; clear: both; }

.footNav .col { float: left; width: 25%; }

.footNav .col h4 { float: left; font-weight: 700; margin-top: -.5em; }

.footNav .col ul { margin-top: 20px; }

.footNav .col li { background: url(../images/menu/arrow@2x.png) no-repeat left 8px; background-size: 6px auto; padding: 3px 0; position: relative; }

.footNav .col li:hover a { text-decoration: underline; }

.footNav .col li a { padding-left: 12px; }

.footNav .col li a span { font-weight: 600; }

.bottomContent .content { background: #5E250E; color: #FFF; max-width: 1174px; padding: .5em 40px; position: relative; }

.bottomContent .content p { color: #FFF; display: block; font-size: 75%; text-align: center; width: 100%; }

.bottomContent .content p a { color: #FFF; display: inline-block; font-size: 90%; }

.copyright { border-top: 1px solid #FFF; font-weight: 700; letter-spacing: .05em; margin-top: .5em; padding-top: .5em; }

@media only screen and (min-width: 480px) {

.bottomContent .content p { font-size: 95%; }
}

@media only screen and (min-width: 960px) {

footer { padding: 30px 75px 0; width: 100%; }

footer .content { padding: 0 40px; width: 100%; }

.footNav { display: block; }

.footNav .col h4 { font-size: 110%; }

.bottomContent .content { height: 3em; padding: 0 20px; }

.bottomContent .content p { float: left; font-size: 100%; padding: .8em 0; text-align: left; width: 50%; }

.bottomContent .content p a:before, .bottomContent .content p a:after { content: ""; white-space: normal; display: inline-block; width: .5em; }

.bottomContent p.copyright { border-top: none; font-size: 90%; letter-spacing: .05em; margin-top: .2em; text-align: right; }
}

@media only screen and (min-width: 1024px) {

.bottomContent .content p { padding-left: 0; }
}

@media only screen and (min-width: 1174px) {

.bottomContent .content { padding: 0 40px; }
}

@media print {

footer .content { max-width: 100%; }

.bottomContent .content p.copyright { border-top: none; display: inline; text-align: center; }
}

/* mainContent
---------------------------------------------------------- */

.mainContent h2 { font-size: 180%; margin-bottom: 30px; }

.mainContent h2 span.jp { font-size: 50%; }

.mainContent h2 span.jp:before { content: "\A"; white-space: pre; }

.mainContent h2.ttl { margin-bottom: 2em; text-align: center; }

.mainContent h2.ttl span.upper { border-bottom: 3px solid #532B18; padding: 0 0.5em 5px 0.5em; display: inline-block; }

.mainContent h2.ttl span.upper > span.numeric { border-bottom: none; font-family: "Open Sans", sans-serif; font-size: 110%; font-weight: 700; padding: 0; }

.mainContent h2.ttl span.lower { font-size: 50%; display: block; margin-top: .5em; }

.mainContent h2.ttl.ttl-ico { padding-top: 60px; background-position: top center; background-repeat: no-repeat; margin-bottom: 2em; text-align: center; }

.mainContent .content p { margin-bottom: 1em; }

.mainContent .content .col { background: #FFF; padding: 10px; }

.mainContent .content h3.ttl { font-size: 120%; margin-bottom: 1.5em; border-bottom: 3px solid #532B18; padding-bottom: .5em; }

@media print, screen and (min-width: 920px) {

.mainContent .content h2 { font-size: 200%; }

.mainContent .content h2 span.jp:before { content: ""; margin-left: 2em; white-space: nowrap; }
}

/* lead */

.mainContent .content p.lead { font-size: 120%; font-weight: 500; margin: 3em 0; text-align: center; }

@media only screen and (min-width: 480px) {

.mainContent .content p.lead { font-size: 100%; }
}

@media print, screen and (min-width: 640px) {

.mainContent .content p.lead { font-size: 200%; }
}

/* background color */

.bg-bwhite { background: #F4F4EF; }

.bg-pblue { background: #E7F1F2; }

.bg-brown { background: #532B18; }

/* list */

dl.list { border-bottom: 1px solid #532B18; width: 100%; }

dl.list dt { border-top: 1px solid #532B18; line-height: 1.5; min-height: 2.5em; padding: .5em 0; }

dl.list dd { line-height: 1.5; min-height: 2.5em; padding: .5em 0; }

@media print, screen and (min-width: 920px) {

dl.list dt { border-top: 1px solid #532B18; float: left; line-height: 2; min-height: 3em; width: 220px; }

dl.list dd { border-top: 1px solid #532B18; line-height: 2; margin-left: 220px; min-height: 3em; padding-top: .6em; }
}

/* lnkbtn */

.lnkbtn { border: 2px solid #532B18; display: inline-block; margin: 1em auto; padding: .07em 1em; position: relative; text-align: center; vertical-align: middle; width: 180px; -webkit-transform: translateZ(0); transform: translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); -webkit-backface-visibility: hidden; backface-visibility: hidden; -moz-osx-font-smoothing: grayscale; -webkit-transition-property: color; transition-property: color; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; }

.lnkbtn:before { content: ""; position: absolute; z-index: -1; top: 0; left: 0; right: 0; bottom: 0; background: #532B18; -webkit-transform: scale(0); transform: scale(0); -webkit-transition-property: transform; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; transition-property: transform; transition-property: transform, -webkit-transform; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; }

.lnkbtn:hover, .lnkbtn:focus, .lnkbtn:active { color: #FFF; }

.lnkbtn:hover:before, .lnkbtn:focus:before, .lnkbtn:active:before { -webkit-transform: scale(1); transform: scale(1); }

.lnkbtn a { display: block; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: 100; }

.lnkbtn span { font-weight: 700; letter-spacing: 0; }

.lnkbtn span:before { content: "\f125"; font-family: "Ionicons"; padding-right: .5em; }

.lnkbtn:hover span { font-weight: 500; }

/* map */

#googlemap iframe { border: none; height: 280px; width: 100%; }

#googlemap #infoWindow { height: 100px; width: 200px; }

#googlemap #infoWindow h3 { font-size: 15px; line-height: 1; margin-bottom: 0; }

#googlemap .zoom { float: right; font-weight: 500; margin-bottom: 0.2em; }

/* ----------------------------------------------------------
2-2. Link Classes
---------------------------------------------------------- */

a { color: #5E250E; display: block; text-decoration: none; }

a:active, a:hover { color: #5E250E; text-decoration: none; }

.rollover { display: block; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: 5; }

/* ----------------------------------------------------------
2-3. Text Classes
---------------------------------------------------------- */

.mincho { font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "游明朝", "Yu Mincho", "游明朝体", "YuMincho", "HGS明朝E", "MS P明朝", "MS PMincho", serif; font-size: 105%; }

.txt-s { font-size: 90%; }

.txt-l { font-size: 120%; }

.txt-2l { font-size: 150%; }

.bold { font-weight: 700; }

.note { font-size: 90%; font-weight: 300; }

@media print, screen and (min-width: 769px) {

.tablet-appear { display: none; }
}

@media print, screen and (max-width: 768px) {

.pc-appear { display: none; }
}


/* ----------------------------------------------------------
2-4. Effect Classes
---------------------------------------------------------- */
/* Pulse Shrink */

@-webkit-keyframes pulse-shrink {
 to {
 -webkit-transform: scale(0.9);
 transform: scale(0.9);
}
}
 @keyframes pulse-shrink {
 to {
 -webkit-transform: scale(0.9);
 transform: scale(0.9);
}
}

.pulse-shrink { display: inline-block; vertical-align: middle; -webkit-transform: translateZ(0); transform: translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); -webkit-backface-visibility: hidden; backface-visibility: hidden; -moz-osx-font-smoothing: grayscale; }

.pulse-shrink:hover, .pulse-shrink:focus, .pulse-shrink:active { -webkit-animation-name: pulse-shrink; animation-name: pulse-shrink; -webkit-animation-duration: 0.3s; animation-duration: 0.3s; -webkit-animation-timing-function: linear; animation-timing-function: linear; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-direction: alternate; animation-direction: alternate; }

/* ----------------------------------------------------------
2-5. Helper Classes
---------------------------------------------------------- */

.floatl { float: left; }

.floatr { float: right; }

.algn-l { text-align: left; }

.algn-c { text-align: center; }

.algn-r { text-align: right; }

.clearfix:before, .clearfix:after, .clearfix .before, .clearfix .after { content: " "; display: table; }

.clearfix:after, .clearfix .after { clear: both; }

.clearfix { *zoom: 1;
}

span.ssmbr:before { clear: both; content: "\A"; white-space: pre; }

@media print, screen and (min-width: 480px) {

span.ssmbr:before { content: ""; white-space: nowrap; }

span.smbr:before { clear: both; content: "\A"; white-space: pre; }
}

@media print, screen and (min-width: 640px) {

span.smbr:before { content: ""; white-space: nowrap; }

span.mbr:before { clear: both; content: "\A"; white-space: pre; }
}

@media print, screen and (min-width: 768px) {

span.mbr:before { content: ""; white-space: nowrap; }

span.tbr:before { clear: both; content: "\A"; white-space: pre; }
}

@media only screen and (min-width: 1024px) {

span.tbr:before { content: ""; white-space: nowrap; }

span.break:before { clear: both; content: "\A"; white-space: pre; }
}

/* ==========================================================
3. Print Styles
========================================================== */

@media print {

* { box-shadow: none !important; text-shadow: none !important; }

html { width: 1024px; }

img, h2, h3, .ir { page-break-inside: avoid; }

h2, h3 { page-break-after: avoid; }

p, h2, h3 { orphans: 3; widows: 3; }

.print-break { page-break-inside: avoid; }

.sideMN, .footNav, .bottomContent .content p, .bottomContent .content p.copyright span { display: none; }

@page { margin: 0.5cm; }
}