@charset "UTF-8";
/*!
Theme Name: granscena_html
Theme URI: http://underscores.me/
Author: Me

Author URI: http://underscores.me/
Description: Custom theme: granscena_html, developed by Me
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: granscena_html
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

haga is based on Underscores https://underscores.me/, (C) 2012-2017 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Normalize
# Typography
# Elements
# Forms
# Navigation
	## Links
	## Menus
# Accessibility
# Alignments
# Clearings
# Widgets
# Content
	## Posts and pages
	## Comments
# Infinite scroll
# Media
	## Captions
	## Galleries
# Theme
--------------------------------------------------------------*/
/*--------------------------------------------------------------
# Normalize
--------------------------------------------------------------*/
html {
  font-family: sans-serif;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}

body {
  margin: 0;
}

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

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

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

[hidden],
template {
  display: none;
}

a {
  background-color: transparent;
}

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

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

b,
strong {
  font-weight: bold;
}

dfn {
  font-style: italic;
}

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

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

small {
  font-size: 80%;
}

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

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

img {
  border: 0;
}

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

figure {
  margin: 1em 40px;
}

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

pre {
  overflow: auto;
}

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

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

button {
  overflow: visible;
}

button,
select {
  text-transform: none;
}

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

button[disabled],
html input[disabled] {
  cursor: default;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

input {
  line-height: normal;
}

input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box;
  padding: 0;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

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

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

legend {
  border: 0;
  padding: 0;
}

textarea {
  overflow: auto;
}

optgroup {
  font-weight: bold;
}

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

td,
th {
  padding: 0;
}

/*--------------------------------------------------------------
# Typography
--------------------------------------------------------------*/
body,
button,
input,
select,
optgroup,
textarea {
  color: #404040;
  font-family: "Noto Sans CJK JP", "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif;
  font-size: 1px;
  font-size: 0.1rem;
  line-height: 1.5;
}

h1, h2, h3, h4, h5, h6 {
  clear: both;
}

p {
  margin-bottom: 1.5em;
}

dfn, cite, em, i {
  font-style: italic;
}

blockquote {
  margin: 0 1.5em;
}

address {
  margin: 0 0 1.5em;
}

pre {
  background: #eee;
  font-family: "Courier 10 Pitch", Courier, monospace;
  font-size: 0.9375px;
  font-size: 0.09375rem;
  line-height: 1.6;
  margin-bottom: 1.6em;
  max-width: 100%;
  overflow: auto;
  padding: 1.6em;
}

code, kbd, tt, var {
  font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
  font-size: 0.9375px;
  font-size: 0.09375rem;
}

abbr, acronym {
  border-bottom: 1px dotted #666;
  cursor: help;
}

mark, ins {
  background: #fff9c0;
  text-decoration: none;
}

big {
  font-size: 125%;
}

/*--------------------------------------------------------------
# Elements
--------------------------------------------------------------*/
html {
  box-sizing: border-box;
}

*,
*:before,
*:after {
  /* Inherit box-sizing to make it easier to change the property for components that leverage other behavior; see https://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
  box-sizing: inherit;
}

body {
  background: #fff;
  /* Fallback for when there is no custom background color defined. */
}

hr {
  background-color: #ccc;
  border: 0;
  height: 1px;
  margin-bottom: 1.5em;
}

ul, ol {
  margin: 0 0 1.5em 3em;
}

ul {
  list-style: disc;
}

ol {
  list-style: decimal;
}

li > ul,
li > ol {
  margin-bottom: 0;
}

dt {
  font-weight: bold;
}

dd {
  margin: 0 1.5em 1.5em;
}

img {
  height: auto;
  /* Make sure images are scaled correctly. */
  max-width: 100%;
  /* Adhere to container width. */
}

figure {
  margin: 1em 0;
  /* Extra wide images within figure tags don't overflow the content area. */
}

table {
  margin: 0 0 1.5em;
  width: 100%;
}

/*--------------------------------------------------------------
# Forms
--------------------------------------------------------------*/
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
  border: 1px solid;
  border-color: #ccc #ccc #bbb;
  border-radius: 3px;
  background: #e6e6e6;
  color: rgba(0, 0, 0, 0.8);
  font-size: 0.75px;
  font-size: 0.075rem;
  line-height: 1;
  padding: .6em 1em .4em;
}
button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
  border-color: #ccc #bbb #aaa;
}
button:active, button:focus,
input[type="button"]:active,
input[type="button"]:focus,
input[type="reset"]:active,
input[type="reset"]:focus,
input[type="submit"]:active,
input[type="submit"]:focus {
  border-color: #aaa #bbb #bbb;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea {
  color: #666;
  border: 1px solid #ccc;
  border-radius: 3px;
  padding: 3px;
}
input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus {
  color: #111;
}

select {
  border: 1px solid #ccc;
}

textarea {
  width: 100%;
}

/*--------------------------------------------------------------
# Navigation
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Links
--------------------------------------------------------------*/
a {
  color: royalblue;
}
a:visited {
  color: purple;
}
a:hover, a:focus, a:active {
  color: midnightblue;
}
a:focus {
  outline: thin dotted;
}
a:hover, a:active {
  outline: 0;
}

/*--------------------------------------------------------------
## Menus
--------------------------------------------------------------*/
.main-navigation {
  clear: both;
  display: block;
  float: left;
  width: 100%;
}
.main-navigation ul {
  display: none;
  list-style: none;
  margin: 0;
  padding-left: 0;
}
.main-navigation ul ul {
  box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
  float: left;
  position: absolute;
  top: 100%;
  left: -999em;
  z-index: 99999;
}
.main-navigation ul ul ul {
  left: -999em;
  top: 0;
}
.main-navigation ul ul li:hover > ul, .main-navigation ul ul li.focus > ul {
  left: 100%;
}
.main-navigation ul ul a {
  width: 200px;
}
.main-navigation ul li:hover > ul,
.main-navigation ul li.focus > ul {
  left: auto;
}
.main-navigation li {
  float: left;
  position: relative;
}
.main-navigation a {
  display: block;
  text-decoration: none;
}

/* Small menu. */
.menu-toggle,
.main-navigation.toggled ul {
  display: block;
}

@media screen and (min-width: 37.5em) {
  .menu-toggle {
    display: none;
  }

  .main-navigation ul {
    display: block;
  }
}
.site-main .comment-navigation,
.site-main .posts-navigation,
.site-main .post-navigation {
  margin: 0 0 1.5em;
  overflow: hidden;
}
.comment-navigation .nav-previous, .posts-navigation .nav-previous, .post-navigation .nav-previous {
  float: left;
  width: 50%;
}
.comment-navigation .nav-next, .posts-navigation .nav-next, .post-navigation .nav-next {
  float: right;
  text-align: right;
  width: 50%;
}

/*--------------------------------------------------------------
# Accessibility
--------------------------------------------------------------*/
/* Text meant only for screen readers. */
.screen-reader-text {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute !important;
  width: 1px;
  word-wrap: normal !important;
  /* Many screen reader and browser combinations announce broken words as they would appear visually. */
}
.screen-reader-text:focus {
  background-color: #f1f1f1;
  border-radius: 3px;
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
  clip: auto !important;
  clip-path: none;
  color: #21759b;
  display: block;
  font-size: 0.875px;
  font-size: 0.0875rem;
  font-weight: bold;
  height: auto;
  left: 5px;
  line-height: normal;
  padding: 15px 23px 14px;
  text-decoration: none;
  top: 5px;
  width: auto;
  z-index: 100000;
  /* Above WP toolbar. */
}

/* Do not show the outline on the skip link target. */
#content[tabindex="-1"]:focus {
  outline: 0;
}

/*--------------------------------------------------------------
# Alignments
--------------------------------------------------------------*/
.alignleft {
  display: inline;
  float: left;
  margin-right: 1.5em;
}

.alignright {
  display: inline;
  float: right;
  margin-left: 1.5em;
}

.aligncenter {
  clear: both;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

/*--------------------------------------------------------------
# Clearings
--------------------------------------------------------------*/
.clear:before,
.clear:after,
.entry-content:before,
.entry-content:after,
.comment-content:before,
.comment-content:after,
.site-header:before,
.site-header:after,
.site-content:before,
.site-content:after,
.site-footer:before,
.site-footer:after {
  content: "";
  display: table;
  table-layout: fixed;
}

.clear:after,
.entry-content:after,
.comment-content:after,
.site-header:after,
.site-content:after,
.site-footer:after {
  clear: both;
}

/*--------------------------------------------------------------
# Widgets
--------------------------------------------------------------*/
.widget {
  margin: 0 0 1.5em;
  /* Make sure select elements fit in widgets. */
}
.widget select {
  max-width: 100%;
}

/*--------------------------------------------------------------
# Content
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Posts and pages
--------------------------------------------------------------*/
.sticky {
  display: block;
}

.hentry {
  margin: 0 0 1.5em;
}

.updated:not(.published) {
  display: none;
}

.page-content,
.entry-content,
.entry-summary {
  margin: 1.5em 0 0;
}

.page-links {
  clear: both;
  margin: 0 0 1.5em;
}

/*--------------------------------------------------------------
## Comments
--------------------------------------------------------------*/
.comment-content a {
  word-wrap: break-word;
}

.bypostauthor {
  display: block;
}

/*--------------------------------------------------------------
# Infinite scroll
--------------------------------------------------------------*/
/* Globally hidden elements when Infinite Scroll is supported and in use. */
.infinite-scroll .posts-navigation,
.infinite-scroll.neverending .site-footer {
  /* Theme Footer (when set to scrolling) */
  display: none;
}

/* When Infinite Scroll has reached its end we need to re-display elements that were hidden (via .neverending) before. */
.infinity-end.neverending .site-footer {
  display: block;
}

/*--------------------------------------------------------------
# Media
--------------------------------------------------------------*/
.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
  border: none;
  margin-bottom: 0;
  margin-top: 0;
  padding: 0;
}

/* Make sure embeds and iframes fit their containers. */
embed,
iframe,
object {
  max-width: 100%;
}

/* Make sure logo link wraps around logo image. */
.custom-logo-link {
  display: inline-block;
}

/*--------------------------------------------------------------
## Captions
--------------------------------------------------------------*/
.wp-caption {
  margin-bottom: 1.5em;
  max-width: 100%;
}
.wp-caption img[class*="wp-image-"] {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.wp-caption .wp-caption-text {
  margin: 0.8075em 0;
}

.wp-caption-text {
  text-align: center;
}

/*--------------------------------------------------------------
## Galleries
--------------------------------------------------------------*/
.gallery {
  margin-bottom: 1.5em;
}

.gallery-item {
  display: inline-block;
  text-align: center;
  vertical-align: top;
  width: 100%;
}
.gallery-columns-2 .gallery-item {
  max-width: 50%;
}
.gallery-columns-3 .gallery-item {
  max-width: 33.33%;
}
.gallery-columns-4 .gallery-item {
  max-width: 25%;
}
.gallery-columns-5 .gallery-item {
  max-width: 20%;
}
.gallery-columns-6 .gallery-item {
  max-width: 16.66%;
}
.gallery-columns-7 .gallery-item {
  max-width: 14.28%;
}
.gallery-columns-8 .gallery-item {
  max-width: 12.5%;
}
.gallery-columns-9 .gallery-item {
  max-width: 11.11%;
}

.gallery-caption {
  display: block;
}

/*--------------------------------------------------------------
# themes
--------------------------------------------------------------*/
/*--------------------------------------------------------------
Reset
--------------------------------------------------------------*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
  border: 0;
  font-family: inherit;
  font-size: 100%;
  font-style: inherit;
  font-weight: inherit;
  margin: 0;
  outline: 0;
  padding: 0;
  vertical-align: baseline;
}

html {
  font-size: 62.5%;
  /* Corrects text resizing oddly in IE6/7 when body font-size is set using em units http://clagnut.com/blog/348/#c790 */
  overflow-y: scroll;
  /* Keeps page centered in all browsers regardless of content height */
  -webkit-text-size-adjust: 100%;
  /* Prevents iOS text size adjust after orientation change, without disabling user zoom */
  -ms-text-size-adjust: 100%;
  /* www.456bereastreet.com/archive/201012/controlling_text_size_in_safari_for_ios_without_disabling_user_zoom/ */
}

*,
*:before,
*:after {
  /* apply a natural box layout model to all elements; see http://www.paulirish.com/2012/box-sizing-border-box-ftw/ */
  -webkit-box-sizing: border-box;
  /* Not needed for modern webkit but still used by Blackberry Browser 7.0; see http://caniuse.com/#search=box-sizing */
  -moz-box-sizing: border-box;
  /* Still needed for Firefox 28; see http://caniuse.com/#search=box-sizing */
  box-sizing: border-box;
}

body {
  background: #303030;
  /* Fallback for when there is no custom background color defined. */
}

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

ol,
ul {
  list-style: none;
}

table {
  /* tables still need 'cellspacing="0"' in the markup */
  border-collapse: separate;
  border-spacing: 0;
}

caption,
th,
td {
  font-weight: normal;
  text-align: left;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
}

blockquote,
q {
  quotes: "" "";
}

a:focus {
  outline: thin dotted;
}

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

a img {
  border: 0;
}

/*--------------------------------------------------------------
Typography
--------------------------------------------------------------*/
body,
button,
input,
select,
textarea {
  color: #303030;
  font-family: "Noto Sans CJK JP", "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif !important;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 1.5;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  clear: both;
}

p {
  margin-bottom: 1.5em;
}

b,
strong {
  font-weight: bold;
}

dfn,
cite,
em,
i {
  font-style: italic;
}

blockquote {
  margin: 0 1.5em;
}

address {
  margin: 0 0 1.5em;
}

pre {
  background: #eee;
  font-family: "Courier 10 Pitch", Courier, monospace;
  font-size: 15px;
  font-size: 1.5rem;
  line-height: 1.6;
  margin-bottom: 1.6em;
  max-width: 100%;
  overflow: auto;
  padding: 1.6em;
}

code,
kbd,
tt,
var {
  font: 15px Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
}

abbr,
acronym {
  border-bottom: 1px dotted #666;
  cursor: help;
}

mark,
ins {
  background: #fff9c0;
  text-decoration: none;
}

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

sup {
  bottom: 1ex;
}

sub {
  top: .5ex;
}

small {
  font-size: 75%;
}

big {
  font-size: 125%;
}

/*--------------------------------------------------------------
Links
--------------------------------------------------------------*/
a {
  color: #1b76d1;
  text-decoration: none;
  outline: none;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;
  transition: 0.3s;
}

a:visited {
  color: #1b76d1;
}

a:focus {
  outline: none;
}

a:hover,
a:focus,
a:active {
  color: #1b76d1;
}

/*--------------------------------------------------------------
Clearings
--------------------------------------------------------------*/
.cf:after {
  content: " ";
  display: block;
  clear: both;
}

/*--------------------------------------------------------------
theme Layout
--------------------------------------------------------------*/
body {
  background: #fff;
  color: #303030;
}

.font {
  font-family: "Noto Sans CJK JP", "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif;
}

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

html {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

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

caption, th, td {
  text-align: left;
  font-weight: normal;
  vertical-align: middle;
}

q, blockquote {
  quotes: none;
}

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

a img {
  border: none;
}

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

html {
  font-size: 62.5%;
}

body {
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 1.7;
  letter-spacing: 1px;
  word-wrap: break-word;
  overflow-wrap: break-word;
  min-width: 1000px;
}
@media screen and (max-width: 768px) {
  body {
    min-width: initial;
  }
}
@media screen and (max-width: 400px) {
  body {
    font-size: 13px;
    font-size: 1.3rem;
  }
}

img {
  vertical-align: bottom;
  max-width: 100%;
  height: auto;
}

a:hover {
  opacity: .8;
}

p {
  margin-bottom: 15px;
}
p:last-child {
  margin-bottom: 0;
}

.sp_none {
  display: block;
}

.pc_none {
  display: none;
}

.inline_block {
  display: inline-block;
}

.section_inner {
  width: 1000px;
  margin: 0 auto;
  position: relative;
}

.object-fit-img {
  object-fit: cover;
  font-family: "object-fit: cover;";
}

#loading {
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

#loader-bg {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: #FFF;
  z-index: 1000002;
}

.wrapper {
  overflow: hidden;
}

