@charset "UTF-8";

/* ==========================================================================
   common
   ========================================================================== */

/* reset
   ========================================================================== */

html { font-size: 62.5%; margin: 0; padding: 0; border: none; outline: none; vertical-align: baseline; background: transparent; }
body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre, hr,
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, main, menu, nav, section, summary, button,
time, mark, audio, video { margin: 0; padding: 0; border: none; outline: none; vertical-align: baseline; background: transparent; }
body { height: 100%; font-family: 'Noto Sans JP', sans-serif; font-weight: 300; font-feature-settings: 'palt'; line-height: 1; background-color: #740030; }
@media (min-width: 320px) and (max-width: 736px) {
body { font-size: 1.4rem; }
}
@media (min-width: 737px) {
body { font-size: 1.6rem; }
}
body, input, textarea, legend { color: #000; }
h1, h2, h3, h4, h5, h6 { font-weight: bold; }
input, select, textarea { padding: 0; margin: 0; }
article, aside, details, figcaption, figure, footer, header, main, menu, nav, section { display: block; }
nav ul { list-style: none; }
li { list-style-position: outside; }
ul li { list-style-type: none; }
ol li { list-style-type: none; }
blockquote, q { quotes: none; }
blockquote::before, blockquote::after,
q::before, q::after { content: ''; }
a { margin: 0; padding: 0; vertical-align: baseline; background: transparent; }
a, a img { border: none; }
a:link,
a:visited,
a:hover,
a:active { color: #000; text-decoration: none; }
a:focus { outline: none; }
a, label { cursor: pointer; }
address, optgroup, cite { font-style: normal; }
abbr { border-bottom: .1em dotted; cursor: help; }
abbr[title], dfn[title] { border-bottom: 1px dotted; cursor: help; }
table { border-collapse: collapse; border-spacing: 0; width: 100%; }
th, td { text-align: left; vertical-align: top; border: 1px solid #000; }
caption { text-align: left; }
input, select { vertical-align: middle; border-radius: 0; }
em { font-style: normal; }
pre { overflow-x: auto; }
textarea { width: 99%; overflow: auto; }
iframe { display: block; width: 100%; overflow: hidden; }
sup { font-size: 1rem; vertical-align: baseline; position: relative; bottom: .7em; }
sub { font-size: 1rem; vertical-align: baseline; position: relative; top: .1em; }
img { max-width: 100%; vertical-align : middle; }
a img { opacity: 1; transition: opacity .25s ease 0s; }
a:hover img { opacity: .8; }



/* container
   ========================================================================== */

div.body { position: relative; }
main { background-color: #fff; position: relative; }

@media (min-width: 320px) and (max-width: 736px) {

main { padding: 75px 0 50px; }
main::after { content: ''; display: block; width: 100%; height: 100%; background-color: #000; position: fixed; top: 0; right: 0; visibility: hidden; opacity: 0; transition: .25s; }
main.overlaid::after { visibility: visible; opacity: .4; }

.section-body,
article { padding: 0 15px; }

}
@media (orientation: landscape) and (max-width: 736px) {
}
@media (min-width: 737px) {

main { padding-bottom: 100px; }

}



/* utilities
   ========================================================================== */

/* clearfix */
.wrapper::after { content: ''; display: block; clear: both; }

/* replace text */
.replace { display: block; color: rgba(0, 0, 0, 0); text-align: center; overflow: hidden; position: relative; }
a.replace:link, a.replace:visited, a.replace:hover, a.replace:active, a.replace:focus { color: rgba(0, 0, 0, 0); }
.replace::after { content: ''; display: block; width: 100%; height: 100%; background-repeat: no-repeat; background-color: transparent; background-position: 0 0; background-size: contain; position: absolute; left: 0; top: 0; z-index: 1; }

@media all and (-ms-high-contrast:none){

/* object-fit */
.object-fit { font-family: 'object-fit: cover;'; } /* ie11 */

}



/* ==========================================================================
   parts
   ========================================================================== */

/* header
   ========================================================================== */

#header { display: block; width: 100%; background-color: #740030; position: fixed; left: 0; top: 0; z-index: 2; transition: .1s; }

/* gnav */
#gnav { display: flex; }
#gnav a.logo { display: flex; align-items: center; position: relative; }
#gnav a.logo.resorts { background-color: #486535; transition: .25s; }
#gnav a.logo.resorts:hover { opacity: .8; }
#gnav a.logo.resorts::before { content: ''; display: block; background-color: #486535; position: absolute; right: 0; top: 0; transform: skewX(-45deg); transform-origin: bottom right; }
#gnav a.logo.resorts .replace::after { background-image: url(/media/common/logo_resorts.svg); }
#gnav a.logo.garden .replace { position: absolute; }
#gnav a.logo.garden .replace::after { background-image: url(/media/common/logo_garden_text_w.svg); }

/* lnav */
#lnav { display: flex; justify-content: space-between; align-items: center; width: 100%; background-color: #740030; position: absolute; transition: .1s; z-index: 2; }
#lnav a.logo.replace::after { background-image: url(/media/common/logo_garden_w.svg); }
#lnav a.contact { display: block; color: #fff; background: url(/media/common/icon_contact.svg) no-repeat center center #d00053; font-size: 0; line-height: 0; padding: 0; }

/* tabs */
#tabs { z-index: 1; }
#tabs a.tab { display: flex; justify-content: center; align-items: center; transition: .25s; z-index: 1; }
#tabs a.tab span { display: inline-block; color: #fff; font-weight: 700; text-align: center; }
#tabs a.tab.price { background-color: #fa6fa6; }
#tabs a.tab.access { background-color: #ff8383; }
#tabs a.tab.flowering { background-color: #ffaccd; }
#tabs a.tab.club { flex-direction: column; background-color: #ffd6d6; }
#tabs a.tab.club span { color: #740030; line-height: 1.2; }

@media (min-width: 320px) and (max-width: 736px) {

#header { height: 75px; }
#header.tiny { height: 40px; }

/* gnav */
#gnav { height: 35px; }
#gnav a.logo.resorts { width: calc(50% - 45px); }
#gnav a.logo.resorts::before { width: 35px; height: 35px; }
#gnav a.logo.resorts .replace { width: 130px; height: 17px; margin-left: 15px; }
#gnav a.logo.garden { width: calc(50% + 35px); }
#gnav a.logo.garden .replace { width: 112px; height: 12px; right: 15px; }

/* lnav */
#lnav { height: 40px; top: 35px; }
#header.tiny #lnav { background-color: #740030; position: fixed; top: 0; }

#lnav a.logo { width: 120px; height: 27px; flex: 0 0 120px; margin-left: 15px; }
#lnav a.contact { background-size: 18px; width: 40px; height: 40px; margin-right: 40px; }

#menus { width: 220px; height: 100%; background-color: #740030; margin-top: 75px; position: fixed; right: -220px; top: 0; transform: translateX(0); transition: transform .25s ease-in-out; }
input#hamburger[type="checkbox"]:checked ~ #menus { transform: translateX(-220px); }
#menus ul a { display: block; width: 220px; height: 50px; color: #fff; font-size: 1.2rem; font-weight: 300; line-height: 1; border-bottom: 1px solid #707070; padding: 20px; box-sizing: border-box; }
input#hamburger[type=checkbox] { display: none; }
#lnav .hamburger { display: flex; justify-content: center; align-items: center; width: 40px; height: 40px; background-color: #000; cursor: pointer; position: absolute; top: 0; right: 0; }
#lnav .hamburger span { display: block; }
#lnav .hamburger .inner { width: 15px; height: 15px; }
#lnav .line { width: 100%; height: 1px; background-color: #fff; box-sizing: border-box; }
#lnav .horizontal { width: 10px; float: left; margin-top: 5px; position: relative; transition: all 0.3s; }
#lnav .diagonal-01 { width: 15px; float: left; position: relative; transition: all 0.3s; }
#lnav .diagonal-02 { width: 13px; float: left; margin-top: 5px; position: relative; transition: all 0.3s; }
input#hamburger[type=checkbox]:checked ~ .hamburger .horizontal { opacity: 0; }
input#hamburger[type=checkbox]:checked ~ .hamburger .diagonal-01 { margin-top: 6px; transform: rotate(135deg); }
input#hamburger[type=checkbox]:checked ~ .hamburger .diagonal-02 { width: 15px; margin-top: -7px; transform: rotate(-135deg); }

#header.tiny #menus { margin-top: 40px; }

/* tabs */
#tabs { display: flex; height: 35px; margin-top: 5px; opacity: 0; transition: .25s; }
#header.tiny #tabs { opacity: 1; }
#tabs a.tab { width: 25%; height: 35px; }
#tabs a.tab span { font-size: 1rem; }
#tabs a.tab.club span br { display: none; }
body.price #tabs a.tab.price span,
body.access.garden #tabs a.access span,
body.club #tabs a.tab.club span { opacity: .2; }

}
@media (orientation: landscape) and (max-width: 736px) {
}
@media (min-width: 737px) {

#hamburger,
#header .hamburger { display: none; }

#header { height: 95px; }
#header.tiny { height: 50px; }

/* gnav */
#gnav { height: 45px; }
#gnav a.logo.resorts { width: calc(50% - 45px); }
#gnav a.logo.resorts::before { width: 45px; height: 45px; }
#gnav a.logo.resorts .replace { width: 233px; height: 30px; margin-left: 20px; }
#gnav a.logo.garden { width: calc(50% + 45px); }
#gnav a.logo.garden .replace { width: 203px; height: 20px; right: 30px; }

/* lnav */
#lnav { height: 50px; background-color: transparent; position: absolute; top: 45px; }
#header.tiny #lnav { background-color: #740030; position: fixed; top: 0; }

#lnav a.logo { width: 180px; height: 40px; flex: 0 0 180px; margin-left: 20px; }

#lnav ul { display: flex; justify-content: space-between; align-items: center; margin-right: 70px; }
#lnav ul a { display: inline-flex; align-items: center; height: 50px; color: #fff; font-size: 1.1rem; padding: 0 20px; transition: .25s; }
#lnav ul a:hover { opacity: .6; }
#lnav a.contact { background-size: 20px; width: 50px; height: 50px; position: absolute; right: 0; }

/* tabs */
#tabs { position: fixed; right: 0; top: 25%; }
#tabs a.tab { width: 85px; height: 70px; border-radius: 10px 0 0 10px; margin-bottom: 5px; }
#tabs a.tab span { font-size: 1.6rem; }
#tabs a.tab:hover { opacity: .4; }
body.price #tabs a.tab.price,
body.access.garden #tabs a.access,
body.club #tabs a.tab.club { opacity: .4; }

}



/* footer
   ========================================================================== */

footer { width: 100%; background-color: #740030; }
footer .copy { color: #fff; text-align: center; }

/* pagetop */
#pagetop { display: none; color: #fff; background: url(/media/common/icon_pagetop.svg) no-repeat center center #740030; box-sizing: border-box; position: fixed; opacity: .6; z-index: 1; font-size: 0; line-height: 0; right: 0; }

@media (min-width: 320px) and (max-width: 736px) {

footer { padding: 15px 0; }
footer nav.sub { display: none; }
footer .copy { font-size: 1rem; }
#pagetop { background-size: 17px auto; width: 40px; height: 40px; bottom: 0; }

}
@media (orientation: landscape) and (max-width: 736px) {
}
@media (min-width: 737px) {

footer { width: 100%; background-color: #740030; padding: 25px 0; }

footer nav.sub ul { display: flex; justify-content: space-between; align-items: center; width: 800px; padding-right: 60px; box-sizing: border-box; margin: 0 auto 50px; }
footer nav.sub ul a { color: #fff; font-size: 1.2rem; transition: .25s; padding: 20px; }
footer nav.sub ul a:hover { opacity: .6; }

footer .copy { font-size: 1.2rem; }

#pagetop { background-size: 20px auto; width: 60px; height: 60px; bottom: 60px; }

}



/* nav highlighting
   ========================================================================== */

body.information nav ul li a.information,
body.about-garden nav ul li a.about-garden,
body.shop-and-restaurant nav ul li a.shop-and-restaurant,
body.events nav ul li a.events,
body.company nav ul li a.company,
body.contact.general nav ul li a.contact { opacity: .6; }



/* general
   ========================================================================== */

.columned { display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; position: relative; }

.extras .badge { display: flex; justify-content: center; align-items: center; width: 100px; height: 26px; font-size: 1.3rem; background-color: #ddd; border-radius: 10px; }
.extras .date { font-size: 1.3rem; font-weight: 500; }

a.sns.replace { width: 20px; height: 20px; transition: .25s; }
a.sns.replace.instagram::after { background-image: url(/media/common/icon_instagram.svg); }
a.sns.replace.twitter::after { background-image: url(/media/common/icon_twitter.svg); }
a.sns.replace.facebook::after { background-image: url(/media/common/icon_facebook.svg); }
a.sns.replace:hover { opacity: .6; }

/* button */
a.button { display: inline-block; min-height: 40px; border: 1px solid #000; background: url(/media/common/arrow_next.svg) no-repeat calc(100% - 10px) center; background-size: 16px auto; padding: 15px 60px; color: #000; transition: .25s; box-sizing: border-box; }
a.button span { display: block; font-size: 1rem; font-weight: 700; line-height: 1; }
a.button:hover { opacity: .6; }
a.button.pdf { background: url(/media/common/icon_pdf.svg) no-repeat calc(100% - 10px) center; background-size: 15px; }
.buttons { display: flex; justify-content: center; align-items: center; }

/* index-list */
ul.index-list li > span,
ul.index-list li a { padding: 10px 0; box-sizing: border-box; transition: .25s; }
ul.index-list li a { background-image: url(/media/common/arrow_next.svg); background-repeat: no-repeat; background-position: calc(100% - 15px) center; background-size: 16px 9px; padding-right: 45px; }
ul.index-list li a:hover { opacity: .6; }
ul.index-list li > span span,
ul.index-list li a span { display: inline-block; }
ul.index-list li > span .extras,
ul.index-list li a .extras { display: flex; align-items: center; }
ul.index-list li .badge { margin-right: 20px; }
ul.index-list li .publication .badge { background-color: #ff81a8; }
ul.index-list li .events .badge { color: #fff; background-color: #d00053; }
ul.index-list li .heading { line-height: 1.4; }

/* section-header */
.section-header { display: flex; justify-content: center; align-items: center; flex-direction: column; background: no-repeat center center; background-size: cover; }
.section-header div.heading { display: flex; justify-content: center; align-items: center; flex-direction: column; color: #fff; font-family: 'Noto Serif JP', serif; font-weight: 500; text-align: center; background-color: rgba(116, 0, 48, .5); border: 1px solid #fff; box-sizing: border-box; }
.section-header div.sub { display: flex; justify-content: center; align-items: center; color: #fff; padding: 10px; box-sizing: border-box; }

@media (min-width: 320px) and (max-width: 736px) {

/* index-list */
ul.index-list li > span,
ul.index-list li a { display: flex; justify-content: center; flex-direction: column; min-height: 80px; font-weight: 300; background-position: calc(100% - 15px) calc(100% - 15px); border-bottom: 1px solid #ddd; padding: 10px 45px 10px 15px; }
ul.index-list li > span .extras,
ul.index-list li a .extras { margin-bottom: 5px; }

/* section-header */
.section-header.billboard { height: 440px; }
.section-header div.heading { min-width: 270px; font-size: 2rem; padding: 10px; }
.section-header div.sub { min-width: 270px; }

}
@media (orientation: landscape) and (max-width: 736px) {
}
@media (min-width: 737px) {

/* index-list */
ul.index-list li > span,
ul.index-list li a { display: flex; align-items: center; min-height: 70px; transition: .25s; }
ul.index-list li .date { margin-right: 40px; }

/* section-header */
.section-header { margin-top: 95px; }
.section-header.billboard { height: 575px; }
.section-header div.heading { min-width: 400px; font-size: 2.6rem; padding: 20px; }
.section-header div.sub { min-width: 400px; }

}



/* ==========================================================================
   article
   ========================================================================== */

article p { font-weight: 300; position: relative; }
article p.note { font-size: 1.1rem; }

/* article-header */
.article-header h1 { font-weight: 500; line-height: 1.5; }
.article-header h2 { position: relative; }
.article-header h1.boxed { display: flex; justify-content: center; align-items: center; color: #fff; font-family: 'Noto Serif JP', serif; font-weight: 500; line-height: 1.4; text-align: center; background-color: #740030; }

/* article-body */
.article-body h3 { font-weight: 700; line-height: 1.4; }
.article-body h3 .sub { font-weight: 500; }

.article-body table.mini td { font-weight: 300; line-height: 1.5; border: none; padding: 3px 3px 3px 0; }
.article-body table a { text-decoration: underline; }
.article-body table a:hover { text-decoration: none; }

@media (min-width: 320px) and (max-width: 736px) {

article p { font-size: 1.4rem; line-height: 1.8; margin-top: 15px; }
article h4 { font-size: 1.5rem; font-weight: 500; }

/* article-header */
.article-header { padding-top: 50px; margin-bottom: 80px; }
.article-header h1 { font-size: 1.5rem; }
.article-header h1.boxed { width: 200px; height: 40px; font-size: 1.4rem; margin: 0 auto 30px; }

/* article-body */
.article-body h3 { font-size: 1.7rem; }
.article-body h3 .sub { font-size: 1.4rem; }
.article-body table.mini { margin: 20px 0; }
.article-body table.mini td { font-size: 1.3rem; }

}
@media (orientation: landscape) and (max-width: 736px) {
}
@media (min-width: 737px) {

article p { font-size: 1.6rem; font-weight: 300; line-height: 2; margin-top: 20px; position: relative; }
article p.note { font-size: 1.1rem; }

/* article-header */
.article-header { width: 670px; padding-top: 100px; margin: 0 auto 150px; position: relative; }
body.contact .article-header,
body.price .article-header,
body.access .article-header,
body.club .article-header,
body.group-reduction .article-header,
body.common .article-header { margin-top: 95px; }

.article-header h1 { font-size: 2rem; font-weight: 500; line-height: 1.5; }
.article-header h2 { position: relative; }
.article-header h1.boxed { width: 360px; height: 80px; font-size: 2.6rem; margin: 0 auto 50px; }

/* article-body */
.article-body { width: 980px; margin: 0 auto; }

.article-body h3 { font-size: 2.4rem; font-weight: 700; line-height: 1.4; }
.article-body h3 .sub { font-size: 2rem; font-weight: 500; }

.article-body table.mini { margin: 25px 0 35px; }
.article-body table.mini td { font-size: 1.4rem; font-weight: 300; line-height: 1.5; border: none; padding: 3px 3px 3px 0; }
.article-body table a { text-decoration: underline; }
.article-body table a:hover { text-decoration: none; }

}



/* home
   ========================================================================== */

/* section-header */
#home-header { display: block; background-image: url(/media/section-header/bg_home_02.jpg); background-color: #740030; position: relative; }

/* billboard */
#home-intro,
#home-billboard { width: 100%; height: ; display: flex; justify-content: center; align-items: center; position: absolute; }

#billboard-main-copy { display: flex; justify-content: center; align-items: center; color: #fff; font-family: 'Noto Sans JP', sans-serif; font-weight: 100; writing-mode: vertical-rl; -ms-writing-mode: tb-rl; background: linear-gradient(to bottom, rgba(116, 0, 48, 0) 0%, rgba(116, 0, 48, .8) 50%, rgba(116, 0, 48, 0) 100%); position: relative; }

/* billboard: intro */
#home-intro { background-color: #740030; }
#intro-copy { color: #fff; font-family: 'Noto Serif JP', serif; font-weight: 500; text-align: center; background: url(/media/common/logo_garden_w.svg) no-repeat center bottom; overflow: hidden; }
#intro-copy span { display: block; }

#home-intro { opacity: 1; z-index: 0; animation: fadeout-intro 5s ease 5s forwards; }
@keyframes fadeout-intro { 40% { opacity: 0; } 100% { z-index: -1; } }
#intro-copy { opacity: 0; animation: fadein 2s ease 1s forwards; }
@keyframes fadein { 100% { opacity: 1; } }
#intro-copy span { opacity: 0; transform: translateX(-100%); transform-origin: left; animation: movein 1s ease 3s forwards; }
@keyframes movein { 100% { opacity: 1; transform: translateX(0); } }

/* billboard: instagram */
#billboard-instagram .slick-slide { margin: 0; }

/* maintenance */
body.maintenance #home-header { display: block; background-image: none; }
body.maintenance #home-intro,
body.maintenance #intro-copy,
body.maintenance #intro-copy span { animation: none; }
body.maintenance #intro-copy { opacity: 1; }
body.maintenance #intro-copy span { opacity: 1; transform: none; }

/* article */
body.home article { position: relative; }
body.home .article-header { padding-top: 0; }
body.home article h2 { color: #740030; font-family: 'Noto Serif JP', serif; font-weight: 600; text-align: center; margin-bottom: 20px; position: relative; }

body.home article a.button { color: #fff; background-image: url(/media/common/arrow_next_w.svg); background-color: #740030; margin: 0 auto; }

/* information */
body.home article.information h2 { display: flex; justify-content: center; align-items: center; color: #fff; font-family: 'Noto Sans JP', sans-serif; font-weight: 500; }
body.home article.information ul.index-list { background-color: #fff; box-sizing: border-box; }

/* statement */
body.home article.statement h2 { color: #000; font-weight: 300; line-height: 1.4; text-align: left; }
body.home article.statement p.logo { width: 100%; color: #740030; font-family: 'Noto Serif JP', serif; font-weight: 300; text-align: center; background: url(/media/common/logo_garden.svg) no-repeat center bottom; }

/* garden-map */
body.home article.garden-map { background: no-repeat center bottom; }

body.home article.garden-map p { font-weight: 300; line-height: 1.5; text-align: center; }

body.home article.garden-map .decorated { width: 60px; font-size: 2.3rem; font-weight: 300; line-height: 1.2; text-align: center; }
body.home article.garden-map .decorated::before,
body.home article.garden-map .decorated::after { content: ''; background-color: #707070; width: 1px; height: 45px; position: absolute; top: -5px; }
body.home article.garden-map .decorated::before { transform: translate(-20px, 0) rotate(-20deg); left: 0; }
body.home article.garden-map .decorated::after { transform: translate(20px, 0) rotate(20deg); right: 0; }

body.home article.garden-map a { position: absolute; transition: .25s; }
body.home article.garden-map a:hover { opacity: .6; }

body.home .modaal-close { position: absolute; top: auto; width: 50px; height: 50px; background: transparent; }
body.home .modaal-close:after,
body.home .modaal-close:before { width: 1px; height: 30px; border-radius: 1px; background: #707070; }
body.home .modaal-close:focus,
body.home .modaal-close:hover { background: transparent }
body.home .modaal-close:focus:after,
body.home .modaal-close:focus:before,
body.home .modaal-close:hover:after,
body.home .modaal-close:hover:before { background: #d00053; }
body.home figure.map-spot h4 { color: #740030; font-family: 'Noto Serif JP', serif; font-weight: 500; text-align: center; }
body.home figure.map-spot p { font-size: 1.4rem; font-weight: 300; line-height: 2; text-align: center; }

/* calendar */
body.home article.calendar > p.lead { font-weight: 500; }

body.home article.calendar .columned a { transition: .25s; }
body.home article.calendar .columned a:hover { opacity: .6; }
body.home article.calendar .columned .block { background: no-repeat center top; }
body.home article.calendar .columned .block h3 { display: flex; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; height: 50px; padding: 10px; box-sizing: border-box; }
body.home article.calendar .columned .block h3 span { display: block; color: #740030; }
body.home article.calendar .columned .block h3 .heading { font-family: 'Noto Serif JP', serif; font-size: 3rem; font-weight: 500; }
body.home article.calendar .columned .block h3 .sub { color: #740030; font-weight: 300; }
body.home article.calendar .columned .block h4 { font-weight: 700; line-height: 1.3; }
body.home article.calendar .columned .block p { font-weight: 300; line-height: 1.6; }
body.home article.calendar .columned .block.item-01 { background-image: url(/media/home/calendar_item_01.jpg); }
body.home article.calendar .columned .block.item-02 { background-image: url(/media/home/calendar_item_02.jpg); }
body.home article.calendar .columned .block.item-02 h3 .heading { font-size: 2rem; }
body.home article.calendar .columned .block.item-02 h3 .sub { width: 100%; text-align: right; }
body.home article.calendar .columned .block.item-03 { background-image: url(/media/home/calendar_item_03.jpg); }
body.home article.calendar .columned .block.item-04 { background-image: url(/media/home/calendar_item_04.jpg); }
body.home article.calendar .columned .block h3 { background-color: #fff; border: 1px solid #740030; }

/* shop-and-restaurant */
body.home article.shop-and-restaurant .article-header { background: url(/media/home/shop-and-restaurant_bg_01.jpg) no-repeat left top #740030; }
body.home article.shop-and-restaurant .article-header::after { content: ''; display: block; background: url(/media/home/shop-and-restaurant_bg_02.jpg) no-repeat center center; position: absolute; }
body.home article.shop-and-restaurant .article-header h2,
body.home article.shop-and-restaurant .article-header p { color: #fff; text-align: center; margin: 0 auto; z-index: 1; }
body.home article.shop-and-restaurant .article-header p { font-weight: 500; line-height: 1.6; }

body.home article.shop-and-restaurant .columned { justify-content: flex-start; }
body.home article.shop-and-restaurant .columned .block { background-color: #fff; position: relative; }
body.home article.shop-and-restaurant .columned .block h4 { background: no-repeat center top; transition: .25s; }
body.home article.shop-and-restaurant .columned a:hover h4 { opacity: .6; }
body.home article.shop-and-restaurant .columned .block h4 > span { display: block; }
body.home article.shop-and-restaurant .columned .block.item-01 h4 { background-image: url(/media/home/shop-and-restaurant_item_01.jpg); }
body.home article.shop-and-restaurant .columned .block.item-02 h4 { background-image: url(/media/home/shop-and-restaurant_item_02.jpg); }
body.home article.shop-and-restaurant .columned .block.item-03 h4 { background-image: url(/media/home/shop-and-restaurant_item_03.jpg); }
body.home article.shop-and-restaurant .columned .block.item-04 h4 { background-image: url(/media/home/shop-and-restaurant_item_04.jpg); }
body.home article.shop-and-restaurant .columned .block.item-05 h4 { background-image: url(/media/home/shop-and-restaurant_item_05.jpg); }

body.home article.shop-and-restaurant .columned .block h3 { display: flex; justify-content: center; align-items: center; font-family: 'Noto Serif JP', serif; font-weight: 500; background-color: #fff; border: 1px solid #707070; position: absolute; left: 0; z-index: 1; }
body.home article.shop-and-restaurant .columned .block h4 > span { color: #fff; font-weight: 700; background-color: #740030; }

/* events */
body.home article.events { background-color: #ffdee9; }
body.home article.events .article-header::after { content: ''; display: block; background: no-repeat center center; position: absolute; }
body.home article.events .article-header h2 { text-align: center; z-index: 1; }

body.home article.events .columned .block { background-color: #fff; border: 1px solid #ddd; padding: 3px; box-sizing: border-box; }
body.home article.events .columned .block .inner { display: flex; justify-content: center; flex-direction: column; border: 1px solid #740030; padding: 10px; box-sizing: border-box; }

body.home article.events .columned .block h3 { font-weight: 700; line-height: 1.3; text-align: center; }
body.home article.events .columned .block h3 .heading { display: block; }
body.home article.events .columned .block h3 .divider { display: flex; justify-content: space-between; align-items: center; width: 100%; height: 1px; background-color: #000; }
body.home article.events .columned .block h3 .divider::before,
body.home article.events .columned .block h3 .divider::after { content: ''; display: block; width: 4px; height: 4px; background-color: #000; border-radius: 2px; }

body.home article.events .columned .block p { font-weight: 300; line-height: 1.6; text-align: center; }
body.home article.events .date { line-height: 1.2; }
body.home article.events .date > span { display: block; }
body.home article.events .date > .heading { font-family: 'Noto Serif JP', serif; font-weight: 700; }
body.home article.events .date > .sub { font-weight: 300; margin-top: 5px; }

body.home article.events .events-01 { background-color: #fff; }

body.home article.events .events-02 .article-header { background: url(/media/home/events-02_bg_01.jpg) no-repeat right top #ffdee9; }
body.home article.events .events-02 .article-header::after { background-image: url(/media/home/events-02_bg_02.jpg); }
body.home article.events .events-02 .article-header h2 > span.sub,
body.home article.events .events-02 .article-header h2 > span.sub span { display: block; margin: 0 auto; }
/*
body.home article.events .events-02 .article-header h2 > span.sub span:nth-of-type(1) { font-weight: 500; text-align: left; }
body.home article.events .events-02 .article-header h2 > span.sub span:nth-of-type(2) { font-family: 'Noto Sans JP', sans-serif; font-weight: 300; text-align: right; }
*/
body.home article.events .events-02 .article-header h2 > span.sub { font-family: 'Noto Sans JP', sans-serif; font-weight: 500; text-align: center;  }
body.home article.events .events-02 .article-header h2 > span.sub span:nth-of-type(1) { border: 1px solid #740030; }

body.home article.events .events-02 .columned .wrapper { display: flex; justify-content: center; background: no-repeat center top; }
body.home article.events .events-02 .columned .wrapper.item-01 { background-image: url(/media/home/events-02_item_01.jpg); }
body.home article.events .events-02 .columned .wrapper.item-02 { background-image: url(/media/home/events-02_item_02.jpg); }
body.home article.events .events-02 .columned .wrapper.item-03 { background-image: url(/media/home/events-02_item_03.jpg); }
body.home article.events .events-02 .columned .wrapper.item-04 { background-image: url(/media/home/events-02_item_04.jpg); }
body.home article.events .events-02 .columned .wrapper.item-05 { background-image: url(/media/home/events-02_item_05.jpg); }
body.home article.events .events-02 .columned .wrapper.item-06 { background-image: url(/media/home/events-02_item_06.jpg); }
body.home article.events .events-02 .button { background-color: #d00053; }

/* instagram */
body.home article.instagram h2::after { content: ''; display: block; width: 100px; height: 1px; background-color: #740030; }
body.home article.instagram .buttons { width: 140px; justify-content: space-between; margin: 50px auto 0; }

/* lake-newtown */
body.home div.lake-newtown a { display: flex; justify-content: center; align-items: center; flex-direction: column; background: url(/media/common/arrow_next_w.svg) no-repeat #740030; background-size: 16px 9px; transition: .25s; }
body.home div.lake-newtown a:hover { opacity: .6; }
body.home div.lake-newtown a span { display: block; color: #fff; line-height: 1; }
body.home div.lake-newtown a .sub { font-family: 'Noto Serif JP', serif; }
body.home div.lake-newtown a .heading { font-weight: 300; }
body.home div.lake-newtown p { font-weight: 300; line-height: 2; }

@media (min-width: 320px) and (max-width: 736px) {

body.home main { padding: 0 0 50px; }

/* section-header */
#home-header { height: calc(100vh - 75px); margin-top: 75px; }

/* billboard */
#home-intro,
#home-billboard { height: calc(100vh - 75px); }
#billboard-main-copy { width: 56px; height: 350px; font-size: 2.6rem; }

/* billboard: intro */
#intro-copy { height: 80px; font-size: 1.7rem; background-size: 220px auto; }

/* section-body */
body.home .section-body { padding: 0; }

/* article */
body.home article { padding: 0; margin: 0 auto 100px; }
body.home article h2 { font-size: 3rem; }

/* information */
body.home article.information { margin-bottom: 100px; }
body.home article.information h2 { height: 30px; font-size: 1.2rem; background-color: #740030; margin-bottom: 0; }
body.home article.information ul.index-list li > span,
body.home article.information ul.index-list li a { min-height: 80px; }

/* statement */
body.home article.statement { padding: 0 15px; margin-bottom: 150px; }
body.home article.statement h2,
body.home article.statement p { padding: 0 15px; box-sizing: border-box; }
body.home article.statement h2 { font-size: 1.7rem; margin-bottom: 20px; }
body.home article.statement h2 br { display: none; }
body.home article.statement p { margin-bottom: 10px; }
body.home article.statement p.logo { height: 80px; font-size: 1.7rem; background-size: 220px auto; margin: 50px auto 0; }

/* garden-map */
body.home article.garden-map { width: 375px; height: 520px; background-image: url(/media/home/garden-map_mobile.jpg); background-size: 375px auto; margin: 0 auto 50px; }
body.home article.garden-map p { font-size: 1.3rem; }
body.home article.garden-map .decorated { margin: 20px auto; position: relative; }
body.home article.garden-map a { position: absolute; transition: .25s; }
body.home article.garden-map a:hover { opacity: .6; }
body.home article.garden-map a.spot-01,
body.home article.garden-map a.spot-02,
body.home article.garden-map a.spot-03,
body.home article.garden-map a.spot-04,
body.home article.garden-map a.spot-05,
body.home article.garden-map a.spot-06,
body.home article.garden-map a.spot-07,
body.home article.garden-map a.spot-08 { display: block; width: 30px; height: 30px; background-color: #ffd6d6; border: 2px solid #777777; border-radius: 15px; box-sizing: border-box; }
body.home article.garden-map a span { display: none; }
body.home article.garden-map a.spot-01 { bottom: 267px; left: 157px; }
body.home article.garden-map a.spot-02 { bottom: 185px; left: 105px; }
body.home article.garden-map a.spot-03 { bottom: 189px; left: 159px; }
body.home article.garden-map a.spot-04 { bottom: 192px; left: 211px; }
body.home article.garden-map a.spot-05 { bottom: 164px; left: 19px; }
body.home article.garden-map a.spot-06 { bottom: 150px; left: 268px; }
body.home article.garden-map a.spot-07 { bottom: 144px; left: 201px; }
body.home article.garden-map a.spot-08 { bottom: 115px; left: 290px; }
.modaal-close { right: 0; bottom: 5px; }
.modaal-inner-wrapper { padding: 80px 10px; }
.modaal-content-container { width: 355px; padding: 15px; }
figure.map-spot { width: 325px; }
figure.map-spot figcaption { margin-top: 10px; }
figure.map-spot h4 { font-size: 1.7rem; }
figure.map-spot p { font-size: 1.3rem; line-height: 1.6; margin-top: 5px; }

/* calendar */
body.home article.calendar > p { display: none; }
body.home article.calendar > p.lead { display: block; font-size: 1.5rem; line-height: 1.4; text-align: center; padding: 0 30px; }
body.home article.calendar .columned { margin-top: 20px; }
body.home article.calendar .columned .block { display: flex; justify-content: space-between; flex-direction: column; width: 50%; height: 260px; background-position: center center; background-size: 300px auto; }
body.home article.calendar .columned .block:nth-child(2),
body.home article.calendar .columned .block:nth-child(4) { width: calc(50% - 1px); }
body.home article.calendar .columned .block h3 .sub { font-size: 1rem; }
body.home article.calendar .columned .block h4 { height: 50px; background-color: #fff; font-size: 1.4rem; padding: 10px 15px; }
body.home article.calendar .columned .block p { display: none; }

/* shop-and-restaurant */
body.home article.shop-and-restaurant .article-header { height: 400px; background-size: auto 200px; margin-bottom: 0; }
body.home article.shop-and-restaurant .article-header::after { width: 100%; height: 200px; background-size: cover; top: 200px; }
body.home article.shop-and-restaurant .article-header h2 { padding-top: 50px; }
body.home article.shop-and-restaurant .article-header p { font-size: 1.5rem; padding: 0 30px; margin-top: 20px; }
body.home article.shop-and-restaurant .columned { margin: 35px 0 25px; }
body.home article.shop-and-restaurant .columned .block { width: 50%; height: 150px; margin: 0 0 35px 0; }
body.home article.shop-and-restaurant .columned .block:nth-child(2),
body.home article.shop-and-restaurant .columned .block:nth-child(4) { width: calc(50% - 1px); margin-left: 1px; }
body.home article.shop-and-restaurant .columned .block h3 { width: 80px; height: 30px; font-size: 1.6rem; top: -5px; }
body.home article.shop-and-restaurant .columned .block h4 { display: flex; justify-content: flex-end; flex-direction: column; height: 100%; background-size: 100% auto; }
body.home article.shop-and-restaurant .columned .block h4 > span { font-size: 1.2rem; padding: 10px; }
body.home article.shop-and-restaurant .columned .block h4 .sub { font-size: 1.1rem; }
body.home article.shop-and-restaurant .columned .block p { display: none; }

/* events */
/* body.home article.events { padding-bottom: 100px; } */
body.home article.events .article-header { height: 400px; margin-bottom: 0; }
body.home article.events .article-header::after { width: 100%; height: 200px; background-size: contain; top: 0; left: 0; }
/* body.home article.events .article-header h2 { padding-top: 225px; margin: 0 auto; } */
body.home article.events .article-header h2 { padding-top: 215px; margin: 0 auto; }
body.home article.events .article-header h2 .decorated { top: -10px; }
body.home article.events .columned .block h3 { font-size: 1.3rem; }
body.home article.events .columned .block h3 .heading { margin-bottom: 10px; }
body.home article.events .columned .block p { font-size: 1.2rem; margin-top: 10px; }
body.home article.events .date > .heading { font-size: 1.8rem; }
body.home article.events .date > .heading .sub { font-size: 1rem; }
body.home article.events .date > .sub { font-size: 1rem; }
body.home article.events .events-01 .article-header { background: #67b200; }
body.home article.events .events-01 .article-header::after { width: 100%; height: 200px; background: url(/media/home/events-01_bg_01.jpg) no-repeat center center; background-size: cover; }
body.home article.events .events-01 .columned { padding: 0 30px 80px; margin-top: -110px; }
body.home article.events .events-01 .columned .block { width: 100%; margin-bottom: 20px; }
body.home article.events .events-02 .article-header { background: url(/media/home/events-02_bg_01.jpg) no-repeat right bottom #d00053; background-size: auto 200px; position: relative; }
body.home article.events .events-02 .article-header::after { width: 100%; height: 200px; background-size: cover; }
body.home article.events .events-02 .article-header h2 .heading { margin-bottom: 20px; }
/*
body.home article.events .events-02 .article-header h2 > span.sub { padding: 0 30px; }
body.home article.events .events-02 .article-header h2 > span.sub span:nth-of-type(1) { font-size: 2rem; margin: 15px 0 5px; }
body.home article.events .events-02 .article-header h2 > span.sub span:nth-of-type(2) { font-size: 1.2rem; }
*/
body.home article.events .events-02 .article-header h2 > span.sub { padding: 0 30px; }
body.home article.events .events-02 .article-header h2 > span.sub span:nth-of-type(1) { font-size: 2rem; padding: 5px 0; margin: 20px 0 10px; }
body.home article.events .events-02 .article-header h2 > span.sub span:nth-of-type(2) { font-size: 1.4rem; line-height: 1.4; }

body.home article.events .events-02 .columned .wrapper { width: 100%; background-size: 100% auto; padding: 0 30px; margin-bottom: 20px; }
body.home article.events .events-02 .columned .block { width: 100%; margin-top: 230px; }
body.home article.events .events-02 .buttons { margin-top: 20px; }

/* instagram */
body.home article.instagram h2::after { margin: 10px auto 30px; }
body.home article.instagram .buttons { margin: 40px auto 0; }
body.home article.instagram > div.instagram { margin-left: 4px; }
body.home article.instagram > div.instagram .iscwp-columns { width: 33%; }

/* lake-newtown */
body.home div.lake-newtown { padding: 0 30px; }
body.home div.lake-newtown a { height: 100px; text-align: center; background-position: calc(100% - 10px) center; padding: 0 50px; margin-bottom: 15px; }
body.home div.lake-newtown a .sub { font-family: 'Noto Serif JP', serif; font-size: 1.7rem; font-weight: 300; line-height: 1.2; margin-bottom: 10px; }
body.home div.lake-newtown a .heading { font-size: 1.6rem; font-weight: 300; }

body.home.maintenance div.lake-newtown { margin: 40px auto; }

}
@media (orientation: landscape) and (max-width: 736px) {
}
@media (min-width: 737px) {

body.home #header { background: linear-gradient(to bottom, rgba(116, 0, 48, 1) 10%, rgba(116, 0, 48, .3) 90%, rgba(116, 0, 48, 0) 100%); }
body.home #header #lnav { background-color: transparent; }
body.home #header.tiny #lnav { background-color: #740030; }

/* section-header */
#home-header { height: 100vh; margin-top: 0; }

/* billboard */
#home-intro,
#home-billboard { height: 100vh; }
#billboard-main-copy { width: 80px; height: 500px; font-size: 3.6rem; }

/* billboard: intro */
#intro-copy { width: 350px; height: 125px; font-size: 2rem; background-size: 350px auto; }

/* article */
body.home article { margin: 0 auto 200px; position: relative; }
body.home .article-header { padding-top: 0; }
body.home article h2 { color: #740030; font-family: 'Noto Serif JP', serif; font-size: 3.6rem; font-weight: 600; text-align: center; margin-bottom: 20px; position: relative; }

body.home article a.button { color: #fff; background-image: url(/media/common/arrow_next_w.svg); background-color: #740030; margin: 0 auto; }

/* information */
body.home article.information { display: flex; align-items: center; background-color: #740030; margin: 10px 0 150px; }
body.home article.information h2 { width: 200px; font-size: 1.6rem; }
body.home article.information ul.index-list { width: calc(100% - 200px); background-color: #fff; padding: 0 100px 0 60px; box-sizing: border-box; }
body.home article.information ul.index-list li > span,
body.home article.information ul.index-list li a { min-height: 50px; }
body.home article.information ul.index-list li a { background-image: url(/media/common/arrow_next_b.svg); }
body.home article.information ul.index-list .heading { font-size: 1.4rem; }

/* statement */
body.home article.statement { z-index: 1; }
body.home article.statement h2,
body.home article.statement p { width: 670px; margin: 0 auto; }
body.home article.statement h2 { color: #000; font-size: 2.6rem; font-weight: 300; line-height: 1.4; text-align: left; margin-bottom: 20px; }
body.home article.statement p { margin-bottom: 15px; }
body.home article.statement p.logo { width: 350px; height: 125px; color: #740030; font-family: 'Noto Serif JP', serif; font-size: 2.6rem; font-weight: 300; text-align: center; background: url(/media/common/logo_garden.svg) no-repeat center bottom; background-size: 350px auto; margin: 80px auto 0; z-index: 1; }

body.home article.statement::before,
body.home article.statement::after { content: ''; display: block; width: 396px; height: 484px; background: url(/media/common/bg_flower_01.png) no-repeat; background-size: 660px auto; position: absolute; top: 440px; }
body.home article.statement::before { background-position: right center; left: 0; }
body.home article.statement::after { background-position: left center; right: 0; }

/* garden-map */
body.home article.garden-map .decorated { position: absolute; top: 70px; left: 110px; }

body.home article.garden-map a.spot-01::after,
body.home article.garden-map a.spot-02::after,
body.home article.garden-map a.spot-03::after,
body.home article.garden-map a.spot-04::before,
body.home article.garden-map a.spot-05::before,
body.home article.garden-map a.spot-06::before,
body.home article.garden-map a.spot-07::after,
body.home article.garden-map a.spot-08::after { content: ''; display: block; width: 30px; height: 30px; background-color: #ffd6d6; border: 2px solid #777777; border-radius: 15px; box-sizing: border-box; }

body.home article.garden-map { width: 820px; height: 820px; background-image: url(/media/home/garden-map_common.jpg); background-size: 820px auto; margin: 0 auto 50px; }
body.home article.garden-map p { font-size: 1.4rem; }
body.home article.garden-map a.spot-01,
body.home article.garden-map a.spot-03,
body.home article.garden-map a.spot-08 { display: flex; flex-direction: column; }
body.home article.garden-map a.spot-01::after,
body.home article.garden-map a.spot-03::after,
body.home article.garden-map a.spot-08::after { margin-top: 2px; }
body.home article.garden-map a.spot-02,
body.home article.garden-map a.spot-04,
body.home article.garden-map a.spot-05,
body.home article.garden-map a.spot-06,
body.home article.garden-map a.spot-07 { display: flex; align-items: center; }
body.home article.garden-map a.spot-02::after,
body.home article.garden-map a.spot-07::after { margin-left: 4px; }
body.home article.garden-map a.spot-04::before,
body.home article.garden-map a.spot-05::before,
body.home article.garden-map a.spot-06::before { margin-right: 4px; }
body.home article.garden-map a span { display: inline-block; color: #fff; font-size: 1.4rem; font-weight: 700; line-height: 1; background-color: rgba(92, 0, 37, .7); border-radius: 2px; box-shadow: 1px 1px 2px rgba(0, 0, 0, .5); padding: 5px; }
body.home article.garden-map a.spot-01 { bottom: 600px; left: 380px; }
body.home article.garden-map a.spot-02 { bottom: 410px; left: 60px; }
body.home article.garden-map a.spot-03 { bottom: 420px; left: 370px; }
body.home article.garden-map a.spot-04 { bottom: 430px; left: 480px; }
body.home article.garden-map a.spot-05 { bottom: 370px; left: 60px; }
body.home article.garden-map a.spot-06 { bottom: 340px; left: 590px; }
body.home article.garden-map a.spot-07 { bottom: 270px; left: 300px; }
body.home article.garden-map a.spot-08 { bottom: 260px; left: 640px; }
body.home .modaal-close { right: 10px; bottom: 10px; }
body.home .modaal-container { width: 600px; }
body.home figure.map-spot { width: 540px; }
body.home figure.map-spot figcaption { margin-top: 25px; }
body.home figure.map-spot h4 { font-size: 2.4rem; }
body.home figure.map-spot p { margin-top: 20px; }

/* calendar */
body.home article.calendar { width: 980px; }
body.home article.calendar h2 { margin-bottom: 40px; }
body.home article.calendar > p { font-size: 1.4rem; font-weight: 300; line-height: 1; text-align: center; }
body.home article.calendar > p.lead { font-size: 2rem; }
body.home article.calendar .columned { margin-top: 40px; }
body.home article.calendar .columned .block { width: 220px; background-size: 220px auto; }
body.home article.calendar .columned .block h3 { margin-bottom: 165px; }
body.home article.calendar .columned .block h3 .sub { font-size: 1.1rem; }
body.home article.calendar .columned .block h4 { font-size: 1.6rem; }
body.home article.calendar .columned .block p { font-size: 1.4rem; margin-top: 10px; }

/* shop-and-restaurant */
body.home article.shop-and-restaurant { margin-bottom: 150px; }
body.home article.shop-and-restaurant .article-header { width: 100%; height: 300px; background-size: 1366px 300px; margin-bottom: 0; }
body.home article.shop-and-restaurant .article-header::after { width: 383px; height: 300px; background-size: 383px 300px; top: 0; right: 20px; }
body.home article.shop-and-restaurant .article-header h2,
body.home article.shop-and-restaurant .article-header p { width: 450px; }
body.home article.shop-and-restaurant .article-header h2 { padding-top: 70px; }
body.home article.shop-and-restaurant .article-header p { font-size: 1.8rem; margin-top: 20px; }
body.home article.shop-and-restaurant .columned { width: 993px; padding-left: 25px; margin: -50px auto 0; }
body.home article.shop-and-restaurant .columned .block { width: 306px; margin-right: 25px; margin-bottom: 50px; }
body.home article.shop-and-restaurant .columned .block h3 { width: 120px; height: 42px; font-size: 2.4rem; top: -10px; }
body.home article.shop-and-restaurant .columned .block h4 { background-size: 306px auto; padding-top: 195px; }
body.home article.shop-and-restaurant .columned .block h4 > span { font-size: 1.6rem; padding: 10px; }
body.home article.shop-and-restaurant .columned .block h4 .sub { font-size: 1.1rem; }
body.home article.shop-and-restaurant .columned .block p { font-size: 1.4rem; font-weight: 300; line-height: 1.6; margin-top: 10px; }

/* events */
/* body.home article.events { padding-bottom: 60px; } */
body.home article.events .article-header { width: 100%; height: 300px; margin-bottom: 0; }
body.home article.events .article-header::after { width: 383px; height: 300px; background-size: 383px 300px; top: 0; left: 20px; }
/* body.home article.events .article-header h2 { width: 450px; padding-top: 70px; margin: 0 auto; } */
body.home article.events .article-header h2 { width: 450px; padding-top: 35px; margin: 0 auto; }
body.home article.events .article-header h2 .decorated { top: -40px; left: -280px; }
body.home article.events .columned .block h3 { font-size: 1.6rem; }
body.home article.events .columned .block h3 .heading { margin-bottom: 15px; }
body.home article.events .columned .block p { font-size: 1.4rem; margin-top: 15px; }
body.home article.events .date > .heading { font-size: 2rem; }
body.home article.events .date > .heading .sub { font-size: 1.2rem; }
body.home article.events .date > .sub { font-size: 1.1rem; }
body.home article.events .events-01 { padding-bottom: 100px; }
body.home article.events .events-01 .article-header { background-color: #dfffb4; }
body.home article.events .events-01 .article-header::after { background-image: url(/media/home/events-01_bg_01.jpg); }
body.home article.events .events-01 .columned { width: 844px; margin: -130px auto 0; }
body.home article.events .events-01 .columned .block { width: 406px; }
body.home article.events .events-02 .article-header { background-size: 1366px 300px; }
/*
body.home article.events .events-02 .article-header h2 > span.sub,
body.home article.events .events-02 .article-header h2 > span.sub span { width: 420px; }
body.home article.events .events-02 .article-header h2 > span.sub span:nth-of-type(1) { font-size: 2.4rem; margin: 15px 0 5px; }
body.home article.events .events-02 .article-header h2 > span.sub span:nth-of-type(2) { font-size: 1.6rem; }
*/
body.home article.events .events-02 .article-header h2 > span.sub { width: 375px; }
body.home article.events .events-02 .article-header h2 > span.sub span:nth-of-type(1) { font-size: 2.8rem; padding: 7px 0; margin: 25px 0 10px; }
body.home article.events .events-02 .article-header h2 > span.sub span:nth-of-type(2) { font-size: 1.8rem; line-height: 1.6; }

body.home article.events .events-02 .columned { width: 980px; margin: -45px auto 0; }
body.home article.events .events-02 .columned .wrapper { width: 306px; background-size: 306px 200px; padding-top: 160px; margin-bottom: 40px; }
body.home article.events .events-02 .columned .block { width: 280px; }
body.home article.events .events-02 .buttons { margin-top: 10px; }

/* instagram */
body.home article.instagram { width: 980px; }
body.home article.instagram h2::after { margin: 20px auto 50px; }
body.home article.instagram .buttons { margin: 50px auto 0; }

/* lake-newtown */
body.home div.lake-newtown { width: 670px; margin: 0 auto 100px; }
body.home div.lake-newtown a { width: 670px; height: 120px; background-position: calc(100% - 30px) center; margin-bottom: 20px; }
body.home div.lake-newtown a .sub { font-size: 2.6rem; font-weight: 500; margin-bottom: 10px; }
body.home div.lake-newtown a .heading { font-size: 3rem; }
body.home div.lake-newtown p { font-size: 1.6rem; }

body.home.maintenance div.lake-newtown { margin: 100px auto; }

}



/* information
   ========================================================================== */

body.information .section-header { background-image: url(/media/section-header/bg_information.jpg); }

body.information .article-header { border-bottom: 1px solid #486535; }
body.information .article-header .extras { display: flex; justify-content: space-between; align-items: center; }
body.information .article-header .extras .badge { flex: 0 0 auto; margin-right: 20px; }

body.information.publication .article-header .extras .badge { background-color: #ff81a8; }
body.information.events .article-header .extras .badge { color: #fff; background-color: #d00053; }

body.information .article-header .extras .date { flex: 1 0 auto; }
body.information .article-header .extras .badge.pdf { flex: 0 0 70px; width: 70px; font-size: 1.1rem; background: url(/media/common/icon_pdf.svg) no-repeat calc(100% - 10px) center #fff; background-size: 15px; border: 1px solid #000; padding-right: 20px; box-sizing: border-box; }

body.information .article-footer { display: flex; justify-content: center; align-items: flex-end; background: url(/media/common/logo_garden_combo.svg) no-repeat right top; margin: 100px 0 0; }

@media (min-width: 320px) and (max-width: 736px) {

body.information .section-header.billboard { height: 150px; }
body.information .section-header div.heading { min-width: 180px; }
body.information .article-header { padding: 30px 0 30px; margin-bottom: 40px; }
body.information .article-header .extras { margin-bottom: 10px; }
body.information article { padding: 0 15px; }
body.information .article-footer { height: 125px; background-size: 150px auto; }
body.information.index .section-body { padding: 0; }
body.information.index article { padding: 0; }

}
@media (orientation: landscape) and (max-width: 736px) {
}
@media (min-width: 737px) {

body.information article { width: 760px; margin: 0 auto; }
body.information.index article { width: 900px; }
body.information .section-header.billboard { height: 300px; }
body.information .article-header { width: 100%; padding-bottom: 30px; margin-bottom: 30px; }
body.information .article-header .extras { margin-bottom: 20px; }
body.information .article-body { width: 100%; }
body.information .article-footer { height: 200px; background-size: 250px auto; }
body.information.index .section-header { margin-bottom: 80px; }
body.information.index ul.index-list { width: 900px; }

}



/* about-garden
   ========================================================================== */

body.about-garden .section-header { background-image: url(/media/section-header/bg_about-garden.jpg); }

@media (min-width: 320px) and (max-width: 736px) {

body.about-garden .section-header div.heading { line-height: 1.2; }
body.about-garden .article-body > .block { margin-bottom: 40px; }
body.about-garden .article-body > .block .columned .text { margin-top: 20px; }

}
@media (orientation: landscape) and (max-width: 736px) {
}
@media (min-width: 737px) {

body.about-garden .article-body { width: 100%; }

body.about-garden .article-body > .block { margin-bottom: 50px; position: relative; }
body.about-garden .article-body > .block .columned { width: 980px; align-items: center; margin: 0 auto; }
body.about-garden .article-body > .block .columned figure,
body.about-garden .article-body > .block .columned .text { width: 474px; }

body.about-garden .article-body > .block:nth-of-type(2) .columned,
body.about-garden .article-body > .block:nth-of-type(4) .columned,
body.about-garden .article-body > .block:nth-of-type(6) .columned,
body.about-garden .article-body > .block:nth-of-type(8) .columned { flex-direction: row-reverse; }
body.about-garden .article-body > .block:nth-of-type(2) .text,
body.about-garden .article-body > .block:nth-of-type(4) .text,
body.about-garden .article-body > .block:nth-of-type(6) .text,
body.about-garden .article-body > .block:nth-of-type(8) .text { text-align: right; }

body.about-garden .article-body > .block:nth-of-type(1)::before,
body.about-garden .article-body > .block:nth-of-type(4)::before,
body.about-garden .article-body > .block:nth-of-type(7)::before,
body.about-garden .article-body > .block:nth-of-type(8)::before { content: ''; display: block; background-repeat: no-repeat; position: absolute; }
body.about-garden .article-body > .block:nth-of-type(1)::before { width: 330px; height: 484px; background: url(/media/common/bg_flower_01.png) left center; background-size: 660px auto; right: 0; top: -200px; }
body.about-garden .article-body > .block:nth-of-type(4)::before { width: 330px; height: 484px; background: url(/media/common/bg_flower_01.png) right center; background-size: 660px auto; left: 0; top: -50px; }
body.about-garden .article-body > .block:nth-of-type(7)::before { width: 250px; height: 331px; background: url(/media/common/bg_flower_03.png) left center; background-size: 390px auto; right: 0; top: 0; }
body.about-garden .article-body > .block:nth-of-type(8)::before { width: 250px; height: 331px; background: url(/media/common/bg_flower_03.png) right center; background-size: 390px auto; left: 0; top: 0; }

}



/* shop-and-restaurant
   ========================================================================== */

body.shop-and-restaurant .section-header { background-image: url(/media/section-header/bg_shop-and-restaurant.jpg); }

body.shop-and-restaurant .article-body > .block .columned figcaption { font-size: 1.2rem; font-weight: 300; text-align: center; margin-top: 10px; }

@media (min-width: 320px) and (max-width: 736px) {

body.shop-and-restaurant .section-header div.heading { font-size: 2.4rem; }
body.shop-and-restaurant .article-header { margin-bottom: 0; }
body.shop-and-restaurant .article-header .columned { margin-top: 20px; }
body.shop-and-restaurant .article-header .columned img { width: 30%; }
body.shop-and-restaurant .article-body table tr td:first-child { width: 33%; }
body.shop-and-restaurant .article-body > .block { padding-top: 80px; }
body.shop-and-restaurant .article-body > .block .block { margin-top: 20px; }
body.shop-and-restaurant .article-body > .block .columned figure { width: calc(50% - 5px); margin-bottom: 20px; }

}
@media (orientation: landscape) and (max-width: 736px) {
}
@media (min-width: 737px) {

body.shop-and-restaurant .section-header div.heading { font-size: 3.6rem; font-weight: 600; }
body.shop-and-restaurant .article-header { margin-bottom: 75px; }
body.shop-and-restaurant .article-header .columned { margin-top: 50px; }
body.shop-and-restaurant .article-header .columned img { width: 200px; }
body.shop-and-restaurant .article-body > .block { padding-top: 75px; margin-bottom: 75px; }
body.shop-and-restaurant .article-body > .block > figure,
body.shop-and-restaurant .article-body > .block > .block { width: 474px; }
body.shop-and-restaurant .article-body table tr td:first-child { width: 25%; }
body.shop-and-restaurant .article-body > .block .columned figure { width: 220px; margin-bottom: 30px; }

}



/* events
   ========================================================================== */

body.events .section-header { background-image: url(/media/section-header/bg_events.jpg); }
body.events .section-header div.heading { font-weight: 600; text-align: left; }
body.events .section-header div.sub { flex-direction: column; color: #740030; font-family: 'Noto Serif JP', serif; font-weight: 500; background-color: #fff; }
body.events .section-header div > span { display: block; }
body.events .section-header div.heading > span.sub span { display: block; }
body.events .section-header div.heading > span.sub span:nth-of-type(1) { font-weight: 500; }
body.events .section-header div.heading > span.sub span:nth-of-type(2) { font-family: 'Noto Sans JP', sans-serif; font-weight: 300; text-align: right; }
body.events .section-header div.sub > span:nth-of-type(2) { font-family: 'Noto Sans JP', sans-serif; font-weight: 300; }
body.events .article-body .date { line-height: 1.2; }
body.events .article-body .date > span { display: block; }
body.events .article-body .date > .heading { font-family: 'Noto Serif JP', serif; font-weight: 700; }
body.events .article-body .date > .sub { font-weight: 300; }
body.events .article-body .block.sub { border-top: 1px solid #707070; }

@media (min-width: 320px) and (max-width: 736px) {

body.events .section-header { margin-bottom: 50px; }
body.events .section-header div.heading { width: 345px; min-height: 150px; font-size: 2.4rem; }
body.events .section-header div.sub { width: 345px; font-size: 1.4rem; }
body.events .section-header div.heading > span.sub { width: 280px; }
body.events .section-header div.heading > span.sub span:nth-of-type(1) { font-size: 1.7rem; margin: 10px 0 5px; }
body.events .section-header div.heading > span.sub span:nth-of-type(2) { font-size: 1.2rem; }
body.events .section-header div.sub > span:nth-of-type(2) { font-size: 1.1rem; margin-top: 5px; }
body.events .article-body .block,
body.events .article-body figure,
body.events .article-body .text { width: 100%; }
body.events .article-body figure { margin-bottom: 20px; }
body.events .article-body p { line-height: 1.4; }
body.events .article-body .date > .heading { font-size: 2.2rem; }
body.events .article-body .date > .heading .sub { font-size: 1.3rem; }
body.events .article-body .date > .sub { font-size: 1.2rem; margin-top: 5px; }
body.events .article-body table tr td:first-child { width: 30%; }
body.events .article-body .item-05 table tr td:first-child { width: 40%; }
body.events .article-body .block.sub { border-top: 1px solid #707070; padding-top: 20px; }
body.events .article-body p.note { margin-top: 20px; }

}
@media (orientation: landscape) and (max-width: 736px) {
}
@media (min-width: 737px) {

body.events .section-header { margin-bottom: 50px; }
body.events .section-header div.heading { width: 500px; font-size: 3.6rem; }
body.events .section-header div.sub { width: 500px; font-size: 2rem; }
body.events .section-header div.heading > span.sub { width: 420px; }
body.events .section-header div.heading > span.sub span:nth-of-type(1) { font-size: 2.4rem; margin: 15px 0 5px; }
body.events .section-header div.heading > span.sub span:nth-of-type(2) { font-size: 1.6rem; }
body.events .section-header div.sub > span:nth-of-type(2) { font-size: 1.6rem; margin-top: 5px; }
body.events .article-body figure,
body.events .article-body .text { width: 474px; }
body.events .article-body figure { margin-bottom: 30px; }
body.events .article-body p { line-height: 1.5; }
body.events .article-body .date > .heading { font-size: 2.8rem; }
body.events .article-body .date > .heading .sub { font-size: 1.6rem; }
body.events .article-body .date > .sub { font-size: 1.4rem; margin-top: 5px; }
body.events .article-body table tr td:first-child { width: 20%; }
body.events .article-body .item-05 table tr td:first-child { width: 30%; }
body.events .article-body .block.sub { padding-top: 30px; }

}



/* company
   ========================================================================== */

body.company .section-header { line-height: 1.4; background-image: url(/media/section-header/bg_company.jpg); }

body.company article > div { position: relative; }
body.company article > div::before { content: ''; color: #740030; font-weight: 100; }
body.company article > div h1 { display: flex; justify-content: center; align-items: center; box-sizing: border-box; font-weight: 300; }
body.company .philosophy::before { content: 'PHILOSOPHY'; }

body.company .history::before { content: 'HISTORY'; }
body.company .history table th,
body.company .history table td { border: none; }
body.company .history table th { font-weight: 500; padding-top: 5px; }
body.company .history table td { font-weight: 300; }
body.company .history table tr:last-child td { padding-bottom: 0; }

body.company .profile::before { content: 'PROFILE'; }

body.company .profile table { border-top: 1px solid #000; }
body.company .profile table caption { font-weight: 500; margin-bottom: 20px; }

body.company .profile table th,
body.company .profile table td { line-height: 1.4; border: none; }
body.company .profile table tr:nth-child(6) td { padding: 0; }
body.company .profile table th { font-weight: 300; }
body.company .profile table td { font-weight: 500; }
body.company .profile table:nth-of-type(2) td > span { display: block; }
body.company .profile table:nth-of-type(2) td > span.sub { font-weight: 300; margin-top: 10px; }
body.company .profile table:nth-of-type(2) td a.button { margin-top: 20px; }

@media (min-width: 320px) and (max-width: 736px) {

body.company .section-header { margin-bottom: 40px; }
body.company .section-header div.heading { width: 340px; font-size: 1.7rem; }
body.company article > div { padding: 0; margin-bottom: 60px; }
body.company article > div::before { display: block; font-size: 5rem; margin-bottom: 15px; }
body.company article > div h1 { width: 200px; height: 40px; border: 2px solid #000; font-size: 2rem; margin-bottom: 50px; }
body.company .philosophy .styled { display: flex; flex-direction: column-reverse; padding: 0 15px; }
body.company .philosophy h1 { margin-left: -15px; }
body.company .philosophy figure { width: 155px; }
body.company .philosophy figure.right { margin: 30px 0 0; }
body.company .history table { width: calc(100% - 155px); }
body.company .history table th { width: 30%; font-size: 1.5rem; }
body.company .history table td { font-size: 1.3rem; line-height: 1.6; padding-bottom: 20px; }
body.company .history figure { width: 135px; }
body.company .history figure img { margin-bottom: 100px; }
body.company .profile table { margin-top: 30px; }
body.company .profile table caption { font-size: 1.5rem; }
body.company .profile table th,
body.company .profile table td { font-size: 1.3rem; border: none; padding: 20px 0 0; }
body.company .profile table th { width: 25%; }

}
@media (orientation: landscape) and (max-width: 736px) {
}
@media (min-width: 737px) {

body.company .section-header { margin-bottom: 100px; }
body.company article > div { width: 870px; margin: 0 auto 150px; }
body.company article > div::before { display: inline-block; font-size: 7rem; transform: rotate(90deg); position: absolute; }
body.company article > div h1 { width: 360px; height: 80px; border: 3px solid #000; font-size: 3rem; margin-bottom: 50px; }
body.company .philosophy .styled { width: 760px; }
body.company .philosophy::before { left: -270px; top: 161px; }
body.company .philosophy figure { width: 220px; }
body.company .history::before { left: -201px; top: 92px; }
body.company .history table { width: 536px; }
body.company .history table th { width: 20%; font-size: 2rem; }
body.company .history table td { font-size: 1.6rem; line-height: 1.75; padding-bottom: 40px; }
body.company .history figure { width: 240px; }
body.company .history figure img { margin-bottom: 40px; }
body.company .profile::before { left: -198px; top: 88px; }
body.company .profile table { margin-top: 50px; }
body.company .profile table caption { font-size: 2rem; }
body.company .profile table th,
body.company .profile table td { font-size: 1.6rem; line-height: 1.4; border: none; padding: 50px 0 0; }
body.company .profile table th { width: 25%; }

}



/* calendar
   ========================================================================== */

body.calendar.spring .section-header { background-image: url(/media/section-header/bg_calender_spring.jpg); }
body.calendar.roseseason .section-header { background-image: url(/media/section-header/bg_calender_roseseason.jpg); }
body.calendar.summer .section-header { background-image: url(/media/section-header/bg_calender_summer.jpg); }
body.calendar.autumn .section-header { background-image: url(/media/section-header/bg_calender_autumn.jpg); }

body.calendar .section-header div.sub { color: #740030; justify-content: space-between; background-color: #fff; }
body.calendar .section-header div.sub span:nth-of-type(1) { font-family: 'Noto Serif JP', serif; font-weight: 500; }
body.calendar.roseseason .section-header div.sub span:nth-of-type(1) { font-weight: 500; }
body.calendar .section-header div.sub span:nth-of-type(2) { font-weight: 300; }
body.calendar .article-header h1,
body.calendar .article-header p { text-align: center; }
body.calendar .buttons { display: flex; justify-content: space-between; }
body.calendar a.button { display: flex; justify-content: center; align-items: center; color: #740030; background: none; border-color: #740030; }
body.calendar a.button > span { display: flex; justify-content: space-between; align-items: flex-end; width: 100%; }
body.calendar a.button > span span { display: inline-block; }
body.calendar a.button > span .heading { font-family: 'Noto Serif JP', serif; font-weight: 500; }
body.calendar a.button > span .sub { font-weight: 300; }
body.calendar a.button.roseseason > span,
body.calendar a.button.roseseason > span span { display: block; }
body.calendar a.button.roseseason > span .heading { }
body.calendar a.button.roseseason > span .sub { text-align: right; }
body.calendar.spring a.button.spring,
body.calendar.roseseason a.button.roseseason,
body.calendar.summer a.button.summer,
body.calendar.autumn a.button.autumn { opacity: .1; }

/* slide */
body.calendar .slide figure figcaption { min-height: 50px; font-weight: 500; line-height: 1.4; text-align: center; }
body.calendar .slick-prev,
body.calendar .slick-next { background: no-repeat center center; transition: .25s; }
body.calendar .slick-prev:before,
body.calendar .slick-next:before { font-size: 0; color: transparent; }
body.calendar .slick-prev:hover,
body.calendar .slick-prev:focus,
body.calendar .slick-next:hover,
body.calendar .slick-next:focus { background: no-repeat center center; opacity: .4; }
body.calendar .slick-prev,
body.calendar .slick-prev:hover,
body.calendar .slick-prev:focus { background-image: url(/media/common/arrow_prev_slide.svg); }
body.calendar .slick-next,
body.calendar .slick-next:hover,
body.calendar .slick-next:focus { background-image: url(/media/common/arrow_next_slide.svg); }

/* expandable */
body.calendar .article-body h1 { color: #838383; font-family: 'Noto Serif JP', serif; font-weight: 500; text-align: center; }
body.calendar .article-body .columned figure figcaption { min-height: 80px; line-height: 1.5; font-weight: 300; margin: 10px 0; }

body.calendar .expandable .inner { perspective: 1000px; position: relative; }

body.calendar .expandable .inner > .block,
body.calendar .expandable .inner a.switch span { transition: all .25s ease-in-out; }
body.calendar .expandable .inner .switches { display: flex; justify-content: center; border-bottom: 1px solid #ddd; }
body.calendar .expandable .inner a.switch { display: flex; justify-content: center; align-items: center; position: relative; }
body.calendar .expandable .inner a.switch span { display: inline-block; text-decoration: underline; position: absolute; }
body.calendar .expandable .inner a.switch span::after { display: inline-block; }
body.calendar .expandable .inner a.switch span:nth-child(1)::after { content: '▼'; }
body.calendar .expandable .inner a.switch span:nth-child(2)::after { content: '▲'; }

body.calendar .expandable .inner > .block { position: relative; overflow: hidden; opacity: 1; z-index: 2; }
body.calendar .article-body .inner > .block { justify-content: flex-start; }

body.calendar .expandable .inner input[type=checkbox] { position: absolute; cursor: pointer; width: 100%; height: 100%; z-index: 1; opacity: 0; }
body.calendar .expandable .inner input[type=checkbox]:checked ~ div { margin-top: 0; max-height: 0; opacity: 0; transform: translate(0, 50%); }
body.calendar .expandable .inner input[type=checkbox] ~ span a span:nth-child(1),
body.calendar .expandable .inner input[type=checkbox]:checked ~ span a span:nth-child(2) { opacity: 0; }
body.calendar .expandable .inner input[type=checkbox]:checked ~ span a span:nth-child(1),
body.calendar .expandable .inner input[type=checkbox] ~ span a span:nth-child(2) { opacity: 1; }

@media (min-width: 320px) and (max-width: 736px) {

body.calendar .section-body,
body.calendar article { padding: 0; }
body.calendar .section-header div.heading,
body.calendar .section-header div.sub { width: 280px; }
body.calendar .section-header div.sub span:nth-of-type(1) { font-size: 3rem; }
body.calendar.roseseason .section-header div.sub span:nth-of-type(1) { font-size: 2rem; }
body.calendar .section-header div.sub span:nth-of-type(2) { font-size: 1.4rem; }
body.calendar .article-header { padding: 40px 30px 0; margin-bottom: 75px; }
body.calendar .article-footer { padding: 0 15px; }

/* nav */
body.calendar .buttons { flex-wrap: wrap; }
body.calendar a.button { width: 160px; height: 50px; padding: 0 10px; margin-bottom: 20px; }
body.calendar a.button > span .heading { font-size: 3rem; }
body.calendar a.button > span .sub { font-size: 1.1rem; }
body.calendar a.button.roseseason > span .heading { font-size: 1.9rem; }

/* slide */
body.calendar .slide { width: 280px; margin: 0 auto; }
body.calendar .slide figure { width: 280px; }
body.calendar .slide figure figcaption { font-size: 1.3rem; margin-top: 10px; }
body.calendar .slick-prev,
body.calendar .slick-next { width: 18px; height: 36px; background-size: 18px 36px; top: 35%; }
body.calendar .slick-prev { left: -28px; }
body.calendar .slick-next { right: -28px; }
body.calendar .slick-prev:hover,
body.calendar .slick-prev:focus,
body.calendar .slick-next:hover,
body.calendar .slick-next:focus { background-size: 18px 36px; }

/* expandable */
body.calendar .article-body { padding-bottom: 60px; }
body.calendar .article-body h1 { font-size: 3.4rem; margin-bottom: 20px; }
body.calendar .article-body .columned figure { width: 160px; }
body.calendar .article-body .columned figure figcaption { min-height: 80px; font-size: 1.3rem; margin: 10px 0; }
body.calendar .expandable .inner .switches { padding-bottom: 20px; margin: 20px auto 0; }
body.calendar .expandable .inner a.switch { width: 100px; height: 50px; }
body.calendar .expandable .inner a.switch span::after { margin-left: 10px; }
body.calendar .expandable .inner > .block { justify-content: center; max-height: 10000px; }
body.calendar .expandable .inner > .block > .block { margin: 0 10px; }

}
@media (orientation: landscape) and (max-width: 736px) {
}
@media (min-width: 737px) {

body.calendar .section-header div.sub span:nth-of-type(1) { font-size: 3rem; }
body.calendar.roseseason .section-header div.sub span:nth-of-type(1) { font-size: 2rem; }
body.calendar .section-header div.sub span:nth-of-type(2) { font-size: 1.6rem; }
body.calendar .article-header { margin-bottom: 75px; }
body.calendar .article-footer { margin-top: 100px; }

/* nav */
body.calendar .buttons { width: 980px; margin: 0 auto; }
body.calendar a.button { width: 220px; height: 50px; padding: 0 10px; }
body.calendar a.button > span .heading { font-size: 3rem; }
body.calendar a.button > span .sub { font-size: 1.1rem; }
body.calendar a.button.roseseason > span .heading { font-size: 2rem; }

/* slide */
body.calendar .slide { width: 440px; margin: 0 auto 50px; }
body.calendar .slide figure { width: 440px; }
body.calendar .slide figure figcaption { font-size: 1.6rem; margin-top: 25px; }
body.calendar .slick-prev,
body.calendar .slick-next { width: 33px; height: 66px; background-size: 33px 66px; }
body.calendar .slick-prev { left: -73px; }
body.calendar .slick-next { right: -73px; }
body.calendar .slick-prev:hover,
body.calendar .slick-prev:focus,
body.calendar .slick-next:hover,
body.calendar .slick-next:focus { background-size: 33px 66px; }

/* expandable */
body.calendar .article-body { width: 100%; }
body.calendar .article-body h1 { font-size: 4rem; margin: 75px 0 50px; }
body.calendar .article-body .columned figure { width: 220px; }
body.calendar .article-body .columned figure figcaption { font-size: 1.4rem; }
body.calendar .expandable .inner .switches { padding-bottom: 50px; margin: 50px auto 0; }
body.calendar .expandable .inner a.switch { width: 100px; height: 50px; }
body.calendar .expandable .inner a.switch span::after { margin-left: 10px; }
body.calendar .expandable .inner > .block { width: 1005px; max-height: 5000px; padding-left: 25px; margin: 0 auto; }
body.calendar .expandable .inner > .block > .block { margin-right: 25px; }

}



/* price
   ========================================================================== */

body.price .article-body > .block { position: relative; }

body.price .article-body h2.boxed { display: flex; justify-content: center; align-items: center; color: #fff; font-family: 'Noto Serif JP', serif; font-weight: 500; text-align: center; background-color: #d00053; }
body.price .article-body h3 { color: #d00053; font-weight: 500; }
body.price .article-body p.sub { color: #666; font-size: 1.1rem; font-weight: 300; line-height: 1.4; }
body.price .article-body th,
body.price .article-body td { font-weight: 500; line-height: 1.5; border: none; border-bottom: 1px solid #707070; }
body.price .article-body .schedule p.enlarged { font-weight: 300; }
body.price .article-body .schedule th,
body.price .article-body .schedule td { font-weight: 500; vertical-align: bottom; }

body.price .article-body .price-list table { border-top: 1px solid #486535; }
body.price .article-body .price-list th,
body.price .article-body .price-list td { border-bottom-color: #486535; vertical-align: middle; }
body.price .article-body .price-list th { color: #fff; text-align: right; background-color: #740030; }
body.price .article-body .price-list th:first-of-type { text-align: left; }
body.price .article-body .price-list th:last-of-type { text-align: center; }
body.price .article-body .price-list td.sum { text-align: right; }
body.price .article-body .price-list tr:nth-of-type(3) td, 
body.price .article-body .price-list tr:nth-of-type(5) td { background-color: rgba(208, 0, 83, .1); }
body.price .article-body .price-list td span.sub { color: #666; display: block; font-weight: 300; }
body.price .article-body .price-list td[rowspan] { text-align: center; }
body.price .article-body .price-list tr:nth-of-type(7) td,
body.price .article-body .price-list tr:nth-of-type(8) td,
body.price .article-body .price-list tr:nth-of-type(9) td { border-bottom: 1px dashed #000; }
body.price .article-body .price-list td a { color: #d00053; }
body.price .article-body .block.buttons a.button { display: flex; justify-content: center; align-items: center; position: relative; }
body.price .article-body .block.buttons a.button span { font-weight: 500; }
body.price .article-body .block.buttons a.button::after { content: ''; display: block; background: url(/media/common/bg_button_bus-tours.svg) 0 0; position: absolute; top: 0; left: 0; }
body.price .article-body .block.buttons a.button span.sub { display: inline-block; color: #fff; font-weight: 500; position: absolute; }
body.price .article-body .stamp-card figure { box-shadow: 3px 3px 6px rgba(0, 0, 0, .2); border-radius: 15px; }
body.price .article-body .rules > h3 { color: #000; font-weight: 300; text-align: center; }
body.price .article-body .rules > p.note { font-weight: 500; }

body.price .article-body .rules div.boxed { border: 1px dashed #707070; box-sizing: border-box; }

body.price .article-body .rules ul li { font-weight: 500; line-height: 1.5; position: relative; }
body.price .article-body .rules ul li::before { content: '●'; display: inline-block; position: absolute; left: 0; }
body.price .article-body .rules ul li span.sub { display: block; font-weight: 300; margin-top: 10px; }

body.price .article-body .rules .buttons { justify-content: flex-start; }
body.price .article-body .rules a.mailto-item { color: #d00053; text-decoration: underline; }
body.price .article-body .rules a.mailto-item:hover { text-decoration: none; }

@media (min-width: 320px) and (max-width: 736px) {

body.price article { padding: 0; }
body.price .article-header { margin-bottom: 0; }
body.price .article-body > .block { margin: 0 auto 100px; }
body.price .article-body h2.boxed { width: 200px; height: 40px; font-size: 1.4rem; line-height: 1.2; margin: 0 auto 30px; }
body.price .article-body h3 { font-size: 1.5rem; margin-bottom: 20px; }
body.price .article-body .schedule,
body.price .article-body .price-list { margin-bottom: 50px; }
body.price .article-body .schedule p.enlarged { font-size: 2rem; }
body.price .article-body .schedule th,
body.price .article-body .schedule td { font-size: 1.4rem; padding: 15px 0 5px; }
body.price .article-body .schedule figure { display: none; }
body.price .article-body .price-list th,
body.price .article-body .price-list td { font-size: 1.2rem; padding: 10px 0; }
body.price .article-body .price-list th { width: 20%; font-size: 1.1rem; }
body.price .article-body .price-list th:first-of-type { width: 37%; }
body.price .article-body .price-list th:last-of-type { width: 23%; }
body.price .article-body .price-list th:first-of-type,
body.price .article-body .price-list td:first-of-type { padding-left: 10px;}
body.price .article-body .price-list th:nth-of-type(3),
body.price .article-body .price-list td:nth-of-type(3) { padding: 10px 10px 10px 5px; }
body.price .article-body .price-list td span.sub { color: #000; font-size: .9rem; line-height: 1; margin-top: 3px; }
body.price .article-body .price-list tr:nth-of-type(8) td span.sub { font-size: 1.1rem; margin-top: 5px; }
body.price .article-body .block.buttons a.button { width: 280px; height: 70px; padding: 15px 40px; }
body.price .article-body .block.buttons a.button span { font-size: 1.4rem; }
body.price .article-body .block.buttons a.button::after { width: 100px; height: 20px; }
body.price .article-body .block.buttons a.button span.sub { font-size: 1.2rem; top: 3px; left: 15px; }
body.price .article-body .stamp-card figure { width: 200px; margin: 30px auto 0; }
body.price .article-body .rules { margin-bottom: 0; }
body.price .article-body .rules h2 { margin: 0 auto 30px; }
body.price .article-body .rules > h3 { font-size: 2rem; }
body.price .article-body .rules > p.note { font-size: 1.4rem; }
body.price .article-body .rules > p.sub { margin-top: 15px; }
body.price .article-body .rules div.boxed { padding: 10px; margin-bottom: 0; }
body.price .article-body .rules ul li { font-size: 1.4rem; padding-left: 20px; margin-bottom: 15px; }
body.price .article-body .rules ul li::before { width: 20px; }
body.price .article-body .rules ul li span.sub { font-size: 1.3rem; line-height: 1.5; }
body.price .article-body .rules .buttons { flex-wrap: wrap; }
body.price .article-body .rules .buttons a.button { display: flex; justify-content: center; align-items: center; width: 130px; padding: 0 15px 0 0; margin: 0 15px 10px 0; box-sizing: border-box; }
body.price .article-body .rules div.boxed ul:nth-of-type(2) { margin-top: 20px; }
body.price .article-body .rules div.boxed p a { display: block; }

}
@media (orientation: landscape) and (max-width: 736px) {
}
@media (min-width: 737px) {

body.price .article-header { margin-bottom: 0; }
body.price .article-body { width: 100%; }
body.price .article-body > .block { width: 980px; margin: 100px auto; }
body.price .article-body h2.boxed { width: 360px; height: 80px; font-size: 2.6rem; line-height: 1.2; }
body.price .article-body h3 { font-size: 2rem; margin-bottom: 30px; }
body.price .article-body th,
body.price .article-body td { font-size: 2rem; }
body.price .article-body .schedule { margin-bottom: 50px; }
body.price .article-body .schedule .text { width: 490px; }
body.price .article-body .schedule p.enlarged { font-size: 3rem; }
body.price .article-body .schedule th,
body.price .article-body .schedule td { font-size: 2rem; padding: 20px 0 10px; }
body.price .article-body .schedule figure { width: 427px; }
body.price .article-body .price-list th,
body.price .article-body .price-list td { padding: 15px 40px 15px 40px; }
body.price .article-body .price-list th { width: 22%; }
body.price .article-body .price-list th:first-of-type { width: 34%; }
body.price .article-body .price-list td span.sub { font-size: 1.6rem; line-height: 1.4; }
body.price .article-body .price-list tr:nth-of-type(8) td span.sub { font-size: 1.1rem; margin-top: 5px; }
body.price .article-body .block.buttons { width: 100%; margin-bottom: 180px; }
body.price .article-body .block.buttons a.button { width: 500px; height: 70px; }
body.price .article-body .block.buttons a.button span { font-size: 2rem; }
body.price .article-body .block.buttons a.button::after { width: 100px; height: 20px; }
body.price .article-body .block.buttons a.button span.sub { font-size: 1.2rem; top: 3px; left: 15px; }
body.price .article-body .stamp-card { margin-bottom: 180px; }
body.price .article-body .stamp-card .text { width: 550px; }
body.price .article-body .stamp-card figure { width: 360px; }
body.price .article-body .rules { width: 100%; }
body.price .article-body .rules div.boxed,
body.price .article-body .rules > h3,
body.price .article-body .rules > p { width: 980px; margin: 50px auto; }
body.price .article-body .rules h2 { margin: 50px auto; }
body.price .article-body .rules > h3 { font-size: 3rem; }
body.price .article-body .rules > p.note { font-size: 2rem; }
body.price .article-body .rules > p.sub { margin-top: 20px; }
body.price .article-body .rules div.boxed { padding: 20px 40px; margin-bottom: 0; }
body.price .article-body .rules ul li { font-size: 2rem; padding-left: 25px; margin-bottom: 25px; }
body.price .article-body .rules ul li::before { width: 25px; }
body.price .article-body .rules ul li span.sub { font-size: 1.4rem; line-height: 1.6; }
body.price .article-body .rules .buttons a.button { margin-right: 20px; }
body.price .article-body .rules div.boxed ul:nth-of-type(2) { margin-top: 20px; }
body.price .article-body .block.buttons::before,
body.price .article-body > .rules::before { content: ''; display: block; background-repeat: no-repeat; position: absolute; }
body.price .article-body .block.buttons::before { width: 300px; height: 332px; background: url(/media/common/bg_flower_02.png) right center; background-size: 391px auto; left: 0; top: -80px; }
body.price .article-body > .rules::before { width: 300px; height: 332px; background: url(/media/common/bg_flower_02.png) left center; background-size: 391px auto; right: 0; top: -180px; }

}



/* club
   ========================================================================== */

body.club .article-body th,
body.club .article-body td { border: none; padding: 10px 0; }
body.club .article-body th { font-weight: 500; }
body.club .article-body .columned p { font-weight: 700; }
body.club .article-body .columned th,
body.club .article-body .columned td { vertical-align: middle; }
body.club .article-body .columned td { font-weight: 500; line-height: 1.5; }
body.club .article-body .columned figure { box-shadow: 3px 3px 6px rgba(0, 0, 0, .2); border-radius: 15px; }

body.club .article-body div.sub { position: relative; }
body.club .article-body div.sub figure { position: absolute; }
body.club .article-body div.sub .boxed { background-color: #fa6fa6; }
body.club .article-body div.sub p { color: #fff; }
body.club .article-body div.sub p.heading { font-weight: 700; line-height: 1; margin-top: 0; }
body.club .article-body div.sub th,
body.club .article-body div.sub td { vertical-align: top; }
body.club .article-body div.sub td span.sub { display: block; font-size: 1.2rem; line-height: 1.6; margin-top: 15px; }

body.club .article-body p.boxed { background-color: rgba(250, 111, 166, .4); margin: 0 auto 50px; box-sizing: border-box; }
body.club .article-body p.boxed a { color: #d00053; text-decoration: underline; }
body.club .article-body p.boxed a:hover { text-decoration: none; }

body.club .article-body .buttons { flex-direction: column; }
body.club .article-body .buttons p { font-size: 1.4rem; line-height: 1; text-align: center; margin: 0 0 10px; }

body.club .article-body > p.sub { color: #666; font-size: 1.1rem; text-align: center; margin-top: 60px; }

@media (min-width: 320px) and (max-width: 736px) {

body.club article { padding: 0; }
body.club .article-body .columned,
body.club .article-body > p.sub { padding: 0 15px; }
body.club .article-body > p.boxed { width: calc(100% - 30px); }
body.club .article-header { margin-bottom: 30px; }
body.club .article-body th { width: 80px; font-size: 1.4rem; }
body.club .article-body .columned p { font-size: 1.6rem; line-height: 1.3; margin: 0 0 20px; }
body.club .article-body .columned td { font-size: 1.4rem; }
body.club .article-body .columned p br,
body.club .article-body .columned td br { display: none; }
body.club .article-body .columned figure { width: 200px; margin: 30px auto 50px; }
body.club .article-body div.sub { margin-bottom: 40px; }
body.club .article-body div.sub figure { width: 107px; top: -10px; right: 15px; }
body.club .article-body div.sub .boxed { padding: 10px; margin-bottom: 50px; }
body.club .article-body div.sub p.heading { font-size: 1.6rem; }
body.club .article-body div.sub p.sub { font-size: 1.1rem; line-height: 1.4; }
body.club .article-body p.boxed { line-height: 1.5; padding: 10px; }

}
@media (orientation: landscape) and (max-width: 736px) {
}
@media (min-width: 737px) {

body.club .article-body th { width: 100px; font-size: 1.6rem; }
body.club .article-body .columned { margin-bottom: 50px; }
body.club .article-body .columned .text { width: 600px; }
body.club .article-body .columned p { font-size: 2.4rem; line-height: 1.2; margin: 0 0 60px; }
body.club .article-body .columned td { font-size: 2rem; }
body.club .article-body .columned figure { width: 360px; }
body.club .article-body div.sub { margin-bottom: 40px; height: 278px; }
body.club .article-body div.sub figure { width: 200px; top: -10px; right: 25px; }
body.club .article-body div.sub .boxed { padding: 20px 30px; margin-bottom: 30px; }
body.club .article-body div.sub p.heading { font-size: 2.4rem; }
body.club .article-body div.sub p.heading br { display: none; }
body.club .article-body div.sub p.sub { font-size: 1.4rem; line-height: 1.6; }
body.club .article-body p.boxed { width: 760px; line-height: 1.4; padding: 10px 20px; margin: 0 auto 50px; }

}



/* group-reduction
   ========================================================================== */

body.group-reduction .article-header h1 { font-weight: 700; text-align: center; }
body.group-reduction .article-body h2 { color: #740030; font-weight: 500; }
body.group-reduction .article-body th,
body.group-reduction .article-body td { border: none; }
body.group-reduction .article-body th { font-weight: 500; }
body.group-reduction .article-body td { font-weight: 300; }
body.group-reduction .article-body td span.sub { display: block; font-size: 1.1rem; line-height: 1.4; margin-top: 10px; }

body.group-reduction .article-body p.boxed { background-color: rgba(250, 111, 166, .4); margin: 0 auto 50px; box-sizing: border-box; }
body.group-reduction .article-body p.boxed a { color: #d00053; text-decoration: underline; }
body.group-reduction .article-body p.boxed a:hover { text-decoration: none; }

body.group-reduction .article-body .buttons { flex-direction: column; }
body.group-reduction .article-body .buttons p { font-size: 1.4rem; line-height: 1; text-align: center; margin: 0 0 10px; }

@media (min-width: 320px) and (max-width: 736px) {

body.group-reduction .article-header { margin-bottom: 40px; }
body.group-reduction .article-header h1 { font-size: 1.6rem; }
body.group-reduction .article-body h2 { font-size: 1.5rem; }
body.group-reduction .article-body table { margin: 30px 0; }
body.group-reduction .article-body th,
body.group-reduction .article-body td { padding: 10px 0; }
body.group-reduction .article-body th { width: 100px; font-size: 1.1rem; line-height: 1.5; }
body.group-reduction .article-body td { font-size: 1.3rem; line-height: 1.5; }
body.group-reduction .article-body p.boxed { line-height: 1.5; padding: 10px; }

}
@media (orientation: landscape) and (max-width: 736px) {
}
@media (min-width: 737px) {

body.group-reduction .article-header { width: 760px; margin-bottom: 50px; }
body.group-reduction .article-header h1 { font-size: 2.4rem; }
body.group-reduction .article-header h1 br { display: none; }
body.group-reduction .article-body { width: 760px; }
body.group-reduction .article-body h2 { font-size: 2rem; }
body.group-reduction .article-body table { margin: 50px 0; }
body.group-reduction .article-body th,
body.group-reduction .article-body td { padding: 20px 0; }
body.group-reduction .article-body th { width: 150px; font-size: 1.6rem; line-height: 1.75; }
body.group-reduction .article-body td { font-size: 1.6rem; line-height: 1.75; }
body.group-reduction .article-body p.boxed { width: 760px; line-height: 1.4; padding: 10px 20px; }

}



/* bus-tours
   ========================================================================== */

body.bus-tours .section-header { background-image: url(/media/section-header/bg_bus-tours.jpg); }

body.bus-tours ul.index-list .date { font-weight: 700; margin-right: 0; }
body.bus-tours ul.index-list .heading { font-weight: 500; line-height: 1.4; }
body.bus-tours ul.index-list .sub { font-weight: 700; }

@media (min-width: 320px) and (max-width: 736px) {

body.bus-tours .section-body,
body.bus-tours article { padding: 0; }
body.bus-tours ul.index-list .date { font-size: 1.6rem; margin-bottom: 10px; }
body.bus-tours ul.index-list .heading { font-size: 1.6rem; margin-bottom: 30px; }
body.bus-tours ul.index-list .sub { font-size: 1.6rem; }

}
@media (orientation: landscape) and (max-width: 736px) {
}
@media (min-width: 737px) {

body.bus-tours article { width: 980px; margin: 100px auto; }
body.bus-tours ul.index-list { border-top: 1px solid #ddd; }
body.bus-tours ul.index-list li { border-bottom: 1px solid #ddd; }
body.bus-tours ul.index-list a { justify-content: space-around; }
body.bus-tours ul.index-list .date { width: 10%; font-size: 1.6rem; }
body.bus-tours ul.index-list .heading { width: 50%; font-size: 1.6rem; }
body.bus-tours ul.index-list .sub { width: 25%; font-size: 1.6rem; }

}



/* access
   ========================================================================== */

body.access .article-header h1 { font-weight: 700; text-align: center; }
body.access .article-header p { font-weight: 500; text-align: center; }
body.access .article-body h3 { font-weight: 300; }
body.access .article-body .heading { font-weight: 500; }
body.access .article-body .enlarged { color: #666; font-weight: 700; }
body.access .article-body .google-map { border: 1px solid #707070; }
body.access.garden .article-header h1 { background: url(/media/common/logo_garden.svg) no-repeat center top; }
body.access.garden .article-header h1 .replace::after { background-image: url(/media/common/logo_garden_text.svg); }

@media (min-width: 320px) and (max-width: 736px) {

body.access .article-header { width: 100%; margin-bottom: 30px; }
body.access .article-header h1 { font-size: 1.6rem; }
body.access .article-header p { font-size: 1.1rem; }
body.access .article-body > .block { margin-bottom: 50px; }
body.access .article-body h3 { font-size: 2rem; }
body.access .article-body p { line-height: 1; }
body.access .article-body .heading { font-size: 1.4rem; margin-bottom: 10px; }
body.access .article-body .sub { line-height: 1.5; }
body.access .article-body .sub br { display: none; }
body.access .article-body .enlarged { font-size: 1.6rem; margin-top: 20px; }
body.access .article-body .google-map { margin-bottom: 40px; }
body.access.garden .article-header { margin-bottom: 30px; }
body.access.garden .article-header h1 { background-size: 160px auto; padding-top: 40px; }
body.access.garden .article-header h1 .replace { width: 160px; height: 16px; margin: 0 auto; }
body.access.garden .article-body figure { width: 100%; text-align: right; margin-top: 30px; }
body.access.garden .article-body figure img { width: 250px; }

}
@media (orientation: landscape) and (max-width: 736px) {
}
@media (min-width: 737px) {

body.access .article-header { width: 100%; margin-bottom: 90px; }
body.access .article-header h1 { font-size: 2.4rem; }
body.access .article-header p { font-size: 1.6rem; }
body.access .article-body > .block { margin-bottom: 60px; }
body.access .article-body h3 { font-size: 3rem; margin-bottom: 20px; }
body.access .article-body p { line-height: 1; }
body.access .article-body .heading { font-size: 2rem; margin-bottom: 15px; }
body.access .article-body .sub { line-height: 1.75; }
body.access .article-body .enlarged { font-size: 2.4rem; margin-top: 20px; }
body.access .article-body .google-map { margin-bottom: 50px; }
body.access.garden .article-header { margin-bottom: 50px; }
body.access.garden .article-header h1 { background-size: 200px auto; padding-top: 60px; }
body.access.garden .article-header h1 .replace { width: 200px; height: 20px; margin: 0 auto; }
body.access.garden .article-body .google-map { margin-bottom: 100px; }
body.access.garden .article-body > .block .text { width: 500px; }
body.access.garden .article-body figure { width: 400px; }

}



/* error
   ========================================================================== */

@media (min-width: 320px) and (max-width: 736px) {

body.error #tabs { margin-top: 40px; opacity: 1; }
body.error .article-header { padding-top: 85px; }

}
@media (orientation: landscape) and (max-width: 736px) {
}
@media (min-width: 737px) {
}



/* ==========================================================================
   contact
   ========================================================================== */

body.contact .article-header .block h4 { display: block; font-weight: 700; line-height: 1; text-align: center; margin-bottom: 15px; }
body.contact .article-header .block p { text-align: center; }
body.contact .article-header .block p.enlarged { color: #740030; font-family: 'Noto Serif CJK JP', serif; font-weight: 500; line-height: 1; }

body.contact .article-body .confirm h4 { font-weight: 500; line-height: 1; margin-bottom: 30px; }

body.contact .article-body .label { font-weight: 500; line-height: 1.2; }
body.contact .article-body p.note { font-weight: 300; margin-top:5px; }
body.contact .article-body p.note,
body.contact .article-body .label .sub { color: #ff0000; }
body.contact .article-body .label .sub { display: inline-block; font-weight: 700; margin-left: .25em; }

body.contact .button { min-height: 32px; display: inline-flex; justify-content: center; align-items: center; text-decoration: none; background-color: #fff; border-radius: 4px; padding: 8px 24px; box-sizing: border-box; transition: .25s; box-shadow: 1px 1px 2px rgba(0, 0, 0, .2); margin: 0; }
body.contact .button span { font-weight: 300; line-height: 1; background-repeat: no-repeat; background-position: right center; background-size: auto 16px; }
body.contact .button:hover { background-color: rgba(255, 255, 255, .6); box-shadow: none; }
body.contact .article-body .buttons { display: flex; justify-content: center; }
body.contact.club .article-body .buttons,
body.contact.group-reduction .article-body .buttons { flex-direction: row; }

body.contact .article-body label { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; padding-bottom: 30px; position: relative; }
body.contact .article-body form > label:first-of-type { margin-top: 30px; }
body.contact .article-body label.textarea { padding-bottom: 40px; }
body.contact .article-body label.textarea { align-items: flex-start; }
body.contact .article-body label.textarea .label { padding-top: 10px; }
body.contact .article-body label.radio > span.radio { display: flex; align-items: center; }
body.contact .article-body label.radio > span.radio { justify-content: flex-start; flex-wrap: wrap; }
body.contact .article-body label.radio label { padding-bottom: 0; }
body.contact .article-body label.select { padding-bottom: 20px; }
body.contact .article-body label.select ~ label.select { padding-bottom: 40px; }
body.contact .article-body label.text.short > span.text { display: flex; justify-content: flex-start; align-items: center; }

body.contact .article-body label input::placeholder,
body.contact .article-body label textarea::placeholder { color: rgba(89, 87, 87, .25); }
body.contact .article-body label input::-webkit-input-placeholder,
body.contact .article-body label textarea::-webkit-input-placeholder { color: rgba(89, 87, 87, .25); }
body.contact .article-body label input:-ms-input-placeholder,
body.contact .article-body label textarea:-ms-input-placeholder { color: rgba(89, 87, 87, .25); }

body.contact .article-body label.radio input.radio { display: flex; justify-content: center; align-items: center; width: 24px; height: 24px; vertical-align: middle; background-color: #fff; border: 1px solid #707070; border-radius: 12px; -webkit-appearance: none; -moz-appearance: none; appearance: none; margin-right: 10px; box-sizing: border-box; }
body.contact .article-body label.radio input.radio::after { content: ''; display: block; width: 18px; height: 18px; background-color: #fff; border-radius: 9px; transition: .25s; }
body.contact .article-body label.radio input.radio:checked::after { background-color: #d00053; }
body.contact .article-body label.radio .mwform-radio-field-text { font-weight: 500; }
body.contact .article-body label.radio .mwform-radio-field.horizontal-item { padding: 10px 0; }

body.contact .article-body label input.text,
body.contact .article-body label input.phone,
body.contact .article-body label select,
body.contact .article-body label textarea { font-weight: 500; border-radius: 0; padding: 10px; box-sizing: border-box; appearance: none; -webkit-appearance: none; -moz-appearance: none; }
body.contact .article-body label input.text,
body.contact .article-body label textarea { border: 1px solid #b7b7b7; }
body.contact .article-body label.short input.text[type="number"] { width: 80px; }
body.contact .article-body label.short span.text span { display: inline-block; font-weight: 500; margin: 0 10px; }
body.contact .article-body label.short span.text .error { margin: 0; }
body.contact .article-body label.short span.note { font-weight: 300; line-height: 1.4; position: absolute; } 
body.contact .article-body label.half input.text[type="text"] { width: 180px; }

body.contact .article-body label .select { display: block; border-radius: 4px; overflow: hidden; box-shadow: 1px 1px 2px rgba(0, 0, 0, .2); transition: .25s; }
body.contact .article-body label .select:hover { box-shadow: none; }
body.contact .article-body label select { text-overflow: ellipsis; background: url(/media/common/bg_select.svg) no-repeat; background-position: calc(100% - 10px) center; background-size: 10px; border: none; padding: 10px; }
body.contact .article-body label select::-ms-expand { display: none; }

body.contact .article-body .mw_wp_form { margin-left: auto; margin-right: auto; }
.mw_wp_form_confirm label { cursor: default; }
.mw_wp_form_confirm label.text .text,
.mw_wp_form_confirm label.radio .radio,
.mw_wp_form_confirm label.select .select,
.mw_wp_form_confirm label.textarea .textarea { display: block; color: #000; padding: 15px; box-sizing: border-box; }
.mw_wp_form_confirm label span:last-of-type { font-weight: 500; }
body.contact .article-body .mw_wp_form_confirm label.select span.select ~ span { margin-top: 0; }
.mw_wp_form .horizontal-item + .horizontal-item { margin-left: 0 !important; }
.mw_wp_form_confirm .label { opacity: .5; }
.mw_wp_form_confirm .label .sub { visibility: hidden; }
body.contact .mw_wp_form_confirm label.textarea .label { padding-top: 15px; }
body.contact .mw_wp_form .error { display: block; color: #ff0000; font-weight: 500; position: absolute; }
body.contact .mw_wp_form label.textarea .error { bottom: 20px; }
body.contact .mw_wp_form label.select .error { position: relative; left: 10px; bottom: 5px; }
body.contact .article-body .mw_wp_form_confirm label .select { box-shadow: none; }
.mw_wp_form_input .confirm { display: block; }
.mw_wp_form_input .back { display: none; }
.mw_wp_form_confirm .confirm { display: none; }
.mw_wp_form_confirm .back { display: block; }
.mw_wp_form_preview label { border-bottom: 1px solid #ddd; margin-top: 30px; }
body.contact .mw_wp_form_complete p.enlarged { text-align: center; margin-top: 30px; }
.mw_wp_form_send_error { font-weight: 300; line-height: 2; margin-bottom: 32px; }

@media (min-width: 320px) and (max-width: 736px) {

body.contact.club article { padding: 0 15px; }

body.contact .article-header { margin-bottom: 40px; }
body.contact .article-header .block h4 { font-size: 1rem; }
body.contact .article-header .block p { font-size: 1.3rem; }
body.contact .article-header .block p.enlarged { font-size: 3rem; }
body.contact .article-body .confirm { margin: 20px 0; }
body.contact .article-body .label { font-size: 1.1rem; margin-bottom: 10px; }
body.contact .article-body .label br { display: none; }
body.contact .article-body p { font-size: 1.3rem; }
body.contact .article-body p.note { font-size: 1rem; }
body.contact .article-body p.enlarged { font-size: 2rem; }
body.contact .button span { font-size: 1.3rem; }
body.contact .article-body .buttons { margin: 0; }
body.contact .article-body button ~ button { margin-left: 10px; }
body.contact .article-body .buttons ~ p { margin-top: 30px; }
body.contact .article-body label.radio > span.radio { width: 100%; }
body.contact .article-body label.radio label { margin-right: 20px; }
body.contact .article-body label.text.short > span.text { width: 100%; }
body.contact .article-body label.radio .mwform-radio-field-text { font-size: 1.4rem; line-height: 1.4; }
body.contact .article-body label input.text,
body.contact .article-body label input.phone,
body.contact .article-body label select,
body.contact .article-body label textarea { width: 100%; font-size: 1.4rem; }
body.contact .article-body label.short span.note { color: #666; font-size: 1.1rem; top: 27px; left: 120px; } 
body.contact .article-body label .select { width: 100%; }
body.contact .article-body label.headles .label { margin-bottom: 0; }
body.contact .article-body .mw_wp_form { width: 100%; }
body.contact .mw_wp_form .error { font-size: 1rem; bottom: 15px; left: 10px; }

}
@media (orientation: landscape) and (max-width: 736px) {
}
@media (min-width: 737px) {

body.contact .article-header { margin-bottom: 100px; }
body.contact .article-header .block h4 { font-size: 2rem; }
body.contact .article-header .block p.enlarged { font-size: 4.8rem; }
body.contact .article-body .confirm { margin: 60px 0; }
body.contact .article-body .confirm h4 { font-size: 2.4rem; }
body.contact .article-body .label { font-size: 1.6rem; }
body.contact .article-body p.note { font-size: 1.4rem; }
body.contact .article-body p.enlarged { font-size: 3rem; }
body.contact .button span { font-size: 1.6rem; }
body.contact .article-body .buttons { margin: 100px 0; }
body.contact .article-body button ~ button { margin-left: 20px; }
body.contact .article-body label.radio > span.radio { width: 500px; }
body.contact .article-body label.radio label { margin-right: 60px; }
body.contact .article-body label.text.short > span.text,
body.contact .article-body label.text.half > span.text { width: 500px; }
body.contact .article-body label.radio .mwform-radio-field-text { font-size: 1.8rem; }
body.contact .article-body label.radio .mwform-radio-field-text br { display: none }
body.contact .article-body label input.text,
body.contact .article-body label input.phone,
body.contact .article-body label select,
body.contact .article-body label textarea { width: 500px; font-size: 1.8rem; }
body.contact .article-body label.short span.note { font-size: 1.4rem; top: 0; left: 280px; } 
body.contact .article-body label .select { width: 500px; }
body.contact .article-body .mw_wp_form { width: 660px; }
.mw_wp_form_confirm label.text .text,
.mw_wp_form_confirm label.radio .radio,
.mw_wp_form_confirm label.select .select,
.mw_wp_form_confirm label.textarea .textarea { width: 500px; }
.mw_wp_form_confirm label span:last-of-type { font-size: 1.8rem; }
body.contact .mw_wp_form .error { font-size: 1.4rem; bottom: 10px; left: 170px; }
.mw_wp_form_send_error { font-size: 3.2rem; }

}



/* ==========================================================================
   styled
   ========================================================================== */

.styled h1 { font-weight: 500; line-height: 1.2; }
.styled h2 { font-weight: 300; line-height: 1.2; }
.styled h3 { display: inline-block; border-bottom: 1px solid #000; font-weight: 500; line-height: 1.5; }
.styled h3::after { content: '\A'; white-space: pre; }
.styled h4 { font-weight: 700; }
.styled h5 { font-weight: 500; }

.styled p { font-weight: 300; }

.styled blockquote { border-left: 2px solid #ddd; padding-left: 1em; }

.styled a { text-decoration: underline; }
.styled a:hover { text-decoration: none; }

.styled b { font-weight: 500; }
.styled strong { font-weight: 700; }

.styled .left { margin-right: 20px; margin-bottom: 20px; }
.styled .right { margin-left: 20px; margin-bottom: 20px; }

.styled figcaption { font-weight: 300; margin-top: 10px; }

.styled li { line-height: 1.5; position: relative; }
.styled li::before { display: inline-block; position: absolute; left: 0; }
.styled ul li::before { content: '●'; color: #ddd; }
.styled ol li:nth-child(1)::before { content: '①'; }
.styled ol li:nth-child(2)::before { content: '②'; }
.styled ol li:nth-child(3)::before { content: '③'; }
.styled ol li:nth-child(4)::before { content: '④'; }
.styled ol li:nth-child(5)::before { content: '⑤'; }

.styled table th,
.styled table td { border: none; border-bottom: 1px solid #ddd; line-height: 1.5; }
.styled table caption { font-weight: 500; }

.styled .boxed { border: 1px solid #ddd; }

@media (min-width: 320px) and (max-width: 736px) {

.styled h1 { font-size: 3rem; margin: 40px 0; }
.styled h2 { font-size: 2rem; margin: 40px 0 20px; }
.styled h3 { font-size: 1.5rem; margin: 20px 0 0; }
.styled h4 { font-size: 1.5rem; margin: 20px 0; }
.styled h5 { font-size: 1.4rem; margin: 20px 0 -10px; }
.styled p { font-size: 1.4rem; line-height: 1.8; margin-top: 20px; }
.styled p.enlarged { font-size: 1.8rem; }
.styled figure { margin: 40px auto; }
.styled figcaption { font-size: 1.2rem; line-height: 1.4; }
.styled ul,
.styled ol { margin: 20px 0; }
.styled li { padding-left: 20px; margin-top: 10px; }
.styled li::before { width: 20px; }
.styled table { margin: 40px 0; }
.styled table th,
.styled table td { padding: 5px; }
.styled table caption { font-size: 1.4rem; margin-bottom: 10px; }
.styled .boxed { padding: 0 15px 15px; margin: 20px 0; }

}
@media (orientation: landscape) and (max-width: 736px) {
}
@media (min-width: 737px) {

.styled h1 { font-size: 4rem; margin: 60px 0; }
.styled h2 { font-size: 3rem; margin: 60px 0 30px; }
.styled h3 { font-size: 2rem; margin: 30px 0 0; }
.styled h4 { font-size: 2rem; margin: 30px 0; }
.styled h5 { font-size: 1.6rem; margin: 30px 0 -10px; }
.styled p { font-size: 1.6rem; line-height: 2; }
.styled p.enlarged { font-size: 2rem; }
.styled figure { margin: 60px auto; }
.styled figure.half { width: 50%; }
.styled figcaption { font-size: 1.4rem; line-height: 1.6; }
.styled ul,
.styled ol { margin: 30px 0; }
.styled li { padding-left: 25px; margin-top: 15px; }
.styled li::before { width: 25px; }
.styled table { margin: 60px 0; }
.styled table th,
.styled table td { padding: 10px; }
.styled table caption { font-size: 1.6rem; margin-bottom: 15px; }
.styled .boxed { padding: 0 30px 30px; margin: 30px 0; }
}



/* ==========================================================================
   handy
   ========================================================================== */

.left { float: left; }
.right { float: right; }
.align-center { text-align: center; }
.align-left { text-align: left; }
.align-right { text-align: right; }
.disabled { cursor: default; pointer-events: none; opacity: .25; }
.no-padding { padding: 0; }
.no-margin { margin: 0; }
.no-padding-top { padding-top: 0; }
.no-margin-top { margin-top: 0; }
.no-wrap { white-space: nowrap; }

.sans { font-family: 'Noto Sans JP', sans-serif; }
.serif { font-family: 'Noto Serif JP', serif; }
.smaller { font-size: smaller; }
.larger { font-size: larger; }
.lighter { font-weight: lighter; }
.bolder { font-weight: bolder; }

.hidden { display: none; }