@media screen and (max-width: 768px) {
  .sp_none {
    display: none;
  }

  .pc_none {
    display: block;
  }

  .section_inner {
    width: 100%;
  }
}
/* #header
------------------------------------------------------------- */
header {
  position: relative;
}
@media screen and (max-width: 768px) {
  header {
    padding-bottom: 64px;
    background: #eee3d8;
  }
}
@media screen and (max-width: 480px) {
  header {
    padding-bottom: 59px;
  }
}
@media screen and (max-width: 400px) {
  header {
    padding-bottom: 54px;
  }
}
header .header_top {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100;
  width: 100%;
  min-width: 1000px;
  background: white;
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-transition: .5s;
  transition: .5s;
}
@media screen and (max-width: 768px) {
  header .header_top {
    min-width: initial;
  }
}
header .header_top h1 {
  width: 204px;
  margin: 17px 0 17px 60px;
}
@media screen and (max-width: 1250px) {
  header .header_top h1 {
    margin-left: 20px;
  }
}
@media screen and (max-width: 768px) {
  header .header_top h1 {
    margin: 12px 0 12px 20px;
  }
}
@media screen and (max-width: 768px) {
  header .header_top h1 img {
    width: 163.2px;
    height: 40px;
  }
}
@media screen and (max-width: 480px) {
  header .header_top h1 img {
    width: 142.8px;
    height: 35px;
  }
}
@media screen and (max-width: 400px) {
  header .header_top h1 img {
    width: 122.4px;
    height: 30px;
  }
}
@media screen and (max-width: 768px) {
  header .header_top .gnav {
    display: none;
  }
}
header .header_top .gnav ul {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  -webkit-justify-content: flex-end;
  -moz-justify-content: flex-end;
  justify-content: flex-end;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
  height: 100%;
  padding-right: 279px;
  position: relative;
}
@media screen and (max-width: 1250px) {
  header .header_top .gnav ul {
    padding-right: 214px;
  }
}
header .header_top .gnav li {
  margin: 0 15px;
}
@media screen and (max-width: 1250px) {
  header .header_top .gnav li {
    font-size: 13px;
    font-size: 1.3rem;
    margin: 0 8px;
  }
}
header .header_top .gnav li a {
  color: #303030;
  height: 100%;
}
header .header_top .gnav li a span {
  position: relative;
}
header .header_top .gnav li a span:after {
  content: '';
  position: absolute;
  bottom: -10px;
  left: 0;
  right: 0;
  margin: auto;
  width: 0;
  height: 1px;
  background-color: #303030;
  -webkit-transition: .3s;
  transition: .3s;
}
header .header_top .gnav li a:hover {
  opacity: 1;
}
header .header_top .gnav li a:hover span:after {
  width: 100%;
}
header .header_top .gnav li.nav_insta {
  position: absolute;
  top: 0;
  right: 180px;
  margin: 0;
}
@media screen and (max-width: 1250px) {
  header .header_top .gnav li.nav_insta {
    right: 120px;
  }
}
header .header_top .gnav li.nav_insta a {
  display: block;
  width: 84px;
  height: 84px;
  background: #ece6e0;
  font-size: 20px;
  font-size: 2rem;
  text-align: center;
  color: #533f36;
  position: relative;
}
header .header_top .gnav li.nav_insta a:hover {
  opacity: .8;
}
header .header_top .gnav li.nav_insta i {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
header .header_top .gnav li.nav_reserve {
  position: absolute;
  top: 0;
  right: 0;
  margin: 0;
}
header .header_top .gnav li.nav_reserve a {
  display: block;
  width: 180px;
  height: 84px;
  background: #dd7f53;
  text-align: center;
  color: #fff;
  position: relative;
}
header .header_top .gnav li.nav_reserve a:hover {
  opacity: .8;
}
@media screen and (max-width: 1250px) {
  header .header_top .gnav li.nav_reserve a {
    width: 120px;
  }
}
header .header_top .gnav li.nav_reserve p {
  letter-spacing: 2px;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
header .mainvisual {
  width: 100%;
  height: 880px;
}
@media screen and (max-width: 768px) {
  header .mainvisual {
    height: 580px;
  }
}
@media screen and (max-width: 600px) {
  header .mainvisual {
    height: 480px;
  }
}
@media screen and (max-width: 480px) {
  header .mainvisual {
    height: 420px;
  }
}
@media screen and (max-width: 400px) {
  header .mainvisual {
    height: 380px;
  }
}
header .mainvisual .logo_mark {
  position: absolute;
  top: 240px;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  z-index: 10;
}
@media screen and (max-width: 768px) {
  header .mainvisual .logo_mark {
    top: 162px;
  }
  header .mainvisual .logo_mark img {
    width: 208px;
    height: 204px;
  }
}
@media screen and (max-width: 600px) {
  header .mainvisual .logo_mark {
    top: 125px;
  }
  header .mainvisual .logo_mark img {
    width: 182px;
    height: 178.5px;
  }
}
@media screen and (max-width: 480px) {
  header .mainvisual .logo_mark {
    top: 100px;
  }
  header .mainvisual .logo_mark img {
    width: 156px;
    height: 153px;
  }
}
@media screen and (max-width: 400px) {
  header .mainvisual .logo_mark {
    top: 100px;
  }
  header .mainvisual .logo_mark img {
    width: 130px;
    height: 127.5px;
  }
}
header .mainvisual .open_date {
  position: absolute;
  top: 540px;
  left: 50%;
  z-index: 10;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  font-family: "Roboto", "Noto Sans CJK JP", "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif;
  font-size: 18px;
  font-size: 1.8rem;
  color: #fff;
  letter-spacing: 2px;
}
@media screen and (max-width: 768px) {
  header .mainvisual .open_date {
    top: 385px;
  }
}
@media screen and (max-width: 600px) {
  header .mainvisual .open_date {
    top: 318px;
    font-size: 16px;
    font-size: 1.6rem;
  }
}
@media screen and (max-width: 480px) {
  header .mainvisual .open_date {
    top: 270px;
    font-size: 15px;
    font-size: 1.5rem;
  }
}
@media screen and (max-width: 400px) {
  header .mainvisual .open_date {
    top: 240px;
    font-size: 14px;
    font-size: 1.4rem;
  }
}
header .mainvisual .open_date:before {
  content: '';
  width: 25px;
  height: 1px;
  background: #fff;
  position: absolute;
  top: 15px;
  left: -25px;
  transform: rotate(65deg);
}
header .mainvisual .open_date:after {
  content: '';
  width: 25px;
  height: 1px;
  background: #fff;
  position: absolute;
  top: 15px;
  right: -25px;
  transform: rotate(-65deg);
}
header .mainvisual .btn_reserve {
  position: absolute;
  top: 580px;
  left: 50%;
  z-index: 10;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}
@media screen and (max-width: 768px) {
  header .mainvisual .btn_reserve {
    top: 420px;
  }
}
@media screen and (max-width: 600px) {
  header .mainvisual .btn_reserve {
    top: 350px;
  }
}
@media screen and (max-width: 480px) {
  header .mainvisual .btn_reserve {
    top: 300px;
  }
}
@media screen and (max-width: 400px) {
  header .mainvisual .btn_reserve {
    top: 270px;
  }
}
header .mainvisual .btn_reserve a {
  display: block;
  width: 268px;
  background: #dd7f53;
  color: #fff;
  text-align: center;
  padding: 16px 10px;
}
@media screen and (max-width: 768px) {
  header .mainvisual .btn_reserve a {
    width: 240px;
    padding: 12px 10px;
  }
}
@media screen and (max-width: 600px) {
  header .mainvisual .btn_reserve a {
    font-size: 13px;
    font-size: 1.3rem;
    width: 220px;
  }
}
@media screen and (max-width: 480px) {
  header .mainvisual .btn_reserve a {
    padding: 10px;
    width: 200px;
  }
}
@media screen and (max-width: 400px) {
  header .mainvisual .btn_reserve a {
    padding: 8px;
    width: 180px;
  }
}
header .mainvisual .mv_slider {
  width: 100%;
}
@media screen and (max-width: 768px) {
  header .mainvisual .mv_slider:after {
    content: '';
    width: 100%;
    height: 156px;
    background: url(images/img_riging_dragon_head_sp.png) no-repeat center bottom;
    background-size: cover;
    position: absolute;
    bottom: -78px;
    left: 0;
  }
}
@media screen and (max-width: 600px) {
  header .mainvisual .mv_slider:after {
    height: 132px;
    bottom: -66px;
  }
}
@media screen and (max-width: 480px) {
  header .mainvisual .mv_slider:after {
    height: 110px;
    bottom: -55px;
  }
}
@media screen and (max-width: 400px) {
  header .mainvisual .mv_slider:after {
    height: 90px;
    bottom: -45px;
  }
}
header .mainvisual .mv_photo {
  width: 100%;
  height: 780px;
  background-size: cover;
  background-position: center bottom;
}
@media screen and (max-width: 768px) {
  header .mainvisual .mv_photo {
    height: 580px;
  }
}
@media screen and (max-width: 600px) {
  header .mainvisual .mv_photo {
    height: 480px;
  }
}
@media screen and (max-width: 480px) {
  header .mainvisual .mv_photo {
    height: 420px;
  }
}
@media screen and (max-width: 400px) {
  header .mainvisual .mv_photo {
    height: 380px;
  }
}
header .mainvisual .mv_photo:before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.2);
}
header .drawer-hamburger,
header .drawer-nav {
  display: none;
}

.drawer-hamburger-icon,
.drawer-hamburger-icon:after,
.drawer-hamburger-icon:before {
  background-color: #303030;
}

.drawer-open .drawer-hamburger-icon:after,
.drawer-open .drawer-hamburger-icon:before {
  background-color: #303030;
}

.drawer--top .drawer-hamburger {
  border: none;
  background: transparent;
  box-shadow: none;
}
@media screen and (max-width: 768px) {
  .drawer--top .drawer-hamburger {
    display: block;
    width: 30px;
    background: #ece6e0;
    border-radius: 0;
    padding: 22px 15px 30px;
    opacity: 1;
    -webkit-transition: .5s;
    transition: .5s;
    z-index: 100;
  }
}
@media screen and (max-width: 480px) {
  .drawer--top .drawer-hamburger {
    padding: 17px 15px 30px;
  }
}
@media screen and (max-width: 400px) {
  .drawer--top .drawer-hamburger {
    padding: 16px 15px 26px;
  }
}

.drawer--top .drawer-hamburger,
.drawer--top.drawer-close .drawer-hamburger {
  position: fixed;
  top: 0;
  right: 0;
  z-index: 1000001;
}

.drawer--top.drawer-open .drawer-hamburger {
  right: 15px;
  background: transparent;
}

.drawer--top .drawer-nav {
  display: block;
  width: 100%;
  height: 100%;
  background: #eee3d8;
  z-index: 100000;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: 60px 40px 40px;
}
@media screen and (max-width: 600px) {
  .drawer--top .drawer-nav {
    padding: 60px 30px 20px;
  }
}
@media screen and (max-width: 480px) {
  .drawer--top .drawer-nav {
    padding: 60px 20px 20px;
  }
}
.drawer--top .drawer-nav:before {
  content: '';
  width: 828px;
  height: 662px;
  background: url(images/bg_riging_dragon_sp_menu.png) no-repeat left bottom;
  background-size: cover;
  position: absolute;
  left: -50px;
  bottom: -300px;
  opacity: .6;
}
.drawer--top .drawer-nav .drawer-menu > ul {
  margin-bottom: 25px;
}
.drawer--top .drawer-nav .drawer-menu > ul li {
  border-bottom: 1px solid #dcc8b4;
}
.drawer--top .drawer-nav .drawer-menu > ul li a {
  display: block;
  font-size: 18px;
  font-size: 1.8rem;
  color: #303030;
  line-height: 1.4;
  padding: 25px 20px;
}
@media screen and (max-width: 480px) {
  .drawer--top .drawer-nav .drawer-menu > ul li a {
    font-size: 16px;
    font-size: 1.6rem;
    padding: 20px 15px;
  }
}
@media screen and (max-width: 400px) {
  .drawer--top .drawer-nav .drawer-menu > ul li a {
    font-size: 15px;
    font-size: 1.5rem;
  }
}
.drawer--top .drawer-nav .drawer-menu .nav_contact a,
.drawer--top .drawer-nav .drawer-menu .nav_reserve a {
  display: block;
  width: 100%;
  background: #c4ab91;
  font-size: 18px;
  font-size: 1.8rem;
  color: #fff;
  text-align: center;
  letter-spacing: 2px;
  padding: 20px 10px;
}
@media screen and (max-width: 480px) {
  .drawer--top .drawer-nav .drawer-menu .nav_contact a,
  .drawer--top .drawer-nav .drawer-menu .nav_reserve a {
    font-size: 15px;
    font-size: 1.5rem;
    padding: 15px 10px;
  }
}
.drawer--top .drawer-nav .drawer-menu .nav_contact {
  margin-bottom: 15px;
}
.drawer--top .drawer-nav .drawer-menu .nav_contact a {
  background: #c4ab91;
}
.drawer--top .drawer-nav .drawer-menu .nav_reserve {
  margin-bottom: 40px;
}
.drawer--top .drawer-nav .drawer-menu .nav_reserve a {
  background: #dd7f53;
}
.drawer--top .drawer-nav .drawer-menu .basic_info {
  text-align: center;
}
.drawer--top .drawer-nav .drawer-menu .basic_info .gh_name {
  font-size: 26px;
  font-size: 2.6rem;
  letter-spacing: 3px;
  margin-bottom: 30px;
}
@media screen and (max-width: 480px) {
  .drawer--top .drawer-nav .drawer-menu .basic_info .gh_name {
    font-size: 22px;
    font-size: 2.2rem;
  }
}
.drawer--top .drawer-nav .drawer-menu .basic_info .gh_name span {
  font-family: "Roboto", "Noto Sans CJK JP", "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif;
  font-size: 16px;
  font-size: 1.6rem;
  letter-spacing: 2px;
  margin-left: 5px;
}
@media screen and (max-width: 480px) {
  .drawer--top .drawer-nav .drawer-menu .basic_info .gh_name span {
    font-size: 14px;
    font-size: 1.4rem;
  }
}
.drawer--top .drawer-nav .drawer-menu .basic_info .nav_insta {
  margin-bottom: 30px;
}
.drawer--top .drawer-nav .drawer-menu .basic_info .nav_insta a {
  display: block;
  width: 56px;
  height: 56px;
  border-radius: 100%;
  background: #c3b4a5;
  font-size: 28px;
  font-size: 2.8rem;
  color: #fff;
  text-align: center;
  padding: 10px;
  margin: 0 auto;
}
.drawer--top .drawer-nav .drawer-menu .basic_info .nav_insta a i {
  position: relative;
  top: -7px;
}
.drawer--top .drawer-nav .drawer-menu .basic_info .gh_addr {
  font-size: 15px;
  font-size: 1.5rem;
  font-weight: 500;
  margin-bottom: 20px;
}
@media screen and (max-width: 480px) {
  .drawer--top .drawer-nav .drawer-menu .basic_info .gh_addr {
    font-size: 14px;
    font-size: 1.4rem;
  }
}
.drawer--top .drawer-nav .drawer-menu .basic_info .gh_addr span {
  display: inline-block;
}
.drawer--top .drawer-nav .drawer-menu .basic_info .gh_tel {
  margin-bottom: 20px;
}
.drawer--top .drawer-nav .drawer-menu .basic_info .gh_tel a {
  font-family: "Roboto", "Noto Sans CJK JP", "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif;
  font-size: 22px;
  font-size: 2.2rem;
  color: #303030;
  letter-spacing: 2px;
}
@media screen and (max-width: 480px) {
  .drawer--top .drawer-nav .drawer-menu .basic_info .gh_tel a {
    font-size: 18px;
    font-size: 1.8rem;
  }
}
.drawer--top .drawer-nav .drawer-menu .basic_info .gh_tel a strong {
  font-size: 30px;
  font-size: 3rem;
}
@media screen and (max-width: 480px) {
  .drawer--top .drawer-nav .drawer-menu .basic_info .gh_tel a strong {
    font-size: 24px;
    font-size: 2.4rem;
  }
}

header .header_top {
  opacity: 0;
  z-index: -1;
}
@media screen and (max-width: 768px) {
  header .header_top {
    opacity: 1;
    z-index: 100;
  }
}
header .header_top.display {
  opacity: 1;
  z-index: 100;
}

@media screen and (max-width: 768px) {
  .home header {
    padding-bottom: 70px;
  }
}
@media screen and (max-width: 600px) {
  .home header {
    padding-bottom: 58px;
  }
}
@media screen and (max-width: 480px) {
  .home header {
    padding-bottom: 50px;
  }
}
@media screen and (max-width: 400px) {
  .home header {
    padding-bottom: 42px;
  }
}
@media screen and (max-width: 768px) {
  .home .header_top {
    opacity: 0;
    z-index: -1;
  }
}
@media screen and (max-width: 768px) {
  .home.drawer--top .drawer-hamburger {
    opacity: 0;
    z-index: -1;
  }
  .home.drawer--top .drawer-hamburger.display {
    opacity: 1;
    z-index: 100;
  }
}
@media screen and (max-width: 768px) {
  .home.drawer--top.drawer-open .drawer-hamburger.display {
    z-index: 1000001;
  }
}

/* content
------------------------------------------------------------- */
.content {
  width: 100%;
  margin-top: -2px;
}
.content section.sec_lead {
  background: #eee3d8;
  padding: 130px 0 200px;
  position: relative;
  overflow: hidden;
}
@media screen and (max-width: 768px) {
  .content section.sec_lead {
    padding: 80px 15px 100px;
  }
}
@media screen and (max-width: 600px) {
  .content section.sec_lead {
    padding: 60px 15px 80px;
  }
}
@media screen and (max-width: 480px) {
  .content section.sec_lead {
    padding: 50px 15px 60px;
  }
}
@media screen and (max-width: 400px) {
  .content section.sec_lead {
    padding: 40px 15px 50px;
  }
}
.content section.sec_lead:before {
  content: '';
  width: 729px;
  height: 456px;
  background: url(images/img_riging_dragon_head_pc.png) no-repeat 0 0;
  background-size: cover;
  position: absolute;
  top: -66px;
  left: -160px;
}
@media screen and (max-width: 1250px) {
  .content section.sec_lead:before {
    width: 656.1px;
    height: 410.4px;
  }
}
@media screen and (max-width: 768px) {
  .content section.sec_lead:before {
    content: none;
  }
}
.content section.sec_lead h2 {
  font-size: 22px;
  font-size: 2.2rem;
  text-align: center;
  font-weight: 500;
  letter-spacing: 2px;
  line-height: 1.6;
  margin-bottom: 40px;
}
@media screen and (max-width: 600px) {
  .content section.sec_lead h2 {
    font-size: 20px;
    font-size: 2rem;
  }
}
@media screen and (max-width: 480px) {
  .content section.sec_lead h2 {
    font-size: 18px;
    font-size: 1.8rem;
    margin-bottom: 30px;
  }
}
@media screen and (max-width: 400px) {
  .content section.sec_lead h2 {
    font-size: 15px;
    font-size: 1.5rem;
  }
}
.content section.sec_lead h2 strong {
  display: block;
  font-size: 42px;
  font-size: 4.2rem;
  letter-spacing: 4px;
}
@media screen and (max-width: 768px) {
  .content section.sec_lead h2 strong {
    font-size: 40px;
    font-size: 4rem;
  }
}
@media screen and (max-width: 600px) {
  .content section.sec_lead h2 strong {
    font-size: 34px;
    font-size: 3.4rem;
  }
}
@media screen and (max-width: 480px) {
  .content section.sec_lead h2 strong {
    font-size: 30px;
    font-size: 3rem;
    letter-spacing: 3px;
  }
}
@media screen and (max-width: 400px) {
  .content section.sec_lead h2 strong {
    font-size: 24px;
    font-size: 2.4rem;
  }
}
.content section.sec_lead h2 span {
  font-size: 34px;
  font-size: 3.4rem;
}
@media screen and (max-width: 768px) {
  .content section.sec_lead h2 span {
    font-size: 32px;
    font-size: 3.2rem;
  }
}
@media screen and (max-width: 600px) {
  .content section.sec_lead h2 span {
    font-size: 28px;
    font-size: 2.8rem;
  }
}
@media screen and (max-width: 480px) {
  .content section.sec_lead h2 span {
    font-size: 24px;
    font-size: 2.4rem;
  }
}
@media screen and (max-width: 400px) {
  .content section.sec_lead h2 span {
    font-size: 18px;
    font-size: 1.8rem;
  }
}
.content section.sec_lead .news_area {
  max-width: 800px;
  margin: 0 auto 30px;
  padding: 30px;
  background: #fff;
}
.content section.sec_lead .news_area .center {
  text-align: center;
}
.content section.sec_lead .news_area .bold {
  font-weight: bold;
}
.content section.sec_lead .news_area .red {
  color: #f00;
}
.content section.sec_lead .youtube_area {
  margin-bottom: 30px;
  text-align: center;
}
@media screen and (max-width: 480px) {
  .content section.sec_lead .youtube_area iframe {
    height: 240px;
  }
}
.content section.sec_lead .contact_info {
  max-width: 600px;
  margin: 0 auto 80px;
  padding: 36px 10px;
  background: #f3f0ef;
  border-radius: 6px;
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
}
@media screen and (max-width: 768px) {
  .content section.sec_lead .contact_info {
    width: 100%;
  }
}
@media screen and (max-width: 600px) {
  .content section.sec_lead .contact_info {
    padding: 20px 25px;
    margin-bottom: 50px;
  }
}
@media screen and (max-width: 480px) {
  .content section.sec_lead .contact_info {
    padding: 20px 20px;
    margin-bottom: 40px;
  }
}
.content section.sec_lead .contact_info .gh_name {
  width: 226px;
  font-size: 30px;
  font-size: 3rem;
  text-align: center;
  letter-spacing: 4px;
}
@media screen and (max-width: 768px) {
  .content section.sec_lead .contact_info .gh_name {
    width: 35%;
    font-size: 26px;
    font-size: 2.6rem;
  }
}
@media screen and (max-width: 600px) {
  .content section.sec_lead .contact_info .gh_name {
    width: 100%;
    border-bottom: 1px solid #d4ccc2;
    padding-bottom: 15px;
    margin-bottom: 20px;
  }
}
@media screen and (max-width: 480px) {
  .content section.sec_lead .contact_info .gh_name {
    font-size: 22px;
    font-size: 2.2rem;
  }
}
.content section.sec_lead .contact_info .gh_name span {
  font-family: "Roboto", "Noto Sans CJK JP", "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif;
  font-size: 15px;
  font-size: 1.5rem;
  font-weight: 700;
  letter-spacing: 3px;
  margin-left: 5px;
}
@media screen and (max-width: 480px) {
  .content section.sec_lead .contact_info .gh_name span {
    font-size: 14px;
    font-size: 1.4rem;
    letter-spacing: 2px;
    margin-left: 3px;
  }
}
.content section.sec_lead .contact_info .gh_basic_info {
  width: 352px;
  padding: 0 0 0 30px;
  border-left: 1px solid #d4ccc2;
}
@media screen and (max-width: 768px) {
  .content section.sec_lead .contact_info .gh_basic_info {
    width: 65%;
    padding-left: 5%;
    text-align: center;
  }
}
@media screen and (max-width: 600px) {
  .content section.sec_lead .contact_info .gh_basic_info {
    width: 100%;
    border-left: none;
  }
}
.content section.sec_lead .contact_info .gh_basic_info .gh_addr {
  font-size: 13px;
  font-size: 1.3rem;
}
.content section.sec_lead .contact_info .gh_basic_info .gh_addr span {
  display: inline-block;
  margin-left: 10px;
}
.content section.sec_lead .contact_info .gh_basic_info .gh_tel a {
  font-family: "Roboto", "Noto Sans CJK JP", "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif;
  color: #303030;
  font-size: 20px;
  font-size: 2rem;
  letter-spacing: 2px;
}
@media screen and (max-width: 480px) {
  .content section.sec_lead .contact_info .gh_basic_info .gh_tel a {
    font-size: 18px;
    font-size: 1.8rem;
  }
}
.content section.sec_lead .contact_info .gh_basic_info .gh_tel strong {
  font-size: 30px;
  font-size: 3rem;
}
@media screen and (max-width: 480px) {
  .content section.sec_lead .contact_info .gh_basic_info .gh_tel strong {
    font-size: 24px;
    font-size: 2.4rem;
  }
}
.content section.sec_lead .contact_info .gh_basic_info .reception_time {
  font-family: "Roboto", "Noto Sans CJK JP", "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif;
  font-size: 12px;
  font-size: 1.2rem;
}
.content section.sec_lead .intro_txt {
  font-size: 15px;
  font-size: 1.5rem;
  text-align: center;
  line-height: 2;
}
@media screen and (max-width: 600px) {
  .content section.sec_lead .intro_txt {
    font-size: 14px;
    font-size: 1.4rem;
  }
}
@media screen and (max-width: 480px) {
  .content section.sec_lead .intro_txt {
    text-align: left;
  }
  .content section.sec_lead .intro_txt br {
    display: none;
  }
}
.content section.sec_lead .intro_txt p {
  margin-bottom: 50px;
}
@media screen and (max-width: 768px) {
  .content section.sec_lead .intro_txt p {
    margin-bottom: 40px;
  }
}
@media screen and (max-width: 600px) {
  .content section.sec_lead .intro_txt p {
    margin-bottom: 30px;
  }
}
.content section.sec_lead .intro_txt p:last-child {
  margin-bottom: 20px;
}
.content section.sec_lead .okinawa_map {
  position: absolute;
  right: 6%;
  bottom: 80px;
}
@media screen and (max-width: 1250px) {
  .content section.sec_lead .okinawa_map {
    right: 2%;
  }
}
@media screen and (max-width: 768px) {
  .content section.sec_lead .okinawa_map {
    position: relative;
    right: -10%;
    bottom: 0;
    text-align: center;
  }
}
@media screen and (max-width: 480px) {
  .content section.sec_lead .okinawa_map {
    right: 0;
  }
  .content section.sec_lead .okinawa_map img {
    width: 308.7px;
    height: 464.4px;
  }
}
@media screen and (max-width: 400px) {
  .content section.sec_lead .okinawa_map img {
    width: 274.4px;
    height: 412.8px;
  }
}
.content section.sec_experience {
  background: #f6f2ed;
  padding: 110px 0 120px;
  position: relative;
  overflow: hidden;
}
@media screen and (max-width: 1250px) {
  .content section.sec_experience {
    padding-bottom: 140px;
  }
}
@media screen and (max-width: 768px) {
  .content section.sec_experience {
    padding: 110px 15px 80px;
  }
}
@media screen and (max-width: 600px) {
  .content section.sec_experience {
    padding-bottom: 60px;
  }
}
@media screen and (max-width: 480px) {
  .content section.sec_experience {
    padding-bottom: 40px;
  }
}
.content section.sec_experience:before {
  content: '';
  width: 645px;
  height: 535px;
  background: url(images/img_riging_dragon_upper_pc.png) no-repeat 0 0;
  background-size: cover;
  position: absolute;
  top: -111px;
  right: -70px;
}
@media screen and (max-width: 1250px) {
  .content section.sec_experience:before {
    width: 580.5px;
    height: 481.5px;
  }
}
@media screen and (max-width: 768px) {
  .content section.sec_experience:before {
    width: 510.3px;
    height: 319.2px;
    background-image: url(images/img_riging_dragon_head_pc.png);
    top: -109px;
    left: -96px;
  }
}
@media screen and (max-width: 600px) {
  .content section.sec_experience:before {
    width: 437.4px;
    height: 273.6px;
    top: -90px;
  }
}
@media screen and (max-width: 480px) {
  .content section.sec_experience:before {
    width: 364.5px;
    height: 228px;
    top: -70px;
  }
}
.content section.sec_experience:after {
  content: '';
  width: 684px;
  height: 426px;
  background: url(images/img_riging_dragon_lower_pc.png) no-repeat 0 0;
  background-size: cover;
  position: absolute;
  bottom: -173px;
  left: -182px;
}
@media screen and (max-width: 1250px) {
  .content section.sec_experience:after {
    width: 615.6px;
    height: 383.4px;
  }
}
@media screen and (max-width: 768px) {
  .content section.sec_experience:after {
    width: 490px;
    height: 306px;
    background-image: url(images/img_riging_dragon_head_pc.png);
    left: initial;
    bottom: -124px;
    right: -155px;
    transform: rotate(0deg);
  }
}
@media screen and (max-width: 600px) {
  .content section.sec_experience:after {
    width: 441px;
    height: 275.4px;
    bottom: -110px;
    right: -137px;
  }
}
@media screen and (max-width: 480px) {
  .content section.sec_experience:after {
    width: 392px;
    height: 244.8px;
    bottom: -100px;
    right: -117px;
  }
}
.content section.sec_experience h2 {
  font-size: 30px;
  font-size: 3rem;
  text-align: center;
  font-weight: 500;
  letter-spacing: 3px;
  margin-bottom: 80px;
}
@media screen and (max-width: 768px) {
  .content section.sec_experience h2 {
    font-size: 28px;
    font-size: 2.8rem;
    margin-bottom: 70px;
  }
}
@media screen and (max-width: 600px) {
  .content section.sec_experience h2 {
    font-size: 26px;
    font-size: 2.6rem;
    margin-bottom: 60px;
  }
}
@media screen and (max-width: 480px) {
  .content section.sec_experience h2 {
    font-size: 24px;
    font-size: 2.4rem;
    margin-bottom: 50px;
  }
}
@media screen and (max-width: 400px) {
  .content section.sec_experience h2 {
    font-size: 22px;
    font-size: 2.2rem;
    margin-bottom: 40px;
  }
}
.content section.sec_experience .lead {
  margin-bottom: 110px;
}
.content section.sec_experience .lead p {
  font-size: 15px;
  font-size: 1.5rem;
  text-align: center;
  line-height: 2;
  margin-bottom: 20px;
}
.content section.sec_experience .lead p:last-child {
  margin-bottom: 0;
}
@media screen and (max-width: 480px) {
  .content section.sec_experience .lead p {
    font-size: 14px;
    font-size: 1.4rem;
    text-align: left;
  }
  .content section.sec_experience .lead p br {
    display: none;
  }
}
@media screen and (max-width: 480px) {
  .content section.sec_experience .lead {
    margin-bottom: 90px;
  }
}
.content section.sec_experience .experience_list {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.content section.sec_experience .exp_box {
  width: 48.5%;
  position: relative;
  margin-bottom: 120px;
}
@media screen and (max-width: 600px) {
  .content section.sec_experience .exp_box {
    width: 100%;
    max-width: 485px;
    margin: 0 auto 100px;
  }
}
.content section.sec_experience .exp_box a {
  display: block;
  color: #303030;
}
.content section.sec_experience .exp_box a:hover {
  opacity: 1;
}
.content section.sec_experience .exp_box a:hover .btn_more {
  right: -10px;
}
.content section.sec_experience .exp_box p {
  margin-bottom: 15px;
}
.content section.sec_experience .exp_box p:last-child {
  margin-bottom: 0;
}
.content section.sec_experience h3 {
  display: inline-block;
  position: absolute;
  top: -30px;
  left: 26px;
  z-index: 10;
}
@media screen and (max-width: 768px) {
  .content section.sec_experience h3 {
    left: 3%;
  }
}
@media screen and (max-width: 768px) {
  .content section.sec_experience .exp_num img {
    width: 41.6px;
    height: 52px;
  }
}
.content section.sec_experience .exp_ttl {
  display: block;
  -webkit-writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  text-align: left;
  font-size: 22px;
  font-size: 2.2rem;
  color: #020819;
  font-weight: 500;
  position: relative;
  top: 0;
  right: -25px;
}
@media screen and (max-width: 768px) {
  .content section.sec_experience .exp_ttl {
    font-size: 18px;
    font-size: 1.8rem;
    right: -18px;
  }
}
.content section.sec_experience .photo {
  margin-bottom: 35px;
  position: relative;
}
.content section.sec_experience .photo img {
  border-radius: 6px;
}
.content section.sec_experience .btn_more {
  width: 60px;
  height: 60px;
  background: #3e302a;
  text-align: center;
  padding-top: 14px;
  position: absolute;
  bottom: -10px;
  right: -5px;
  -webkit-transition: .3s;
  transition: .3s;
}
@media screen and (max-width: 768px) {
  .content section.sec_experience .btn_more {
    width: 50px;
    height: 50px;
    padding-top: 9px;
  }
}
@media screen and (max-width: 600px) {
  .content section.sec_experience .btn_more {
    width: 46px;
    height: 46px;
    padding-top: 7px;
  }
}
@media screen and (max-width: 480px) {
  .content section.sec_experience .btn_more {
    width: 42px;
    height: 42px;
  }
  .content section.sec_experience .btn_more img {
    width: 15.3px;
    height: 28.8px;
  }
}
.content section.sec_greeting {
  padding: 80px 0 100px;
}
@media screen and (max-width: 768px) {
  .content section.sec_greeting {
    padding-right: 15px;
    padding-left: 15px;
  }
}
@media screen and (max-width: 600px) {
  .content section.sec_greeting {
    padding-bottom: 80px;
  }
}
@media screen and (max-width: 480px) {
  .content section.sec_greeting {
    padding-top: 50px;
    padding-bottom: 60px;
  }
}
.content section.sec_greeting .owner_photo {
  text-align: center;
  margin-bottom: 20px;
}
.content section.sec_greeting .owner_photo img {
  border-radius: 6px;
}
@media screen and (max-width: 768px) {
  .content section.sec_greeting .owner_photo img {
    width: 100%;
    height: 400px;
    object-fit: cover;
    font-family: "object-fit: cover;";
  }
}
@media screen and (max-width: 600px) {
  .content section.sec_greeting .owner_photo img {
    object-position: 80% 100%;
  }
}
@media screen and (max-width: 480px) {
  .content section.sec_greeting .owner_photo img {
    height: 320px;
    object-position: 75% 100%;
  }
}
.content section.sec_greeting .lead {
  max-width: 800px;
  margin: 0 auto 120px;
}
.content section.sec_greeting .introduce_each {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.content section.sec_greeting .introduce_each > div {
  width: 48%;
  background: #f5f3f0;
  border-radius: 6px;
  padding: 70px 40px 40px;
  position: relative;
}
@media screen and (max-width: 768px) {
  .content section.sec_greeting .introduce_each > div {
    width: 100%;
  }
  .content section.sec_greeting .introduce_each > div:first-child {
    margin-bottom: 30px;
  }
}
@media screen and (max-width: 480px) {
  .content section.sec_greeting .introduce_each > div {
    padding: 70px 25px 40px;
  }
}
.content section.sec_greeting .introduce_each > div.intro_shin {
  background: #d4e4e6;
}
@media screen and (max-width: 768px) {
  .content section.sec_greeting .introduce_each > div.intro_shin {
    margin-bottom: 80px;
  }
}
.content section.sec_greeting .introduce_each > div.intro_shin .intro_ttl span {
  background: #6fb0ba;
}
.content section.sec_greeting .introduce_each > div.intro_kee {
  background: #dae1e9;
}
.content section.sec_greeting .introduce_each > div.intro_kee .intro_ttl span {
  background: #587197;
}
.content section.sec_greeting .introduce_each .photo {
  position: absolute;
  top: -60px;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}
.content section.sec_greeting .introduce_each .intro_ttl {
  text-align: center;
  margin-bottom: 30px;
}
.content section.sec_greeting .introduce_each .intro_ttl span {
  display: inline-block;
  padding: 5px 15px;
  font-size: 15px;
  font-size: 1.5rem;
  color: #fff;
}
@media screen and (max-width: 480px) {
  .content section.sec_greeting .introduce_each .intro_ttl span {
    font-size: 14px;
    font-size: 1.4rem;
  }
}
.content .bnr_area {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.content .bnr_area li {
  width: 33.3%;
  height: 310px;
}
@media screen and (max-width: 1250px) {
  .content .bnr_area li {
    height: 280px;
  }
}
@media screen and (max-width: 768px) {
  .content .bnr_area li {
    width: 100%;
  }
}
@media screen and (max-width: 480px) {
  .content .bnr_area li {
    height: 220px;
  }
}
.content .bnr_area li.bnr_room a {
  background-image: url(images/bg_bnr_room.jpg);
  background-position: left bottom;
}
.content .bnr_area li.bnr_price a {
  background-image: url(images/bg_bnr_price.jpg);
}
.content .bnr_area li.bnr_price a:before {
  background: rgba(0, 0, 0, 0.3);
}
.content .bnr_area li.bnr_access a {
  background-image: url(images/bg_bnr_access.jpg);
}
.content .bnr_area li.bnr_access a:before {
  background: rgba(0, 0, 0, 0.3);
}
.content .bnr_area li a {
  display: block;
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-position: center bottom;
  background-size: cover;
  text-align: center;
  color: #fff;
  position: relative;
}
.content .bnr_area li a:before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.4);
}
.content .bnr_area li p {
  position: relative;
  font-size: 26px;
  font-size: 2.6rem;
  letter-spacing: 3px;
  padding-top: 135px;
}
@media screen and (max-width: 1250px) {
  .content .bnr_area li p {
    font-size: 22px;
    font-size: 2.2rem;
    padding-top: 115px;
  }
}
@media screen and (max-width: 480px) {
  .content .bnr_area li p {
    font-size: 20px;
    font-size: 2rem;
    padding-top: 90px;
  }
}
@media screen and (max-width: 400px) {
  .content .bnr_area li p {
    font-size: 18px;
    font-size: 1.8rem;
  }
}
.content .bnr_area li p span {
  display: block;
  font-family: "Roboto", "Noto Sans CJK JP", "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif;
  font-size: 13px;
  font-size: 1.3rem;
  letter-spacing: 2px;
  margin-top: 5px;
}
@media screen and (max-width: 480px) {
  .content .bnr_area li p span {
    font-size: 12px;
    font-size: 1.2rem;
  }
}

.pagetop {
  position: fixed;
  bottom: 10%;
  right: 0;
  z-index: 101;
}
.pagetop a {
  display: block;
  width: 52px;
  height: 52px;
  background: #3e302a;
  text-align: center;
  line-height: 1;
  padding-top: 14px;
}
@media screen and (max-width: 768px) {
  .pagetop a {
    display: none;
    width: 46px;
    height: 46px;
    padding-top: 12px;
  }
}
@media screen and (max-width: 480px) {
  .pagetop a {
    width: 42px;
    height: 42px;
    padding-top: 10px;
  }
}
.pagetop img {
  transform: rotate(-90deg);
}

/* #footer
------------------------------------------------------------- */
footer {
  padding: 100px 0 45px;
  position: relative;
  overflow: hidden;
}
@media screen and (max-width: 768px) {
  footer {
    padding: 80px 15px 45px;
  }
}
@media screen and (max-width: 600px) {
  footer {
    padding-top: 60px;
  }
}
@media screen and (max-width: 480px) {
  footer {
    padding-bottom: 60px;
  }
}
footer:before {
  content: '';
  width: 605px;
  height: 511px;
  background: url(images/img_riging_dragon_footer_pc.png) no-repeat 0 0;
  background-size: cover;
  position: absolute;
  bottom: -259px;
  right: -109px;
}
@media screen and (max-width: 768px) {
  footer:before {
    width: 484px;
    height: 408.8px;
    bottom: -216px;
    right: -115px;
  }
}
@media screen and (max-width: 480px) {
  footer:before {
    width: 363px;
    height: 306.6px;
    bottom: -160px;
    right: -80px;
  }
}
@media screen and (max-width: 400px) {
  footer:before {
    width: 302.5px;
    height: 255.5px;
    bottom: -140px;
    right: -60px;
  }
}
footer .gh_name {
  font-size: 20px;
  font-size: 2rem;
  font-weight: 500;
  letter-spacing: 2px;
  margin-bottom: 70px;
}
@media screen and (max-width: 768px) {
  footer .gh_name {
    margin-bottom: 40px;
  }
}
footer .gh_name span {
  font-size: 11px;
  font-size: 1.1rem;
  font-weight: 700;
  margin-left: 3px;
}
footer .gh_addr {
  font-size: 13px;
  font-size: 1.3rem;
  margin-bottom: 15px;
}
footer .gh_addr span {
  display: inline-block;
}
footer .gh_tel {
  font-family: "Roboto", "Noto Sans CJK JP", "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif;
  font-size: 18px;
  font-size: 1.8rem;
  margin-bottom: 10px;
}
footer .gh_tel a {
  color: #303030;
}
footer .reception_time {
  font-size: 12px;
  font-size: 1.2rem;
  margin-bottom: 60px;
}
@media screen and (max-width: 480px) {
  footer .reception_time {
    margin-bottom: 40px;
  }
}
footer .footer_copyright {
  font-family: "Roboto", "Noto Sans CJK JP", "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif;
  font-size: 11px;
  font-size: 1.1rem;
  letter-spacing: 1px;
}
@media screen and (max-width: 768px) {
  footer .footer_copyright {
    margin-bottom: 40px;
  }
}
@media screen and (max-width: 480px) {
  footer .footer_copyright {
    font-size: 10px;
    font-size: 1rem;
  }
}

section.sec_gallery {
  background: #d2c1af;
  padding: 50px 0;
}
@media screen and (max-width: 768px) {
  section.sec_gallery {
    padding: 50px 15px;
  }
}
@media screen and (max-width: 480px) {
  section.sec_gallery {
    padding: 40px 15px;
  }
}
section.sec_gallery h2 {
  font-family: "Roboto", "Noto Sans CJK JP", "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif;
  font-size: 22px;
  font-size: 2.2rem;
  text-align: center;
  color: #161616;
  margin-bottom: 70px;
  position: relative;
}
section.sec_gallery h2:after {
  content: '';
  width: 1px;
  height: 30px;
  background: #303030;
  position: absolute;
  bottom: -40px;
  left: 50%;
}
section.sec_gallery .gallery_list {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  max-width: 1100px;
  margin: 0 auto 40px;
}
@media screen and (max-width: 768px) {
  section.sec_gallery .gallery_list {
    margin-bottom: 30px;
  }
}
section.sec_gallery .gallery_list li {
  width: 23.63%;
  margin-bottom: 20px;
}
@media screen and (max-width: 768px) {
  section.sec_gallery .gallery_list li {
    margin-bottom: 12px;
  }
}
@media screen and (max-width: 600px) {
  section.sec_gallery .gallery_list li {
    width: 32%;
  }
}
@media screen and (max-width: 480px) {
  section.sec_gallery .gallery_list li {
    width: 48%;
  }
}
section.sec_gallery .btn_more a {
  display: block;
  max-width: 280px;
  padding: 20px 10px;
  margin: 0 auto;
  background: #e0d8d0;
  font-family: "Roboto", "Noto Sans CJK JP", "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif;
  font-size: 15px;
  font-size: 1.5rem;
  color: #303030;
  text-align: center;
  letter-spacing: 1px;
  position: relative;
}
@media screen and (max-width: 768px) {
  section.sec_gallery .btn_more a {
    padding: 15px 10px;
    width: 100%;
  }
}
@media screen and (max-width: 400px) {
  section.sec_gallery .btn_more a {
    max-width: initial;
  }
}
section.sec_gallery .btn_more a:after {
  content: '';
  width: 18px;
  height: 6px;
  background: url(images/img_icon_arrow_black.png) no-repeat 0 0;
  background-size: cover;
  position: absolute;
  top: 50%;
  right: 15px;
  -webkit-transition: .5s;
  transition: .5s;
}
section.sec_gallery .btn_more a:hover {
  opacity: 1;
}
section.sec_gallery .btn_more a:hover:after {
  right: 10px;
}
section.sec_gallery .btn_more a i {
  font-size: 26px;
  font-size: 2.6rem;
  margin-right: 10px;
  position: relative;
  top: 5px;
}

.fade_in {
  opacity: 0;
  -webkit-transition: 3s;
  -moz-transition: 3s;
  -ms-transition: 3s;
  -o-transition: 3s;
  transition: 3s;
}
.fade_in.from_left {
  transform: translate(-50px, 0);
}
.fade_in.from_right {
  transform: translate(50px, 0);
}
.fade_in.from_top {
  transform: translate(0, -50px);
}
.fade_in.from_bottom {
  transform: translate(0, 50px);
}

.fade_in.scrollin {
  opacity: 1;
  transform: translate(0, 0);
}

.btn_hover {
  position: relative;
}
.btn_hover.from_left:before {
  transform-origin: right top;
  transform: scale(0, 1);
}
.btn_hover.from_top:before {
  transform-origin: left bottom;
  transform: scale(1, 0);
}
.btn_hover:before {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
  content: '';
  background: #f0c347;
  border-radius: 6px;
  transition: transform .3s;
}
.btn_hover:hover {
  opacity: .99;
  color: #303030 !important;
}
.btn_hover:hover:before {
  transform-origin: left top;
  transform: scale(1, 1);
}
.btn_hover:hover:after {
  background-image: url(images/img_arrow_brown.png) !important;
}
.btn_hover.hover_brown:before {
  background: #3e302a;
}
.btn_hover.hover_brown:hover {
  color: #fff !important;
}
.btn_hover.hover_brown:hover:after {
  background-image: url(images/img_arrow_white.png) !important;
}

.bg_animation {
  position: absolute !important;
  left: 0;
  top: 0;
  width: 101%;
  height: 100%;
  background-color: #eee3d8;
  -webkit-transition-timing-function: ease;
  transition-timing-function: ease;
  z-index: 2;
  visibility: hidden;
  margin-left: -1px;
}
.bg_animation.is-animated {
  -webkit-transform-origin: right center;
  transform-origin: right center;
  -webkit-transform: translateX(0) scaleX(0) !important;
  transform: translateX(0) scaleX(0) !important;
}

.animation_inner {
  visibility: hidden;
  z-index: 1;
}
.animation_inner.is-animated {
  visibility: visible;
}

/*--------------------------------------------------------------
 Page style
--------------------------------------------------------------*/
.page .page_ttl, .error404 .page_ttl, .archive .page_ttl, .single .page_ttl {
  height: 580px;
  position: relative;
}
@media screen and (max-width: 768px) {
  .page .page_ttl, .error404 .page_ttl, .archive .page_ttl, .single .page_ttl {
    height: 680px;
    background-image: url(images/photo_main_ttl_default.jpg);
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: cover;
    padding-bottom: 130px;
  }
  .page .page_ttl:before, .error404 .page_ttl:before, .archive .page_ttl:before, .single .page_ttl:before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.4);
  }
}
@media screen and (max-width: 600px) {
  .page .page_ttl, .error404 .page_ttl, .archive .page_ttl, .single .page_ttl {
    height: 600px;
    padding-bottom: 96px;
  }
}
@media screen and (max-width: 480px) {
  .page .page_ttl, .error404 .page_ttl, .archive .page_ttl, .single .page_ttl {
    height: 520px;
    padding-bottom: 72px;
  }
}
@media screen and (max-width: 400px) {
  .page .page_ttl, .error404 .page_ttl, .archive .page_ttl, .single .page_ttl {
    height: 440px;
    padding-bottom: 56px;
  }
}
.page .page_ttl h2, .error404 .page_ttl h2, .archive .page_ttl h2, .single .page_ttl h2 {
  width: 520px;
  height: 100%;
  padding-top: 230px;
  position: relative;
  overflow: hidden;
}
@media screen and (max-width: 768px) {
  .page .page_ttl h2, .error404 .page_ttl h2, .archive .page_ttl h2, .single .page_ttl h2 {
    width: 100%;
  }
}
@media screen and (max-width: 480px) {
  .page .page_ttl h2, .error404 .page_ttl h2, .archive .page_ttl h2, .single .page_ttl h2 {
    padding-top: 200px;
  }
}
@media screen and (max-width: 400px) {
  .page .page_ttl h2, .error404 .page_ttl h2, .archive .page_ttl h2, .single .page_ttl h2 {
    padding-top: 170px;
  }
}
.page .page_ttl h2:after, .error404 .page_ttl h2:after, .archive .page_ttl h2:after, .single .page_ttl h2:after {
  content: '';
  width: 630px;
  height: 523px;
  background: url(images/img_riging_dragon_upper_pc.png) no-repeat 0 0;
  background-size: cover;
  position: absolute;
  bottom: -185px;
  right: 70px;
}
@media screen and (max-width: 768px) {
  .page .page_ttl h2:after, .error404 .page_ttl h2:after, .archive .page_ttl h2:after, .single .page_ttl h2:after {
    content: none;
  }
}
.page .page_ttl h2 span, .error404 .page_ttl h2 span, .archive .page_ttl h2 span, .single .page_ttl h2 span {
  display: block;
  text-align: center;
  letter-spacing: 1px;
}
@media screen and (max-width: 768px) {
  .page .page_ttl h2 span, .error404 .page_ttl h2 span, .archive .page_ttl h2 span, .single .page_ttl h2 span {
    color: #fff;
  }
}
.page .page_ttl h2 span.ttl_jp, .error404 .page_ttl h2 span.ttl_jp, .archive .page_ttl h2 span.ttl_jp, .single .page_ttl h2 span.ttl_jp {
  font-size: 32px;
  font-size: 3.2rem;
  letter-spacing: 2px;
}
@media screen and (max-width: 768px) {
  .page .page_ttl h2 span.ttl_jp, .error404 .page_ttl h2 span.ttl_jp, .archive .page_ttl h2 span.ttl_jp, .single .page_ttl h2 span.ttl_jp {
    font-size: 30px;
    font-size: 3rem;
  }
}
@media screen and (max-width: 600px) {
  .page .page_ttl h2 span.ttl_jp, .error404 .page_ttl h2 span.ttl_jp, .archive .page_ttl h2 span.ttl_jp, .single .page_ttl h2 span.ttl_jp {
    font-size: 26px;
    font-size: 2.6rem;
  }
}
@media screen and (max-width: 480px) {
  .page .page_ttl h2 span.ttl_jp, .error404 .page_ttl h2 span.ttl_jp, .archive .page_ttl h2 span.ttl_jp, .single .page_ttl h2 span.ttl_jp {
    font-size: 24px;
    font-size: 2.4rem;
  }
}
@media screen and (max-width: 400px) {
  .page .page_ttl h2 span.ttl_jp, .error404 .page_ttl h2 span.ttl_jp, .archive .page_ttl h2 span.ttl_jp, .single .page_ttl h2 span.ttl_jp {
    font-size: 22px;
    font-size: 2.2rem;
  }
}
.page .page_ttl h2 span.ttl_en, .error404 .page_ttl h2 span.ttl_en, .archive .page_ttl h2 span.ttl_en, .single .page_ttl h2 span.ttl_en {
  font-family: "Roboto", "Noto Sans CJK JP", "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif;
  font-size: 14px;
  font-size: 1.4rem;
  letter-spacing: 2px;
}
@media screen and (max-width: 480px) {
  .page .page_ttl h2 span.ttl_en, .error404 .page_ttl h2 span.ttl_en, .archive .page_ttl h2 span.ttl_en, .single .page_ttl h2 span.ttl_en {
    font-size: 13px;
    font-size: 1.3rem;
  }
}
.page .page_ttl:after, .error404 .page_ttl:after, .archive .page_ttl:after, .single .page_ttl:after {
  content: '';
  width: calc(100% - 520px);
  height: 100%;
  background: url(images/photo_main_ttl_default.jpg) no-repeat 0 0;
  background-size: cover;
  position: absolute;
  top: 0;
  left: 520px;
}
@media screen and (max-width: 768px) {
  .page .page_ttl:after, .error404 .page_ttl:after, .archive .page_ttl:after, .single .page_ttl:after {
    width: 100%;
    height: 177px;
    background-image: url(images/img_riging_dragon_head_sp.png) !important;
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: cover;
    position: absolute;
    top: initial;
    bottom: -1px;
    left: 0;
  }
}
@media screen and (max-width: 600px) {
  .page .page_ttl:after, .error404 .page_ttl:after, .archive .page_ttl:after, .single .page_ttl:after {
    height: 136px;
  }
}
@media screen and (max-width: 480px) {
  .page .page_ttl:after, .error404 .page_ttl:after, .archive .page_ttl:after, .single .page_ttl:after {
    height: 108px;
  }
}
@media screen and (max-width: 400px) {
  .page .page_ttl:after, .error404 .page_ttl:after, .archive .page_ttl:after, .single .page_ttl:after {
    height: 90px;
  }
}
.page .content section, .error404 .content section, .archive .content section, .single .content section {
  padding: 80px 0;
}
@media screen and (max-width: 768px) {
  .page .content section, .error404 .content section, .archive .content section, .single .content section {
    padding: 60px 15px;
  }
}
@media screen and (max-width: 600px) {
  .page .content section, .error404 .content section, .archive .content section, .single .content section {
    padding: 50px 15px;
  }
}
@media screen and (max-width: 480px) {
  .page .content section, .error404 .content section, .archive .content section, .single .content section {
    padding: 40px 15px;
  }
}

.room header .header_top .gnav li.nav_room a span:after {
  width: 100%;
}
@media screen and (max-width: 768px) {
  .room .page_ttl {
    background-image: url(images/photo_main_ttl_room.jpg);
    background-position: left bottom;
  }
}
.room .page_ttl:after {
  background-image: url(images/photo_main_ttl_room.jpg);
}
.room .content section.sec_intro_room {
  background: #eee3d8;
}
.room .content section.sec_intro_room .section_inner {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.room .content section.sec_intro_room .room_detail {
  width: 100%;
  margin-bottom: 110px;
  padding: 0;
  position: relative;
}
@media screen and (max-width: 768px) {
  .room .content section.sec_intro_room .room_detail {
    margin-bottom: 80px;
  }
}
@media screen and (max-width: 600px) {
  .room .content section.sec_intro_room .room_detail {
    margin-bottom: 60px;
  }
}
@media screen and (max-width: 768px) {
  .room .content section.sec_intro_room .room_detail h2 {
    margin-bottom: 10px;
  }
}
.room .content section.sec_intro_room .room_detail h2 .ttl_en {
  display: block;
  font-family: "Roboto", "Noto Sans CJK JP", "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif;
  font-size: 24px;
  font-size: 2.4rem;
  font-weight: 700;
  letter-spacing: 2px;
}
@media screen and (max-width: 768px) {
  .room .content section.sec_intro_room .room_detail h2 .ttl_en {
    display: inline;
    margin-right: 7px;
  }
}
@media screen and (max-width: 600px) {
  .room .content section.sec_intro_room .room_detail h2 .ttl_en {
    font-size: 22px;
    font-size: 2.2rem;
  }
}
@media screen and (max-width: 480px) {
  .room .content section.sec_intro_room .room_detail h2 .ttl_en {
    font-size: 20px;
    font-size: 2rem;
  }
}
@media screen and (max-width: 480px) {
  .room .content section.sec_intro_room .room_detail h2 .ttl_jp {
    font-size: 13px;
    font-size: 1.3rem;
  }
}
.room .content section.sec_intro_room .room_detail .room_photo {
  margin-bottom: 20px;
}
.room .content section.sec_intro_room .room_detail .room_photo img {
  border-radius: 4px;
}
.room .content section.sec_intro_room .room_detail .room_info {
  margin-top: 40px;
}
.room .content section.sec_intro_room .room_detail .room_info .btn_detail a {
  display: block;
  max-width: 340px;
  background: #3e302a;
  padding: 25px 10px;
  margin: 20px 0;
  font-size: 15px;
  font-size: 1.5rem;
  color: #fff;
  text-align: center;
  font-weight: 400;
  letter-spacing: 2px;
  position: relative;
}
@media screen and (max-width: 480px) {
  .room .content section.sec_intro_room .room_detail .room_info .btn_detail a {
    font-size: 15px;
    font-size: 1.5rem;
    padding: 20px 10px;
  }
}
@media screen and (max-width: 400px) {
  .room .content section.sec_intro_room .room_detail .room_info .btn_detail a {
    font-size: 14px;
    font-size: 1.4rem;
  }
}
.room .content section.sec_intro_room .room_detail .room_info .btn_detail a {
  max-width: 268px;
  background: #cfa577;
  padding: 15px 10px;
  font-size: 14px;
  font-size: 1.4rem;
}
@media screen and (max-width: 480px) {
  .room .content section.sec_intro_room .room_detail .room_info .btn_detail a {
    max-width: 100%;
  }
}
.room .content section.sec_intro_room .room_detail.sec_living h2 {
  position: absolute;
  top: 0;
  left: 0;
}
@media screen and (max-width: 768px) {
  .room .content section.sec_intro_room .room_detail.sec_living h2 {
    position: static;
  }
}
.room .content section.sec_intro_room .room_detail.sec_living .room_photo {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
  -webkit-box-align: start;
  -ms-flex-align: start;
  -webkit-align-items: start;
  -moz-align-items: start;
  align-items: start;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  width: 79.2%;
  margin-left: 20.8%;
  position: relative;
}
@media screen and (max-width: 768px) {
  .room .content section.sec_intro_room .room_detail.sec_living .room_photo {
    width: 100%;
    margin-left: 0;
  }
}
.room .content section.sec_intro_room .room_detail.sec_living .room_photo > div {
  width: 391px;
  margin-bottom: 10px;
}
@media screen and (max-width: 768px) {
  .room .content section.sec_intro_room .room_detail.sec_living .room_photo > div {
    width: 49%;
  }
}
@media screen and (max-width: 600px) {
  .room .content section.sec_intro_room .room_detail.sec_living .room_photo > div {
    width: 100%;
  }
  .room .content section.sec_intro_room .room_detail.sec_living .room_photo > div img {
    width: 100%;
  }
}
.room .content section.sec_intro_room .room_detail.sec_living .room_photo:after {
  content: '';
  width: 97px;
  height: 102px;
  background: url(images/icon_illust_living.png) no-repeat 0 0;
  background-size: cover;
  position: absolute;
  bottom: 32px;
  left: -62px;
}
@media screen and (max-width: 768px) {
  .room .content section.sec_intro_room .room_detail.sec_living .room_photo:after {
    width: 77.6px;
    height: 81.6px;
    left: initial;
    bottom: -30px;
    right: 20px;
  }
}
@media screen and (max-width: 600px) {
  .room .content section.sec_intro_room .room_detail.sec_living .room_photo:after {
    width: 67.9px;
    height: 71.4px;
    bottom: -25px;
    right: 15px;
  }
}
.room .content section.sec_intro_room .room_detail.sec_living .room_info {
  margin-left: 20.8%;
}
@media screen and (max-width: 768px) {
  .room .content section.sec_intro_room .room_detail.sec_living .room_info {
    margin-left: 0;
  }
}
.room .content section.sec_intro_room .room_detail.sec_living .room_info h2 {
  position: absolute;
  top: 0;
  left: 0;
}
@media screen and (max-width: 768px) {
  .room .content section.sec_intro_room .room_detail.sec_living .room_info h2 {
    position: static;
    margin-bottom: 20px;
  }
}
.room .content section.sec_intro_room .room_detail.sec_kitchen {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.room .content section.sec_intro_room .room_detail.sec_kitchen h2 {
  position: absolute;
  top: 0;
  left: 822px;
}
@media screen and (max-width: 768px) {
  .room .content section.sec_intro_room .room_detail.sec_kitchen h2 {
    position: static;
  }
}
.room .content section.sec_intro_room .room_detail.sec_kitchen .room_photo {
  position: relative;
  margin-right: 20.8%;
}
@media screen and (max-width: 768px) {
  .room .content section.sec_intro_room .room_detail.sec_kitchen .room_photo {
    margin-right: 0;
    margin-bottom: 10px;
  }
}
.room .content section.sec_intro_room .room_detail.sec_kitchen .room_photo:after {
  content: '';
  width: 101px;
  height: 63px;
  background: url(images/icon_illust_kitchen.png) no-repeat 0 0;
  background-size: cover;
  position: absolute;
  bottom: 22px;
  right: -54px;
}
@media screen and (max-width: 768px) {
  .room .content section.sec_intro_room .room_detail.sec_kitchen .room_photo:after {
    content: none;
  }
}
.room .content section.sec_intro_room .room_detail.sec_kitchen .room_photo2 {
  width: 48%;
}
@media screen and (max-width: 768px) {
  .room .content section.sec_intro_room .room_detail.sec_kitchen .room_photo2 {
    width: 100%;
    margin-bottom: 20px;
    position: relative;
  }
  .room .content section.sec_intro_room .room_detail.sec_kitchen .room_photo2:after {
    content: '';
    width: 101px;
    height: 63px;
    background: url(images/icon_illust_kitchen.png) no-repeat 0 0;
    background-size: cover;
    position: absolute;
    bottom: 22px;
    right: -54px;
  }
}
@media screen and (max-width: 768px) and (max-width: 768px) {
  .room .content section.sec_intro_room .room_detail.sec_kitchen .room_photo2:after {
    top: initial;
    bottom: -30px;
    left: initial;
    right: 20px;
  }
}
@media screen and (max-width: 768px) and (max-width: 600px) {
  .room .content section.sec_intro_room .room_detail.sec_kitchen .room_photo2:after {
    width: 80.8px;
    height: 50.4px;
    right: 15px;
  }
}

.room .content section.sec_intro_room .room_detail.sec_kitchen .room_photo2 img {
  border-radius: 4px;
}
@media screen and (max-width: 768px) {
  .room .content section.sec_intro_room .room_detail.sec_kitchen .room_photo2 img {
    width: 100%;
  }
}
.room .content section.sec_intro_room .room_detail.sec_kitchen .room_info {
  width: 48%;
  margin-top: 40px;
}
@media screen and (max-width: 768px) {
  .room .content section.sec_intro_room .room_detail.sec_kitchen .room_info {
    width: 100%;
    margin-top: 30px;
  }
}
.room .content section.sec_intro_room .room_detail.sec_kitchen .room_info h2 {
  position: absolute;
  top: 0;
  left: 83%;
}
@media screen and (max-width: 768px) {
  .room .content section.sec_intro_room .room_detail.sec_kitchen .room_info h2 {
    position: static;
    margin-bottom: 20px;
  }
}
.room .content section.sec_intro_room .room_detail.sec_showerroom {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.room .content section.sec_intro_room .room_detail.sec_showerroom h2 {
  position: absolute;
  top: 0;
  left: 0;
}
@media screen and (max-width: 768px) {
  .room .content section.sec_intro_room .room_detail.sec_showerroom h2 {
    position: static;
  }
}
.room .content section.sec_intro_room .room_detail.sec_showerroom h2 .ttl_en {
  letter-spacing: 1px;
}
.room .content section.sec_intro_room .room_detail.sec_showerroom .room_photo {
  width: 56%;
  -webkit-box-ordinal-group: 2;
  -webkit-order: 1;
  -moz-order: 1;
  -ms-flex-order: 1;
  order: 1;
  position: relative;
}
@media screen and (max-width: 768px) {
  .room .content section.sec_intro_room .room_detail.sec_showerroom .room_photo {
    width: 100%;
    -webkit-box-ordinal-group: 1;
    -webkit-order: 0;
    -moz-order: 0;
    -ms-flex-order: 0;
    order: 0;
  }
}
.room .content section.sec_intro_room .room_detail.sec_showerroom .room_photo:after {
  content: '';
  width: 70px;
  height: 77px;
  background: url(images/icon_illust_shower.png) no-repeat 0 0;
  background-size: cover;
  position: absolute;
  bottom: -40px;
  right: 5px;
}
@media screen and (max-width: 768px) {
  .room .content section.sec_intro_room .room_detail.sec_showerroom .room_photo:after {
    right: 20px;
  }
}
@media screen and (max-width: 600px) {
  .room .content section.sec_intro_room .room_detail.sec_showerroom .room_photo:after {
    width: 63px;
    height: 69.3px;
    bottom: -35px;
    right: 15px;
  }
}
@media screen and (max-width: 768px) {
  .room .content section.sec_intro_room .room_detail.sec_showerroom .room_photo img {
    width: 100%;
  }
}
.room .content section.sec_intro_room .room_detail.sec_showerroom .room_info {
  width: 41%;
  -webkit-box-ordinal-group: 1;
  -webkit-order: 0;
  -moz-order: 0;
  -ms-flex-order: 0;
  order: 0;
  margin-top: 120px;
}
@media screen and (max-width: 768px) {
  .room .content section.sec_intro_room .room_detail.sec_showerroom .room_info {
    width: 100%;
    -webkit-box-ordinal-group: 2;
    -webkit-order: 1;
    -moz-order: 1;
    -ms-flex-order: 1;
    order: 1;
    margin-top: 30px;
  }
}
.room .content section.sec_intro_room .room_detail.sec_washroom {
  width: 48%;
  margin-bottom: 0;
}
@media screen and (max-width: 600px) {
  .room .content section.sec_intro_room .room_detail.sec_washroom {
    width: 100%;
    margin-bottom: 80px;
  }
}
.room .content section.sec_intro_room .room_detail.sec_washroom h2 {
  position: absolute;
  top: 340px;
  left: 0;
}
@media screen and (max-width: 768px) {
  .room .content section.sec_intro_room .room_detail.sec_washroom h2 {
    position: static;
  }
}
.room .content section.sec_intro_room .room_detail.sec_washroom .room_photo {
  position: relative;
}
.room .content section.sec_intro_room .room_detail.sec_washroom .room_photo:after {
  content: '';
  width: 69px;
  height: 71px;
  background: url(images/icon_illust_washroom.png) no-repeat 0 0;
  background-size: cover;
  position: absolute;
  bottom: -45px;
  right: 15px;
}
@media screen and (max-width: 768px) {
  .room .content section.sec_intro_room .room_detail.sec_washroom .room_photo:after {
    bottom: -35px;
  }
}
@media screen and (max-width: 600px) {
  .room .content section.sec_intro_room .room_detail.sec_washroom .room_photo img {
    width: 100%;
  }
}
.room .content section.sec_intro_room .room_detail.sec_washroom .room_info {
  margin-top: 100px;
}
@media screen and (max-width: 768px) {
  .room .content section.sec_intro_room .room_detail.sec_washroom .room_info {
    margin-top: 40px;
  }
}
.room .content section.sec_intro_room .room_detail.sec_toilet {
  width: 48%;
}
@media screen and (max-width: 600px) {
  .room .content section.sec_intro_room .room_detail.sec_toilet {
    width: 100%;
    margin-bottom: 80px;
  }
}
.room .content section.sec_intro_room .room_detail.sec_toilet h2 {
  position: absolute;
  top: 340px;
  left: 0;
}
@media screen and (max-width: 768px) {
  .room .content section.sec_intro_room .room_detail.sec_toilet h2 {
    position: static;
  }
}
.room .content section.sec_intro_room .room_detail.sec_toilet .room_photo {
  position: relative;
}
.room .content section.sec_intro_room .room_detail.sec_toilet .room_photo:after {
  content: '';
  width: 50px;
  height: 51px;
  background: url(images/icon_illust_toilet.png) no-repeat 0 0;
  background-size: cover;
  position: absolute;
  bottom: -35px;
  right: 15px;
}
@media screen and (max-width: 768px) {
  .room .content section.sec_intro_room .room_detail.sec_toilet .room_photo:after {
    bottom: -30px;
  }
}
@media screen and (max-width: 600px) {
  .room .content section.sec_intro_room .room_detail.sec_toilet .room_photo img {
    width: 100%;
  }
}
.room .content section.sec_intro_room .room_detail.sec_toilet .room_info {
  margin-top: 100px;
}
@media screen and (max-width: 768px) {
  .room .content section.sec_intro_room .room_detail.sec_toilet .room_info {
    margin-top: 40px;
  }
}
.room .content section.sec_intro_room .room_detail.sec_garden h2 {
  position: absolute;
  top: 236px;
  left: 0;
}
@media screen and (max-width: 768px) {
  .room .content section.sec_intro_room .room_detail.sec_garden h2 {
    position: static;
  }
}
.room .content section.sec_intro_room .room_detail.sec_garden .room_photo {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  position: relative;
}
.room .content section.sec_intro_room .room_detail.sec_garden .room_photo > div {
  width: 32.4%;
}
@media screen and (max-width: 600px) {
  .room .content section.sec_intro_room .room_detail.sec_garden .room_photo > div {
    width: 100%;
    margin-bottom: 10px;
  }
  .room .content section.sec_intro_room .room_detail.sec_garden .room_photo > div img {
    width: 100%;
  }
}
.room .content section.sec_intro_room .room_detail.sec_garden .room_photo:after {
  content: '';
  width: 71px;
  height: 73px;
  background: url(images/icon_illust_garden.png) no-repeat 0 0;
  background-size: cover;
  position: absolute;
  bottom: -50px;
  right: 15px;
}
@media screen and (max-width: 768px) {
  .room .content section.sec_intro_room .room_detail.sec_garden .room_photo:after {
    width: 63.9px;
    height: 65.7px;
    bottom: -33px;
  }
}
@media screen and (max-width: 600px) {
  .room .content section.sec_intro_room .room_detail.sec_garden .room_photo:after {
    width: 56.8px;
    height: 58.4px;
    bottom: -22px;
  }
}
.room .content section.sec_intro_room .room_detail.sec_garden .room_info {
  margin-top: 100px;
}
@media screen and (max-width: 768px) {
  .room .content section.sec_intro_room .room_detail.sec_garden .room_info {
    margin-top: 40px;
  }
}
.room .content section.sec_basic_info {
  background: #f8f5f2;
}
.room .content section.sec_basic_info h2 {
  font-size: 24px;
  font-size: 2.4rem;
  margin-bottom: 60px;
}
@media screen and (max-width: 600px) {
  .room .content section.sec_basic_info h2 {
    font-size: 20px;
    font-size: 2rem;
  }
}
.room .content section.sec_basic_info dl {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-bottom: 60px;
}
.room .content section.sec_basic_info dl:last-child {
  margin-bottom: 0;
}
.room .content section.sec_basic_info dl dt {
  width: 26%;
  font-family: "Roboto", "Noto Sans CJK JP", "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif;
  font-size: 16px;
  font-size: 1.6rem;
  font-weight: 700;
  letter-spacing: 2px;
}
@media screen and (max-width: 768px) {
  .room .content section.sec_basic_info dl dt {
    width: 100%;
    margin-bottom: 20px;
  }
}
.room .content section.sec_basic_info dl dt .icon {
  display: inline-block;
  width: 40px;
  margin-right: 10px;
  text-align: center;
  position: relative;
}
.room .content section.sec_basic_info dl dt .icon.icon_amenity {
  top: 3px;
}
.room .content section.sec_basic_info dl dt .icon.icon_kitchen {
  top: -2px;
}
.room .content section.sec_basic_info dl dt .icon.icon_facilities {
  top: 5px;
}
.room .content section.sec_basic_info dl dd {
  width: 74%;
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
@media screen and (max-width: 768px) {
  .room .content section.sec_basic_info dl dd {
    width: 100%;
  }
}
.room .content section.sec_basic_info dl dd table {
  width: 50%;
  border-top: 1px solid #303030;
  border-left: 1px solid #303030;
}
@media screen and (max-width: 480px) {
  .room .content section.sec_basic_info dl dd table {
    width: 100%;
  }
}
.room .content section.sec_basic_info dl dd table th,
.room .content section.sec_basic_info dl dd table td {
  padding: 15px;
  border-right: 1px solid #303030;
  border-bottom: 1px solid #303030;
}
@media screen and (max-width: 600px) {
  .room .content section.sec_basic_info dl dd table th,
  .room .content section.sec_basic_info dl dd table td {
    padding: 10px 5px;
  }
}
.room .content section.sec_basic_info dl dd table th {
  width: 70px;
  text-align: center;
}
@media screen and (max-width: 600px) {
  .room .content section.sec_basic_info dl dd table th {
    width: 45px;
  }
}
@media screen and (max-width: 480px) {
  .room .content section.sec_basic_info dl dd table th {
    width: 50px;
  }
}
.room .content section.sec_basic_info dl dd table td {
  padding-left: 20px;
}
@media screen and (max-width: 600px) {
  .room .content section.sec_basic_info dl dd table td {
    padding-left: 10px;
  }
}
.room .content section.sec_basic_info dl dd table:last-child {
  border-left: none;
}
@media screen and (max-width: 480px) {
  .room .content section.sec_basic_info dl dd table:last-child {
    border-left: 1px solid #303030;
    border-top: none;
  }
}
.room .content section.sec_basic_info dl dd.border {
  border-left: 1px solid #303030;
  padding-left: 30px;
}
@media screen and (max-width: 768px) {
  .room .content section.sec_basic_info dl dd.border {
    border-left: none;
    padding-left: 0;
  }
}
.room .content section.sec_basic_info dl dd .checkinout {
  font-weight: 500;
}
.room .content section.sec_basic_info dl dd .checkinout span {
  display: inline-block;
  width: 10em;
  font-weight: 400;
}
.room .content section.sec_basic_info dl dd .note {
  margin-top: 10px;
}
.room .content section.sec_basic_info dl dd ul li {
  padding: 0 0 10px 1em;
  text-indent: -1em;
}

.plan header .header_top .gnav li.nav_plan a span:after {
  width: 100%;
}
@media screen and (max-width: 768px) {
  .plan .page_ttl {
    background-image: url(images/photo_main_ttl_plan.jpg);
  }
}
.plan .page_ttl:after {
  background-image: url(images/photo_main_ttl_plan.jpg);
}

.experience header .header_top .gnav li.nav_experience a span:after {
  width: 100%;
}
@media screen and (max-width: 768px) {
  .experience .page_ttl {
    background-image: url(images/photo_main_ttl_experience.jpg);
    background-position: 70% bottom;
  }
}
.experience .page_ttl:after {
  background-image: url(images/photo_main_ttl_experience.jpg);
}

.plan .content section.sec_price,
.experience .content section.sec_price {
  background: #eee3d8;
}
.plan .content section.sec_price .lead,
.experience .content section.sec_price .lead {
  line-height: 2.2;
}
.plan .content section.sec_price section,
.experience .content section.sec_price section {
  padding: 90px 0 0;
  margin: 0 0 20px;
}
.plan .content section.sec_price section:last-child,
.experience .content section.sec_price section:last-child {
  margin-bottom: 0;
}
.plan .content section.sec_price .plan_intro > section,
.experience .content section.sec_price .plan_intro > section {
  position: relative;
}
.plan .content section.sec_price .plan_intro > section:nth-child(even) h2,
.experience .content section.sec_price .plan_intro > section:nth-child(even) h2 {
  left: initial;
  right: 30px;
}
@media screen and (max-width: 768px) {
  .plan .content section.sec_price .plan_intro > section:nth-child(even) h2,
  .experience .content section.sec_price .plan_intro > section:nth-child(even) h2 {
    right: initial;
    left: 30px;
  }
}
@media screen and (max-width: 600px) {
  .plan .content section.sec_price .plan_intro > section:nth-child(even) h2,
  .experience .content section.sec_price .plan_intro > section:nth-child(even) h2 {
    left: 15px;
  }
}
.plan .content section.sec_price .plan_intro > section:nth-child(even) .photo:after,
.experience .content section.sec_price .plan_intro > section:nth-child(even) .photo:after {
  background-image: url(images/img_dragon_over_left.png);
  right: initial;
  left: 0;
}
@media screen and (max-width: 768px) {
  .plan .content section.sec_price .plan_intro > section:nth-child(even) .photo:after,
  .experience .content section.sec_price .plan_intro > section:nth-child(even) .photo:after {
    background-image: url(images/img_dragon_over_right.png);
    left: initial;
    right: 0;
  }
}
.plan .content section.sec_price .plan_intro h2,
.experience .content section.sec_price .plan_intro h2 {
  display: block;
  -webkit-writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  font-size: 24px;
  font-size: 2.4rem;
  text-align: left;
  color: #020819;
  font-weight: 500;
  letter-spacing: 2px;
  padding: 20px 10px;
  position: absolute;
  top: 100px;
  left: 30px;
  z-index: 10;
}
@media screen and (max-width: 768px) {
  .plan .content section.sec_price .plan_intro h2,
  .experience .content section.sec_price .plan_intro h2 {
    font-size: 20px;
    font-size: 2rem;
  }
}
@media screen and (max-width: 600px) {
  .plan .content section.sec_price .plan_intro h2,
  .experience .content section.sec_price .plan_intro h2 {
    font-size: 18px;
    font-size: 1.8rem;
    padding: 15px 10px;
    left: 15px;
  }
}
@media screen and (max-width: 480px) {
  .plan .content section.sec_price .plan_intro h2,
  .experience .content section.sec_price .plan_intro h2 {
    padding: 15px 5px;
  }
}
@media screen and (max-width: 400px) {
  .plan .content section.sec_price .plan_intro h2,
  .experience .content section.sec_price .plan_intro h2 {
    font-size: 16px;
    font-size: 1.6rem;
  }
}
.plan .content section.sec_price .plan_intro .photo,
.experience .content section.sec_price .plan_intro .photo {
  margin-bottom: 20px;
  position: relative;
}
.plan .content section.sec_price .plan_intro .photo:after,
.experience .content section.sec_price .plan_intro .photo:after {
  content: '';
  width: 241px;
  height: 200px;
  background: url(images/img_dragon_over_right.png) no-repeat 0 0;
  background-size: cover;
  position: absolute;
  bottom: 0;
  right: 0;
}
@media screen and (max-width: 768px) {
  .plan .content section.sec_price .plan_intro .photo:after,
  .experience .content section.sec_price .plan_intro .photo:after {
    width: 168.7px;
    height: 140px;
  }
}
@media screen and (max-width: 600px) {
  .plan .content section.sec_price .plan_intro .photo:after,
  .experience .content section.sec_price .plan_intro .photo:after {
    width: 144.6px;
    height: 120px;
  }
}
@media screen and (max-width: 480px) {
  .plan .content section.sec_price .plan_intro .photo:after,
  .experience .content section.sec_price .plan_intro .photo:after {
    width: 120.5px;
    height: 100px;
  }
}
.plan .content section.sec_price .plan_intro .photo img,
.experience .content section.sec_price .plan_intro .photo img {
  border-radius: 6px;
}
@media screen and (max-width: 768px) {
  .plan .content section.sec_price .plan_intro .photo img,
  .experience .content section.sec_price .plan_intro .photo img {
    width: 100%;
    height: 400px;
    object-fit: cover;
    font-family: "object-fit: cover;";
  }
}
@media screen and (max-width: 480px) {
  .plan .content section.sec_price .plan_intro .photo img,
  .experience .content section.sec_price .plan_intro .photo img {
    height: 320px;
  }
}
@media screen and (max-width: 400px) {
  .plan .content section.sec_price .plan_intro .photo img,
  .experience .content section.sec_price .plan_intro .photo img {
    height: 280px;
  }
}
.plan .content section.sec_price .plan_intro h3,
.experience .content section.sec_price .plan_intro h3 {
  font-size: 20px;
  font-size: 2rem;
  font-weight: 500;
  margin-bottom: 20px;
}
@media screen and (max-width: 480px) {
  .plan .content section.sec_price .plan_intro h3,
  .experience .content section.sec_price .plan_intro h3 {
    font-size: 18px;
    font-size: 1.8rem;
  }
}
@media screen and (max-width: 400px) {
  .plan .content section.sec_price .plan_intro h3,
  .experience .content section.sec_price .plan_intro h3 {
    font-size: 16px;
    font-size: 1.6rem;
  }
}
.plan .content section.sec_price .plan_intro h3 span,
.experience .content section.sec_price .plan_intro h3 span {
  background: linear-gradient(transparent 70%, #decbb5 30%);
}
.plan .content section.sec_price .plan_intro .normal_stay_price table,
.experience .content section.sec_price .plan_intro .normal_stay_price table {
  width: 100%;
  margin-bottom: 10px;
}
.plan .content section.sec_price .plan_intro .normal_stay_price table thead th,
.experience .content section.sec_price .plan_intro .normal_stay_price table thead th {
  width: 20%;
  background: #72b7b6;
  font-size: 12px;
  font-size: 1.2rem;
  color: #fff;
  vertical-align: top;
}
.plan .content section.sec_price .plan_intro .normal_stay_price table thead th.price_high_season,
.experience .content section.sec_price .plan_intro .normal_stay_price table thead th.price_high_season {
  width: 40%;
  background: #78b6ba;
}
.plan .content section.sec_price .plan_intro .normal_stay_price table thead th.price_off_season,
.experience .content section.sec_price .plan_intro .normal_stay_price table thead th.price_off_season {
  width: 40%;
  background: #76afb8;
}
.plan .content section.sec_price .plan_intro .normal_stay_price table thead th span,
.experience .content section.sec_price .plan_intro .normal_stay_price table thead th span {
  display: block;
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: 500;
}
@media screen and (max-width: 600px) {
  .plan .content section.sec_price .plan_intro .normal_stay_price table thead th span,
  .experience .content section.sec_price .plan_intro .normal_stay_price table thead th span {
    font-size: 16px;
    font-size: 1.6rem;
  }
}
@media screen and (max-width: 480px) {
  .plan .content section.sec_price .plan_intro .normal_stay_price table thead th span,
  .experience .content section.sec_price .plan_intro .normal_stay_price table thead th span {
    font-size: 15px;
    font-size: 1.5rem;
  }
}
.plan .content section.sec_price .plan_intro .normal_stay_price table tbody th,
.plan .content section.sec_price .plan_intro .normal_stay_price table tbody td,
.experience .content section.sec_price .plan_intro .normal_stay_price table tbody th,
.experience .content section.sec_price .plan_intro .normal_stay_price table tbody td {
  background: #fff;
  font-size: 16px;
  font-size: 1.6rem;
}
@media screen and (max-width: 600px) {
  .plan .content section.sec_price .plan_intro .normal_stay_price table tbody th,
  .plan .content section.sec_price .plan_intro .normal_stay_price table tbody td,
  .experience .content section.sec_price .plan_intro .normal_stay_price table tbody th,
  .experience .content section.sec_price .plan_intro .normal_stay_price table tbody td {
    font-size: 14px;
    font-size: 1.4rem;
  }
}
.plan .content section.sec_price .plan_intro .normal_stay_price table tbody th span,
.experience .content section.sec_price .plan_intro .normal_stay_price table tbody th span {
  display: inline-block;
}
.plan .content section.sec_price .plan_intro .normal_stay_price table th,
.plan .content section.sec_price .plan_intro .normal_stay_price table td,
.experience .content section.sec_price .plan_intro .normal_stay_price table th,
.experience .content section.sec_price .plan_intro .normal_stay_price table td {
  text-align: center;
  padding: 25px 10px;
  border-right: 1px solid #b0cfd1;
  border-bottom: 1px solid #b0cfd1;
}
.plan .content section.sec_price .plan_intro .normal_stay_price table th:last-child,
.plan .content section.sec_price .plan_intro .normal_stay_price table td:last-child,
.experience .content section.sec_price .plan_intro .normal_stay_price table th:last-child,
.experience .content section.sec_price .plan_intro .normal_stay_price table td:last-child {
  border-right: none;
}
.plan .content section.sec_price .plan_intro .normal_stay_price table tr:last-child th,
.plan .content section.sec_price .plan_intro .normal_stay_price table tr:last-child td,
.experience .content section.sec_price .plan_intro .normal_stay_price table tr:last-child th,
.experience .content section.sec_price .plan_intro .normal_stay_price table tr:last-child td {
  border-bottom: none;
}
.plan .content section.sec_price .plan_intro .normal_stay_price .note,
.experience .content section.sec_price .plan_intro .normal_stay_price .note {
  font-size: 13px;
  font-size: 1.3rem;
  text-align: right;
  margin-bottom: 20px;
}
@media screen and (max-width: 480px) {
  .plan .content section.sec_price .plan_intro .normal_stay_price .note,
  .experience .content section.sec_price .plan_intro .normal_stay_price .note {
    font-size: 12px;
    font-size: 1.2rem;
  }
}
.plan .content section.sec_price .plan_intro .normal_stay_price .notice,
.experience .content section.sec_price .plan_intro .normal_stay_price .notice {
  margin-bottom: 30px;
}
.plan .content section.sec_price .plan_intro .normal_stay_price .notice li,
.experience .content section.sec_price .plan_intro .normal_stay_price .notice li {
  margin-bottom: 5px;
  padding-left: 1em;
  text-indent: -1em;
}
.plan .content section.sec_price .plan_intro .breakfast,
.experience .content section.sec_price .plan_intro .breakfast {
  padding-top: 50px;
  padding-bottom: 100px;
  margin: 0 0 100px;
  position: relative;
}
@media screen and (max-width: 600px) {
  .plan .content section.sec_price .plan_intro .breakfast,
  .experience .content section.sec_price .plan_intro .breakfast {
    padding-bottom: 80px;
    margin-bottom: 80px;
  }
}
@media screen and (max-width: 480px) {
  .plan .content section.sec_price .plan_intro .breakfast,
  .experience .content section.sec_price .plan_intro .breakfast {
    padding-bottom: 60px;
    margin-bottom: 60px;
  }
}
.plan .content section.sec_price .plan_intro .breakfast:after,
.experience .content section.sec_price .plan_intro .breakfast:after {
  content: '';
  width: 140px;
  height: 1px;
  background: #303030;
  position: absolute;
  bottom: 0;
  left: 0;
}
.plan .content section.sec_price .plan_intro .breakfast .breakfast_inner,
.experience .content section.sec_price .plan_intro .breakfast .breakfast_inner {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.plan .content section.sec_price .plan_intro .breakfast .breakfast_inner .photo_breakfast,
.experience .content section.sec_price .plan_intro .breakfast .breakfast_inner .photo_breakfast {
  width: 50%;
}
@media screen and (max-width: 600px) {
  .plan .content section.sec_price .plan_intro .breakfast .breakfast_inner .photo_breakfast,
  .experience .content section.sec_price .plan_intro .breakfast .breakfast_inner .photo_breakfast {
    width: 100%;
  }
}
.plan .content section.sec_price .plan_intro .breakfast .breakfast_inner .photo_breakfast img,
.experience .content section.sec_price .plan_intro .breakfast .breakfast_inner .photo_breakfast img {
  border-radius: 6px;
}
@media screen and (max-width: 600px) {
  .plan .content section.sec_price .plan_intro .breakfast .breakfast_inner .photo_breakfast img,
  .experience .content section.sec_price .plan_intro .breakfast .breakfast_inner .photo_breakfast img {
    width: 100%;
  }
}
.plan .content section.sec_price .plan_intro .breakfast .breakfast_inner .comment,
.experience .content section.sec_price .plan_intro .breakfast .breakfast_inner .comment {
  width: 48%;
  margin-top: 20px;
}
@media screen and (max-width: 768px) {
  .plan .content section.sec_price .plan_intro .breakfast .breakfast_inner .comment,
  .experience .content section.sec_price .plan_intro .breakfast .breakfast_inner .comment {
    margin-top: 5px;
  }
}
@media screen and (max-width: 600px) {
  .plan .content section.sec_price .plan_intro .breakfast .breakfast_inner .comment,
  .experience .content section.sec_price .plan_intro .breakfast .breakfast_inner .comment {
    width: 100%;
    margin-top: 0;
    margin-bottom: 20px;
  }
}
.plan .content section.sec_price .plan_intro .teacher_history,
.experience .content section.sec_price .plan_intro .teacher_history {
  background: #f3f0ef;
  padding: 30px;
  margin-top: 50px;
}
@media screen and (max-width: 480px) {
  .plan .content section.sec_price .plan_intro .teacher_history,
  .experience .content section.sec_price .plan_intro .teacher_history {
    padding: 25px;
  }
}
.plan .content section.sec_price .plan_intro .teacher_history .teacher_ttl,
.experience .content section.sec_price .plan_intro .teacher_history .teacher_ttl {
  font-size: 16px;
  font-size: 1.6rem;
  font-weight: bold;
  margin-bottom: 20px;
}
@media screen and (max-width: 480px) {
  .plan .content section.sec_price .plan_intro .teacher_history .teacher_ttl,
  .experience .content section.sec_price .plan_intro .teacher_history .teacher_ttl {
    font-size: 15px;
    font-size: 1.5rem;
  }
}
@media screen and (max-width: 400px) {
  .plan .content section.sec_price .plan_intro .teacher_history .teacher_ttl,
  .experience .content section.sec_price .plan_intro .teacher_history .teacher_ttl {
    font-size: 14px;
    font-size: 1.4rem;
  }
}
.plan .content section.sec_price .plan_intro .teacher_history .teacher_ttl span,
.experience .content section.sec_price .plan_intro .teacher_history .teacher_ttl span {
  display: inline-block;
}
.plan .content section.sec_price .plan_intro .plan_connect_nature .plan_info,
.experience .content section.sec_price .plan_intro .plan_connect_nature .plan_info {
  position: relative;
}
.plan .content section.sec_price .plan_intro .plan_connect_nature .plan_info:after,
.experience .content section.sec_price .plan_intro .plan_connect_nature .plan_info:after {
  content: '';
  width: 64px;
  height: 94px;
  background: url(images/img_illust01.png) no-repeat 0 0;
  background-size: cover;
  position: absolute;
  top: 30px;
  left: 63%;
}
@media screen and (max-width: 768px) {
  .plan .content section.sec_price .plan_intro .plan_connect_nature .plan_info:after,
  .experience .content section.sec_price .plan_intro .plan_connect_nature .plan_info:after {
    width: 57.6px;
    height: 84.6px;
    top: 20px;
    left: 69%;
  }
}
@media screen and (max-width: 600px) {
  .plan .content section.sec_price .plan_intro .plan_connect_nature .plan_info:after,
  .experience .content section.sec_price .plan_intro .plan_connect_nature .plan_info:after {
    width: 51.2px;
    height: 75.2px;
    left: 74%;
  }
}
@media screen and (max-width: 480px) {
  .plan .content section.sec_price .plan_intro .plan_connect_nature .plan_info:after,
  .experience .content section.sec_price .plan_intro .plan_connect_nature .plan_info:after {
    width: 44.8px;
    height: 65.8px;
    left: 74%;
  }
}
@media screen and (max-width: 400px) {
  .plan .content section.sec_price .plan_intro .plan_connect_nature .plan_info:after,
  .experience .content section.sec_price .plan_intro .plan_connect_nature .plan_info:after {
    width: 38.4px;
    height: 56.4px;
    left: initial;
    right: 20px;
  }
}
.plan .content section.sec_price .plan_intro .plan_meditation_massage .plan_info,
.experience .content section.sec_price .plan_intro .plan_meditation_massage .plan_info {
  margin-bottom: 30px;
  position: relative;
}
.plan .content section.sec_price .plan_intro .plan_meditation_massage .plan_info:after,
.experience .content section.sec_price .plan_intro .plan_meditation_massage .plan_info:after {
  content: '';
  width: 89px;
  height: 95px;
  background: url(images/img_illust02.png) no-repeat 0 0;
  background-size: cover;
  position: absolute;
  top: 35px;
  left: 65%;
}
@media screen and (max-width: 768px) {
  .plan .content section.sec_price .plan_intro .plan_meditation_massage .plan_info:after,
  .experience .content section.sec_price .plan_intro .plan_meditation_massage .plan_info:after {
    width: 71.2px;
    height: 76px;
    top: 30px;
    left: 69%;
  }
}
@media screen and (max-width: 600px) {
  .plan .content section.sec_price .plan_intro .plan_meditation_massage .plan_info:after,
  .experience .content section.sec_price .plan_intro .plan_meditation_massage .plan_info:after {
    left: 76%;
  }
}
@media screen and (max-width: 480px) {
  .plan .content section.sec_price .plan_intro .plan_meditation_massage .plan_info:after,
  .experience .content section.sec_price .plan_intro .plan_meditation_massage .plan_info:after {
    width: 62.3px;
    height: 66.5px;
    left: 77%;
  }
}
@media screen and (max-width: 400px) {
  .plan .content section.sec_price .plan_intro .plan_meditation_massage .plan_info:after,
  .experience .content section.sec_price .plan_intro .plan_meditation_massage .plan_info:after {
    width: 44.5px;
    height: 47.5px;
    left: 82%;
  }
}
.plan .content section.sec_price .plan_intro .plan_reading .plan_info,
.experience .content section.sec_price .plan_intro .plan_reading .plan_info {
  position: relative;
}
.plan .content section.sec_price .plan_intro .plan_reading .plan_info:after,
.experience .content section.sec_price .plan_intro .plan_reading .plan_info:after {
  content: '';
  width: 48px;
  height: 62px;
  background: url(images/img_illust03.png) no-repeat 0 0;
  background-size: cover;
  position: absolute;
  top: 42px;
  left: 63%;
}
@media screen and (max-width: 768px) {
  .plan .content section.sec_price .plan_intro .plan_reading .plan_info:after,
  .experience .content section.sec_price .plan_intro .plan_reading .plan_info:after {
    top: 37px;
    left: 70%;
  }
}
@media screen and (max-width: 600px) {
  .plan .content section.sec_price .plan_intro .plan_reading .plan_info:after,
  .experience .content section.sec_price .plan_intro .plan_reading .plan_info:after {
    left: 74%;
  }
}
@media screen and (max-width: 480px) {
  .plan .content section.sec_price .plan_intro .plan_reading .plan_info:after,
  .experience .content section.sec_price .plan_intro .plan_reading .plan_info:after {
    width: 38.4px;
    height: 49.6px;
    top: 32px;
    left: 78%;
  }
}
@media screen and (max-width: 400px) {
  .plan .content section.sec_price .plan_intro .plan_reading .plan_info:after,
  .experience .content section.sec_price .plan_intro .plan_reading .plan_info:after {
    width: 33.6px;
    height: 43.4px;
    left: 80%;
  }
}
.plan .content section.sec_price .plan_intro .btn_experience a,
.experience .content section.sec_price .plan_intro .btn_experience a {
  display: block;
  max-width: 340px;
  background: #3e302a;
  padding: 25px 10px;
  margin: 20px 0;
  font-size: 15px;
  font-size: 1.5rem;
  color: #fff;
  text-align: center;
  font-weight: 400;
  letter-spacing: 2px;
  position: relative;
}
@media screen and (max-width: 480px) {
  .plan .content section.sec_price .plan_intro .btn_experience a,
  .experience .content section.sec_price .plan_intro .btn_experience a {
    font-size: 15px;
    font-size: 1.5rem;
    padding: 20px 10px;
  }
}
@media screen and (max-width: 400px) {
  .plan .content section.sec_price .plan_intro .btn_experience a,
  .experience .content section.sec_price .plan_intro .btn_experience a {
    font-size: 14px;
    font-size: 1.4rem;
  }
}
.plan .content section.sec_price .plan_intro .btn_experience a,
.experience .content section.sec_price .plan_intro .btn_experience a {
  margin: 40px 0 0;
}
.plan .content section.sec_price .plan_intro .plan_meditation_massage .plan_info,
.experience .content section.sec_price .plan_intro .plan_meditation_massage .plan_info {
  margin-bottom: 30px;
}
.plan .content section.sec_price .plan_intro .plan_info,
.experience .content section.sec_price .plan_intro .plan_info {
  background: #f6f3ef;
  border-radius: 6px;
  padding: 65px 50px 15px;
  margin-top: 80px;
}
@media screen and (max-width: 768px) {
  .plan .content section.sec_price .plan_intro .plan_info,
  .experience .content section.sec_price .plan_intro .plan_info {
    padding: 50px 30px 10px;
    margin-top: 60px;
  }
}
@media screen and (max-width: 600px) {
  .plan .content section.sec_price .plan_intro .plan_info,
  .experience .content section.sec_price .plan_intro .plan_info {
    margin-top: 50px;
  }
}
@media screen and (max-width: 480px) {
  .plan .content section.sec_price .plan_intro .plan_info,
  .experience .content section.sec_price .plan_intro .plan_info {
    padding: 40px 15px 10px;
    margin-top: 40px;
  }
}
.plan .content section.sec_price .plan_intro .plan_info h3,
.experience .content section.sec_price .plan_intro .plan_info h3 {
  text-align: center;
  margin-bottom: 50px;
}
@media screen and (max-width: 768px) {
  .plan .content section.sec_price .plan_intro .plan_info h3,
  .experience .content section.sec_price .plan_intro .plan_info h3 {
    margin-bottom: 40px;
  }
}
@media screen and (max-width: 480px) {
  .plan .content section.sec_price .plan_intro .plan_info h3,
  .experience .content section.sec_price .plan_intro .plan_info h3 {
    margin-bottom: 30px;
  }
}
.plan .content section.sec_price .plan_intro .plan_info .plan_list,
.experience .content section.sec_price .plan_intro .plan_info .plan_list {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.plan .content section.sec_price .plan_intro .plan_info .plan_detail,
.experience .content section.sec_price .plan_intro .plan_info .plan_detail {
  width: 48%;
  margin-bottom: 40px;
}
@media screen and (max-width: 768px) {
  .plan .content section.sec_price .plan_intro .plan_info .plan_detail,
  .experience .content section.sec_price .plan_intro .plan_info .plan_detail {
    width: 100%;
  }
}
.plan .content section.sec_price .plan_intro .plan_info .plan_detail:first-child h4,
.experience .content section.sec_price .plan_intro .plan_info .plan_detail:first-child h4 {
  background: #6ba7bd;
}
.plan .content section.sec_price .plan_intro .plan_info .plan_detail:nth-child(2) h4,
.experience .content section.sec_price .plan_intro .plan_info .plan_detail:nth-child(2) h4 {
  background: #4c92ac;
}
.plan .content section.sec_price .plan_intro .plan_info .plan_detail:nth-child(3) h4,
.experience .content section.sec_price .plan_intro .plan_info .plan_detail:nth-child(3) h4 {
  background: #2d7793;
}
.plan .content section.sec_price .plan_intro .plan_info .plan_detail:nth-child(4) h4,
.experience .content section.sec_price .plan_intro .plan_info .plan_detail:nth-child(4) h4 {
  background: #1c637e;
}
.plan .content section.sec_price .plan_intro .plan_info .plan_detail .photo_option,
.experience .content section.sec_price .plan_intro .plan_info .plan_detail .photo_option {
  margin-bottom: 20px;
}
.plan .content section.sec_price .plan_intro .plan_info .plan_detail .photo_option img,
.experience .content section.sec_price .plan_intro .plan_info .plan_detail .photo_option img {
  border-radius: 6px;
}
@media screen and (max-width: 768px) {
  .plan .content section.sec_price .plan_intro .plan_info .plan_detail .photo_option img,
  .experience .content section.sec_price .plan_intro .plan_info .plan_detail .photo_option img {
    width: 100%;
  }
}
.plan .content section.sec_price .plan_intro .plan_info h4,
.experience .content section.sec_price .plan_intro .plan_info h4 {
  background: #6ba7bd;
  font-size: 16px;
  font-size: 1.6rem;
  color: #fff;
  text-align: center;
  letter-spacing: 1px;
  padding: 15px 10px;
  margin-bottom: 15px;
}
@media screen and (max-width: 480px) {
  .plan .content section.sec_price .plan_intro .plan_info h4,
  .experience .content section.sec_price .plan_intro .plan_info h4 {
    font-size: 14px;
    font-size: 1.4rem;
    padding: 10px;
  }
}
.plan .content section.sec_price .plan_intro .plan_info .price_wrapper,
.experience .content section.sec_price .plan_intro .plan_info .price_wrapper {
  background: #e3e7e8;
  border-radius: 6px;
  padding: 15px;
  margin-top: 20px;
}
@media screen and (max-width: 480px) {
  .plan .content section.sec_price .plan_intro .plan_info .price_wrapper,
  .experience .content section.sec_price .plan_intro .plan_info .price_wrapper {
    padding: 10px 5px;
  }
}
.plan .content section.sec_price .plan_intro .plan_info table th,
.plan .content section.sec_price .plan_intro .plan_info table td,
.experience .content section.sec_price .plan_intro .plan_info table th,
.experience .content section.sec_price .plan_intro .plan_info table td {
  padding: 3px 5px;
  vertical-align: top;
}
.plan .content section.sec_price .plan_intro .plan_info table th,
.experience .content section.sec_price .plan_intro .plan_info table th {
  width: 6em;
  color: #1c637e;
}
.plan .content section.sec_price .plan_intro .plan_info table td.person_num,
.experience .content section.sec_price .plan_intro .plan_info table td.person_num {
  width: 6em;
}
.plan .content section.sec_price .plan_intro .plan_info .note,
.experience .content section.sec_price .plan_intro .plan_info .note {
  margin-top: 5px;
}
.plan .content section.sec_price .payment,
.experience .content section.sec_price .payment {
  margin-top: 20px;
}
.plan .content section.sec_price .btn_school a,
.experience .content section.sec_price .btn_school a {
  display: block;
  max-width: 340px;
  background: #3e302a;
  padding: 25px 10px;
  margin: 20px 0;
  font-size: 15px;
  font-size: 1.5rem;
  color: #fff;
  text-align: center;
  font-weight: 400;
  letter-spacing: 2px;
  position: relative;
}
@media screen and (max-width: 480px) {
  .plan .content section.sec_price .btn_school a,
  .experience .content section.sec_price .btn_school a {
    font-size: 15px;
    font-size: 1.5rem;
    padding: 20px 10px;
  }
}
@media screen and (max-width: 400px) {
  .plan .content section.sec_price .btn_school a,
  .experience .content section.sec_price .btn_school a {
    font-size: 14px;
    font-size: 1.4rem;
  }
}
@media screen and (max-width: 600px) {
  .plan .content section.sec_price .btn_school a,
  .experience .content section.sec_price .btn_school a {
    max-width: 100%;
  }
}
.plan .content section.sec_payment,
.experience .content section.sec_payment {
  background: #f6f2ed;
}
.plan .content section.sec_payment h2,
.experience .content section.sec_payment h2 {
  font-size: 22px;
  font-size: 2.2rem;
  text-align: left;
  font-weight: 500;
  letter-spacing: 1px;
  margin-bottom: 60px;
}
@media screen and (max-width: 600px) {
  .plan .content section.sec_payment h2,
  .experience .content section.sec_payment h2 {
    font-size: 20px;
    font-size: 2rem;
    margin-bottom: 40px;
  }
}
@media screen and (max-width: 480px) {
  .plan .content section.sec_payment h2,
  .experience .content section.sec_payment h2 {
    font-size: 18px;
    font-size: 1.8rem;
    margin-bottom: 30px;
  }
}
.plan .content section.sec_payment h3,
.experience .content section.sec_payment h3 {
  font-size: 20px;
  font-size: 2rem;
  font-weight: 500;
  margin-bottom: 20px;
}
@media screen and (max-width: 480px) {
  .plan .content section.sec_payment h3,
  .experience .content section.sec_payment h3 {
    font-size: 18px;
    font-size: 1.8rem;
  }
}
@media screen and (max-width: 400px) {
  .plan .content section.sec_payment h3,
  .experience .content section.sec_payment h3 {
    font-size: 16px;
    font-size: 1.6rem;
  }
}
.plan .content section.sec_payment h3 span,
.experience .content section.sec_payment h3 span {
  background: linear-gradient(transparent 70%, #decbb5 30%);
}
.plan .content section.sec_payment section,
.experience .content section.sec_payment section {
  padding: 0;
  margin: 50px 0;
}
.plan .content section.sec_payment section:last-child,
.experience .content section.sec_payment section:last-child {
  margin-bottom: 0;
}
.plan .content section.sec_payment .yucho_bank,
.experience .content section.sec_payment .yucho_bank {
  margin: 50px 0;
}
.plan .content section.sec_payment .bank_name,
.experience .content section.sec_payment .bank_name {
  font-weight: 500;
  margin-bottom: 20px;
}
.plan .content section.sec_payment .select_bank,
.experience .content section.sec_payment .select_bank {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.plan .content section.sec_payment .select_bank > div,
.experience .content section.sec_payment .select_bank > div {
  width: 48%;
}
@media screen and (max-width: 600px) {
  .plan .content section.sec_payment .select_bank > div,
  .experience .content section.sec_payment .select_bank > div {
    width: 100%;
  }
}
@media screen and (max-width: 600px) {
  .plan .content section.sec_payment .select_bank > div.from_yucho,
  .experience .content section.sec_payment .select_bank > div.from_yucho {
    margin-bottom: 30px;
  }
}
.plan .content section.sec_payment .select_bank > div table,
.experience .content section.sec_payment .select_bank > div table {
  margin-top: 10px;
}
.plan .content section.sec_payment .select_bank > div table tr:last-child th,
.plan .content section.sec_payment .select_bank > div table tr:last-child td,
.experience .content section.sec_payment .select_bank > div table tr:last-child th,
.experience .content section.sec_payment .select_bank > div table tr:last-child td {
  border-bottom: none;
}
.plan .content section.sec_payment .select_bank > div table th,
.plan .content section.sec_payment .select_bank > div table td,
.experience .content section.sec_payment .select_bank > div table th,
.experience .content section.sec_payment .select_bank > div table td {
  padding: 15px;
  border-bottom: 1px solid #f6f2ed;
}
@media screen and (max-width: 480px) {
  .plan .content section.sec_payment .select_bank > div table th,
  .plan .content section.sec_payment .select_bank > div table td,
  .experience .content section.sec_payment .select_bank > div table th,
  .experience .content section.sec_payment .select_bank > div table td {
    padding: 15px 10px;
  }
}
.plan .content section.sec_payment .select_bank > div table th,
.experience .content section.sec_payment .select_bank > div table th {
  width: 120px;
  text-align: center;
  background: #e2c79c;
}
@media screen and (max-width: 480px) {
  .plan .content section.sec_payment .select_bank > div table th,
  .experience .content section.sec_payment .select_bank > div table th {
    width: 110px;
  }
}
.plan .content section.sec_payment .select_bank > div table td,
.experience .content section.sec_payment .select_bank > div table td {
  background: #fff;
  padding-left: 20px;
}
@media screen and (max-width: 480px) {
  .plan .content section.sec_payment .select_bank > div table td,
  .experience .content section.sec_payment .select_bank > div table td {
    padding-left: 10px;
  }
}
.plan .content section.sec_payment .rakuten_bank,
.experience .content section.sec_payment .rakuten_bank {
  width: 48%;
}
@media screen and (max-width: 600px) {
  .plan .content section.sec_payment .rakuten_bank,
  .experience .content section.sec_payment .rakuten_bank {
    width: 100%;
  }
}
.plan .content section.sec_payment .rakuten_bank table,
.experience .content section.sec_payment .rakuten_bank table {
  margin-top: 10px;
}
.plan .content section.sec_payment .rakuten_bank table tr:last-child th,
.plan .content section.sec_payment .rakuten_bank table tr:last-child td,
.experience .content section.sec_payment .rakuten_bank table tr:last-child th,
.experience .content section.sec_payment .rakuten_bank table tr:last-child td {
  border-bottom: none;
}
.plan .content section.sec_payment .rakuten_bank table th,
.plan .content section.sec_payment .rakuten_bank table td,
.experience .content section.sec_payment .rakuten_bank table th,
.experience .content section.sec_payment .rakuten_bank table td {
  padding: 15px;
  border-bottom: 1px solid #f6f2ed;
}
.plan .content section.sec_payment .rakuten_bank table th,
.experience .content section.sec_payment .rakuten_bank table th {
  width: 120px;
  text-align: center;
  background: #d5b79d;
}
.plan .content section.sec_payment .rakuten_bank table td,
.experience .content section.sec_payment .rakuten_bank table td {
  background: #fff;
  padding-left: 20px;
}
.plan .content section.sec_payment dl,
.experience .content section.sec_payment dl {
  margin-bottom: 20px;
}
.plan .content section.sec_payment dl dt,
.plan .content section.sec_payment dl dd,
.experience .content section.sec_payment dl dt,
.experience .content section.sec_payment dl dd {
  display: inline-block;
}
.plan .content section.sec_payment dl dt,
.experience .content section.sec_payment dl dt {
  width: 120px;
}
.plan .content section.sec_payment dl dd,
.experience .content section.sec_payment dl dd {
  width: calc(100% - 160px);
  font-weight: 500;
}

.school header .header_top .gnav li.nav_school a span:after {
  width: 100%;
}
@media screen and (max-width: 768px) {
  .school .page_ttl {
    background-image: url(images/photo_main_ttl_shool.jpg);
    background-position: 44% bottom;
  }
}
.school .page_ttl:after {
  background-image: url(images/photo_main_ttl_shool.jpg);
}
.school .content section.sec_massage_school {
  background: #eee3d8;
}
.school .content section.sec_massage_school .note {
  color: #bd1818;
  margin-top: 20px;
}
.school .content section.sec_massage_school .teacher_history {
  background: #f3f0ef;
  padding: 30px;
}
@media screen and (max-width: 480px) {
  .school .content section.sec_massage_school .teacher_history {
    padding: 25px;
  }
}
.school .content section.sec_massage_school .teacher_history .teacher_ttl {
  font-size: 16px;
  font-size: 1.6rem;
  font-weight: bold;
  margin-bottom: 20px;
}
@media screen and (max-width: 480px) {
  .school .content section.sec_massage_school .teacher_history .teacher_ttl {
    font-size: 15px;
    font-size: 1.5rem;
  }
}
@media screen and (max-width: 400px) {
  .school .content section.sec_massage_school .teacher_history .teacher_ttl {
    font-size: 14px;
    font-size: 1.4rem;
  }
}
.school .content section.sec_massage_school .teacher_history .teacher_ttl span {
  display: inline-block;
}
.school .content section.sec_massage_school .school_price {
  padding: 0;
  margin: 50px 0;
}
.school .content section.sec_massage_school .school_price:last-child {
  margin-top: 70px;
}
@media screen and (max-width: 480px) {
  .school .content section.sec_massage_school .school_price:last-child {
    margin-top: 50px;
  }
}
.school .content section.sec_massage_school h3 {
  font-size: 20px;
  font-size: 2rem;
  font-weight: 500;
  margin-bottom: 20px;
}
@media screen and (max-width: 480px) {
  .school .content section.sec_massage_school h3 {
    font-size: 18px;
    font-size: 1.8rem;
  }
}
@media screen and (max-width: 400px) {
  .school .content section.sec_massage_school h3 {
    font-size: 16px;
    font-size: 1.6rem;
  }
}
.school .content section.sec_massage_school h3 span {
  background: linear-gradient(transparent 70%, #decbb5 30%);
}
.school .content section.sec_massage_school .lead {
  font-size: 16px;
  font-size: 1.6rem;
  margin-bottom: 20px;
}
@media screen and (max-width: 480px) {
  .school .content section.sec_massage_school .lead {
    font-size: 14px;
    font-size: 1.4rem;
  }
}
.school .content section.sec_massage_school .price_list {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.school .content section.sec_massage_school .price_list > div {
  width: 48%;
}
@media screen and (max-width: 768px) {
  .school .content section.sec_massage_school .price_list > div {
    width: 100%;
  }
}
.school .content section.sec_massage_school .price_list > div.price_short_course .school_ttl {
  background: #76afb8;
}
.school .content section.sec_massage_school .price_list > div.price_long_course .school_ttl {
  background: #4c92ac;
}
.school .content section.sec_massage_school .price_list > div .school_ttl {
  text-align: center;
  color: #fff;
  padding: 20px 10px;
  margin-bottom: 0;
}
.school .content section.sec_massage_school .price_list > div .school_ttl span {
  display: block;
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: 500;
}
.school .content section.sec_massage_school .price_list > div table {
  width: 100%;
}
.school .content section.sec_massage_school .price_list > div table tr:last-child th,
.school .content section.sec_massage_school .price_list > div table tr:last-child td {
  border-bottom: none;
}
.school .content section.sec_massage_school .price_list > div table th,
.school .content section.sec_massage_school .price_list > div table td {
  width: 50%;
  background: #fff;
  font-size: 16px;
  font-size: 1.6rem;
  text-align: center;
  font-weight: 500;
  padding: 20px 10px;
}
@media screen and (max-width: 480px) {
  .school .content section.sec_massage_school .price_list > div table th,
  .school .content section.sec_massage_school .price_list > div table td {
    font-size: 15px;
    font-size: 1.5rem;
    padding: 20px 5px;
  }
}
.school .content section.sec_massage_school .price_list > div table th {
  border-right: 1px solid #b0cfd1;
  border-bottom: 1px solid #b0cfd1;
}
.school .content section.sec_massage_school .price_list > div table th span {
  display: block;
  font-size: 12px;
  font-size: 1.2rem;
  font-weight: 400;
}
.school .content section.sec_massage_school .price_list > div table td {
  border-bottom: 1px solid #b0cfd1;
}
.school .content section.sec_massage_school .note {
  margin-top: 20px;
}

.access header .header_top .gnav li.nav_access a span:after {
  width: 100%;
}
@media screen and (max-width: 768px) {
  .access .page_ttl {
    background-image: url(images/photo_main_ttl_access.jpg);
  }
}
.access .page_ttl:after {
  background-image: url(images/photo_main_ttl_access.jpg);
}
.access .content section.sec_access {
  background: #eee3d8;
}
.access .content section.sec_access .gh_basic_info {
  margin-bottom: 30px;
}
.access .content section.sec_access .gh_addr span {
  display: inline-block;
}
.access .content section.sec_access .gh_tel a {
  font-family: "Roboto", "Noto Sans CJK JP", "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif;
  color: #303030;
  font-size: 16px;
  font-size: 1.6rem;
  letter-spacing: 2px;
}
.access .content section.sec_access .gh_tel strong {
  font-size: 24px;
  font-size: 2.4rem;
}
@media screen and (max-width: 400px) {
  .access .content section.sec_access .gh_tel strong {
    font-size: 22px;
    font-size: 2.2rem;
  }
}
.access .content section.sec_access .reception_time {
  font-family: "Roboto", "Noto Sans CJK JP", "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif;
  font-size: 12px;
  font-size: 1.2rem;
}
.access .content section.sec_access .carnavi_info {
  font-size: 13px;
  font-size: 1.3rem;
  margin-bottom: 20px;
}
.access .content section.sec_access .carnavi_info .mapcode {
  font-family: "Roboto", "Noto Sans CJK JP", "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif;
  font-size: 30px;
  font-size: 3rem;
  letter-spacing: 2px;
}
@media screen and (max-width: 480px) {
  .access .content section.sec_access .carnavi_info .mapcode {
    font-size: 24px;
    font-size: 2.4rem;
  }
}
@media screen and (max-width: 400px) {
  .access .content section.sec_access .carnavi_info .mapcode {
    font-size: 22px;
    font-size: 2.2rem;
  }
}
@media screen and (max-width: 480px) {
  .access .content section.sec_access .gmap iframe {
    height: 440px;
  }
}
@media screen and (max-width: 400px) {
  .access .content section.sec_access .gmap iframe {
    height: 400px;
  }
}
.access .content section.sec_transportation {
  background: #f6f2ed;
}
.access .content section.sec_transportation section {
  padding: 0;
  margin-bottom: 70px;
}
.access .content section.sec_transportation section:last-child {
  margin-bottom: 0;
}
.access .content section.sec_transportation h3 {
  font-size: 20px;
  font-size: 2rem;
  font-weight: 500;
  margin-bottom: 20px;
}
@media screen and (max-width: 480px) {
  .access .content section.sec_transportation h3 {
    font-size: 18px;
    font-size: 1.8rem;
  }
}
@media screen and (max-width: 400px) {
  .access .content section.sec_transportation h3 {
    font-size: 16px;
    font-size: 1.6rem;
  }
}
.access .content section.sec_transportation h3 span {
  background: linear-gradient(transparent 70%, #decbb5 30%);
}
.access .content section.sec_transportation h4 {
  font-size: 15px;
  font-size: 1.5rem;
  font-weight: 500;
  margin-bottom: 10px;
}
.access .content section.sec_transportation .bus_info {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  justify-content: flex-start;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin: 15px 0 40px;
}
@media screen and (max-width: 600px) {
  .access .content section.sec_transportation .bus_info {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    justify-content: space-between;
  }
}
.access .content section.sec_transportation .bus_info:last-child {
  margin-bottom: 0;
}
.access .content section.sec_transportation .bus_info li {
  width: 212px;
  margin-right: 20px;
}
@media screen and (max-width: 600px) {
  .access .content section.sec_transportation .bus_info li {
    width: 48%;
    margin-right: 0;
  }
}
.access .content section.sec_transportation .bus_info li a {
  display: block;
  padding: 15px 10px;
  color: #fff;
  text-align: center;
}
@media screen and (max-width: 480px) {
  .access .content section.sec_transportation .bus_info li a {
    padding: 12px 10px;
  }
}
.access .content section.sec_transportation .bus_info li.bus_timetable a {
  background: #cfa577;
}
.access .content section.sec_transportation .bus_info li.bus_price a {
  background: #362017;
}
.access .content section.sec_areamap figure {
  text-align: center;
}

.contact header .header_top .gnav li.nav_contact a span:after {
  width: 100%;
}
@media screen and (max-width: 768px) {
  .contact .page_ttl {
    background-image: url(images/photo_main_ttl_contact.jpg);
  }
}
.contact .page_ttl:after {
  background-image: url(images/photo_main_ttl_contact.jpg);
}
.contact .content section.sec_contact {
  background: #eee5db;
  padding-bottom: 50px;
}
.contact .content section.sec_contact .reserve_list {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-top: 30px;
}
.contact .content section.sec_contact .reserve_list dl {
  width: 48.5%;
  background: #fff;
  padding: 40px 20px;
  margin-bottom: 30px;
  border-radius: 6px;
  text-align: center;
  font-weight: 500;
}
@media screen and (max-width: 600px) {
  .contact .content section.sec_contact .reserve_list dl {
    width: 100%;
    margin-bottom: 15px;
  }
  .contact .content section.sec_contact .reserve_list dl:last-child {
    margin-bottom: 0;
  }
}
.contact .content section.sec_contact .reserve_list dl.reserve_tel a {
  font-family: "Roboto", "Noto Sans CJK JP", "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif;
  color: #303030;
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: 700;
  letter-spacing: 1px;
}
.contact .content section.sec_contact .reserve_list dl.reserve_tel a strong {
  font-size: 24px;
  font-size: 2.4rem;
}
.contact .content section.sec_contact .reserve_list dl.reserve_tel .reception_time {
  font-size: 13px;
  font-size: 1.3rem;
}
.contact .content section.sec_contact .reserve_list dl.reserve_mail .btn_more a {
  display: block;
  max-width: 340px;
  background: #3e302a;
  padding: 25px 10px;
  margin: 20px 0;
  font-size: 15px;
  font-size: 1.5rem;
  color: #fff;
  text-align: center;
  font-weight: 400;
  letter-spacing: 2px;
  position: relative;
}
@media screen and (max-width: 480px) {
  .contact .content section.sec_contact .reserve_list dl.reserve_mail .btn_more a {
    font-size: 15px;
    font-size: 1.5rem;
    padding: 20px 10px;
  }
}
@media screen and (max-width: 400px) {
  .contact .content section.sec_contact .reserve_list dl.reserve_mail .btn_more a {
    font-size: 14px;
    font-size: 1.4rem;
  }
}
.contact .content section.sec_contact .reserve_list dl.reserve_mail .btn_more a {
  max-width: 220px;
  padding: 15px 10px;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .contact .content section.sec_contact .reserve_list dl.reserve_mail .btn_more a {
    padding: 12px 10px;
    max-width: 260px;
  }
}
@media screen and (max-width: 480px) {
  .contact .content section.sec_contact .reserve_list dl.reserve_mail .btn_more a {
    font-size: 14px;
    font-size: 1.4rem;
  }
}
.contact .content section.sec_contact .reserve_list dl.reserve_web .btn_more a {
  display: block;
  max-width: 340px;
  background: #3e302a;
  padding: 25px 10px;
  margin: 20px 0;
  font-size: 15px;
  font-size: 1.5rem;
  color: #fff;
  text-align: center;
  font-weight: 400;
  letter-spacing: 2px;
  position: relative;
}
@media screen and (max-width: 480px) {
  .contact .content section.sec_contact .reserve_list dl.reserve_web .btn_more a {
    font-size: 15px;
    font-size: 1.5rem;
    padding: 20px 10px;
  }
}
@media screen and (max-width: 400px) {
  .contact .content section.sec_contact .reserve_list dl.reserve_web .btn_more a {
    font-size: 14px;
    font-size: 1.4rem;
  }
}
.contact .content section.sec_contact .reserve_list dl.reserve_web .btn_more a {
  max-width: 220px;
  padding: 15px 10px;
  margin: 0 auto;
  background: #dd7f53;
}
@media screen and (max-width: 768px) {
  .contact .content section.sec_contact .reserve_list dl.reserve_web .btn_more a {
    padding: 12px 10px;
    max-width: 260px;
  }
}
@media screen and (max-width: 480px) {
  .contact .content section.sec_contact .reserve_list dl.reserve_web .btn_more a {
    font-size: 14px;
    font-size: 1.4rem;
  }
}
.contact .content section.sec_contact .reserve_list dt {
  font-size: 18px;
  font-size: 1.8rem;
  margin-bottom: 30px;
}
@media screen and (max-width: 480px) {
  .contact .content section.sec_contact .reserve_list dt {
    font-size: 16px;
    font-size: 1.6rem;
  }
}

@media screen and (max-width: 768px) {
  .reserve .page_ttl {
    background-image: url(images/photo_main_ttl_reserve.jpg);
  }
}
.reserve .page_ttl:after {
  background-image: url(images/photo_main_ttl_reserve.jpg);
}
.reserve .content section.sec_reserve {
  background: #eee5db;
  padding-bottom: 50px;
}
.reserve .content section.sec_reserve .reserve_list {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-top: 30px;
}
.reserve .content section.sec_reserve .reserve_list dl {
  width: 48.5%;
  background: #fff;
  padding: 40px 20px;
  margin-bottom: 30px;
  border-radius: 6px;
  text-align: center;
  font-weight: 500;
}
@media screen and (max-width: 600px) {
  .reserve .content section.sec_reserve .reserve_list dl {
    width: 100%;
    margin-bottom: 15px;
  }
  .reserve .content section.sec_reserve .reserve_list dl:last-child {
    margin-bottom: 0;
  }
}
.reserve .content section.sec_reserve .reserve_list dl.reserve_tel a {
  font-family: "Roboto", "Noto Sans CJK JP", "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif;
  color: #303030;
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: 700;
  letter-spacing: 1px;
}
.reserve .content section.sec_reserve .reserve_list dl.reserve_tel a strong {
  font-size: 24px;
  font-size: 2.4rem;
}
.reserve .content section.sec_reserve .reserve_list dl.reserve_tel .reception_time {
  font-size: 13px;
  font-size: 1.3rem;
}
.reserve .content section.sec_reserve .reserve_list dl.reserve_mail .btn_more a {
  display: block;
  max-width: 340px;
  background: #3e302a;
  padding: 25px 10px;
  margin: 20px 0;
  font-size: 15px;
  font-size: 1.5rem;
  color: #fff;
  text-align: center;
  font-weight: 400;
  letter-spacing: 2px;
  position: relative;
}
@media screen and (max-width: 480px) {
  .reserve .content section.sec_reserve .reserve_list dl.reserve_mail .btn_more a {
    font-size: 15px;
    font-size: 1.5rem;
    padding: 20px 10px;
  }
}
@media screen and (max-width: 400px) {
  .reserve .content section.sec_reserve .reserve_list dl.reserve_mail .btn_more a {
    font-size: 14px;
    font-size: 1.4rem;
  }
}
.reserve .content section.sec_reserve .reserve_list dl.reserve_mail .btn_more a {
  max-width: 220px;
  padding: 15px 10px;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .reserve .content section.sec_reserve .reserve_list dl.reserve_mail .btn_more a {
    padding: 12px 10px;
    max-width: 260px;
  }
}
@media screen and (max-width: 480px) {
  .reserve .content section.sec_reserve .reserve_list dl.reserve_mail .btn_more a {
    font-size: 14px;
    font-size: 1.4rem;
  }
}
.reserve .content section.sec_reserve .reserve_list dl.reserve_web .btn_more a {
  display: block;
  max-width: 340px;
  background: #3e302a;
  padding: 25px 10px;
  margin: 20px 0;
  font-size: 15px;
  font-size: 1.5rem;
  color: #fff;
  text-align: center;
  font-weight: 400;
  letter-spacing: 2px;
  position: relative;
}
@media screen and (max-width: 480px) {
  .reserve .content section.sec_reserve .reserve_list dl.reserve_web .btn_more a {
    font-size: 15px;
    font-size: 1.5rem;
    padding: 20px 10px;
  }
}
@media screen and (max-width: 400px) {
  .reserve .content section.sec_reserve .reserve_list dl.reserve_web .btn_more a {
    font-size: 14px;
    font-size: 1.4rem;
  }
}
.reserve .content section.sec_reserve .reserve_list dl.reserve_web .btn_more a {
  max-width: 220px;
  padding: 15px 10px;
  margin: 0 auto;
  background: #dd7f53;
}
@media screen and (max-width: 768px) {
  .reserve .content section.sec_reserve .reserve_list dl.reserve_web .btn_more a {
    padding: 12px 10px;
    max-width: 260px;
  }
}
@media screen and (max-width: 480px) {
  .reserve .content section.sec_reserve .reserve_list dl.reserve_web .btn_more a {
    font-size: 14px;
    font-size: 1.4rem;
  }
}
.reserve .content section.sec_reserve .reserve_list dt {
  font-size: 18px;
  font-size: 1.8rem;
  margin-bottom: 30px;
}
@media screen and (max-width: 480px) {
  .reserve .content section.sec_reserve .reserve_list dt {
    font-size: 16px;
    font-size: 1.6rem;
  }
}

/*--------------------------------------------------------------
 Post style
--------------------------------------------------------------*/

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