@charset "UTF-8";
/* Scss Document */
/* Scss Document */
/*color*/
/*ベース文字色*/
/*背景色*/
/*アクセント色*/
/*線*/
/*線*/
/*線*/
/*線*/
/*線*/
/*font*/
/*layout*/
* { box-sizing: border-box; margin: 0; padding: 0; word-break: break-all; }

html { width: 100%; height: 100%; overflow-x: hidden; }

body { width: 100%; position: relative; overflow-x: hidden; color: #000; background-color: #FFF; font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "ＭＳ Ｐゴシック", sans-serif; font-weight: 500; line-height: 1.8; font-size: 16px; }
@media screen and (max-width: 768px) { body { font-size: 14px; } }

h1, h2, h3, h4, h5, h6 { font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "ＭＳ Ｐゴシック", sans-serif; font-weight: normal; }

a[href], a[href]:active, a[href]:link, a[href]:visited, a[href]:hover { color: #000; text-decoration: none; }
a[href] img:hover, a[href]:active img:hover, a[href]:link img:hover, a[href]:visited img:hover, a[href]:hover img:hover { opacity: 0.7; }
a[href].notel, a[href]:active.notel, a[href]:link.notel, a[href]:visited.notel, a[href]:hover.notel { cursor: text; }

.cf:after { content: ''; display: block; clear: both; }

img, video { max-width: 100%; max-height: 100%; }

.wrapper { margin-left: auto; margin-right: auto; max-width: 1240px; padding-left: 20px; padding-right: 20px; float: none; }
@media screen and (max-width: 1024px) { .wrapper { padding-left: 6.25%; padding-right: 6.25%; } }

.cont { margin-top: 150px; }
@media screen and (max-width: 1024px) { .cont { margin-top: 80px; } }
.cont:first-of-type { margin-top: 0; }

.cont_50 { margin-top: 50px; }
@media screen and (max-width: 1024px) { .cont_50 { margin-top: 40px; } }

.cont_100 { margin-top: 100px; }
@media screen and (max-width: 1024px) { .cont_100 { margin-top: 60px; } }

.large_slider + .text_cont { margin-top: 30px; }

p + .info { margin-top: 20px; }

.info + .button { margin-top: 20px; }

.mention { margin-top: 30px; color: #595656; }

.small { font-size: 11px; margin-top: 10px; }

.f_serif { font-family: "Times New Roman", 游明朝, "Yu Mincho", 游明朝体, YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", HiraMinProN-W3, "ＭＳ Ｐ明朝", "MS PMincho", serif; }

.floor { color: #766d5e; margin-right: 0.5em; }

@media screen and (min-width: 1025px) { .pc_tate { -webkit-writing-mode: vertical-rl; -ms-writing-mode: tb-rl; writing-mode: vertical-rl; } }
.tate { -webkit-writing-mode: vertical-rl; -ms-writing-mode: tb-rl; writing-mode: vertical-rl; -ms-text-combine-horizontal: digits 2; }

.yoko_in_tate { -webkit-writing-mode: horizontal-tb; -ms-writing-mode: lr-tb; writing-mode: horizontal-tb; line-height: 1em; text-align: center; text-indent: 0; letter-spacing: 0.0em; }

@media screen and (min-width: 1025px) { .for_pc { display: block; } }
@media screen and (max-width: 1024px) { .for_pc { display: none; } }

@media screen and (min-width: 1025px) { .for_sp { display: none; } }
@media screen and (max-width: 1024px) { .for_sp { display: block; } }

@media screen and (max-width: 1024px) { .tab_w80 { float: none !important; width: auto !important; max-width: none !important; padding-right: 10% !important; padding-left: 10% !important; margin-right: auto !important; margin-left: auto !important; }
  .tab_w90 { float: none !important; width: auto !important; max-width: none !important; padding-right: 5% !important; padding-left: 5% !important; margin-right: auto !important; margin-left: auto !important; }
  .tab_w100 { float: none !important; width: 100% !important; max-width: none !important; padding-right: 0% !important; padding-left: 0% !important; margin-right: auto !important; margin-left: auto !important; }
  .tab_wrapper { float: none !important; width: 100% !important; max-width: none !important; padding-right: 6.25% !important; padding-left: 6.25% !important; margin-right: auto !important; margin-left: auto !important; } }
@media screen and (max-width: 768px) { .sp_w80 { float: none !important; width: 100% !important; max-width: none !important; padding-right: 10% !important; padding-left: 10% !important; margin-right: auto !important; margin-left: auto !important; }
  .sp_w90 { float: none !important; width: 100% !important; max-width: none !important; padding-right: 5% !important; padding-left: 5% !important; margin-right: auto !important; margin-left: auto !important; }
  .sp_w100 { float: none !important; width: 100% !important; max-width: none !important; padding-right: 0% !important; padding-left: 0% !important; margin-right: auto !important; margin-left: auto !important; }
  .sp_wrapper { float: none !important; width: 100% !important; max-width: none !important; padding-right: 6.25% !important; padding-left: 6.25% !important; margin-right: auto !important; margin-left: auto !important; } }
/*======================= header
=========================*/
#header { position: fixed; z-index: 6666; top: 0; left: 0; right: 0; transition: all 0.5s; width: 100%; }
@media screen and (min-width: 1025px) { #header { height: 75px; }
  #header:not(.scrolled) { /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+84,000000+100&0.7+0,0+100 */ background: -moz-linear-gradient(top, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.11) 84%, rgba(0, 0, 0, 0) 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.11) 84%, rgba(0, 0, 0, 0) 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.11) 84%, rgba(0, 0, 0, 0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3000000', endColorstr='#00000000',GradientType=0 ); /* IE6-9 */ }
  #header.scrolled { background: rgba(0, 0, 0, 0.75); }
  #header.scrolled #language { display: none; } }
@media screen and (max-width: 1024px) { #header { position: relative; width: 100%; left: 0; }
  #header.active { z-index: 9998; }
  #header.active #gnav h1 { position: fixed; z-index: 9998; }
  #header.active #gnav #menu_button { z-index: 9999; } }
#header #gnav { position: relative; /*==================================== language
====================================*/ }
@media screen and (min-width: 1025px) { #header #gnav { height: 75px; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; justify-content: space-between; } }
@media screen and (max-width: 1024px) { #header #gnav { z-index: 9999; top: 0; left: 0; width: 100%; height: 100%; }
  #header #gnav #menu_button { width: 55px; height: 55px; background-color: rgba(255, 255, 255, 0.5); cursor: pointer; position: fixed; left: 0; top: 0; z-index: 3; }
  #header #gnav #menu_button:before, #header #gnav #menu_button:after { content: ''; display: block; width: 40px; height: 1px; background-color: #000; position: absolute; left: 7.5px; transition: all 0.5s; }
  #header #gnav #menu_button:before { top: 20px; }
  #header #gnav #menu_button:after { top: 35px; }
  #header #gnav #menu_button.active:before, #header #gnav #menu_button.active:after { top: 50%; }
  #header #gnav #menu_button.active:before { transform: rotate(45deg); }
  #header #gnav #menu_button.active:after { transform: rotate(-45deg); } }
#header #gnav h1 { text-align: center; }
@media screen and (min-width: 1025px) { #header #gnav h1 { padding-right: 20px; max-width: calc(100% - 820px); }
  #header #gnav h1 a { display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; width: 100%; height: 75px; flex-direction: column; justify-content: flex-end; padding-bottom: 10px; } }
@media screen and (max-width: 1024px) { #header #gnav h1 { float: none; /*padding-left: 55px;
padding-right: 55px;*/ width: 100%; padding-top: 10px; position: absolute; left: auto; right: auto; top: 0; margin-left: auto; margin-right: auto; z-index: 2; }
  #header #gnav h1 img { max-width: calc(100% - 140px); padding-right: 10px; } }
@media screen and (min-width: 1025px) { #header #gnav .pages { display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; justify-content: flex-end; height: 75px; } }
@media screen and (max-width: 1024px) { #header #gnav .pages { background-color: #FFF; position: fixed; top: 0; left: 0; z-index: 9000; width: 100%; height: 100vh; padding-top: 80px; display: none; overflow-y: scroll; padding-bottom: 40px; padding-left: 6.25%; padding-right: 6.25%; } }
#header #gnav .pages li { text-align: center; height: 75px; flex-shrink: 0; }
@media screen and (max-width: 1024px) { #header #gnav .pages li { height: 50px; } }
#header #gnav .pages li a { display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; width: 100%; height: 100%; flex-direction: column; align-items: center; text-decoration: none; position: relative; line-height: 1.6; padding-left: 15px; padding-right: 15px; }
@media screen and (min-width: 1025px) { #header #gnav .pages li a { color: #FFF; justify-content: flex-end; padding-bottom: 10px; } }
@media screen and (max-width: 1180px) and (min-width: 1025px) { #header #gnav .pages li a { padding-left: 10px; padding-right: 10px; } }
@media screen and (max-width: 1024px) { #header #gnav .pages li a { justify-content: center; } }
#header #gnav .pages li a span { display: block; }
#header #gnav .pages li a span.eng { color: #766d5e; font-size: 11px; }
@media screen and (min-width: 1025px) { #header #gnav .pages li a span.eng { color: #bebebe; } }
@media screen and (max-width: 1180px) and (min-width: 1025px) { #header #gnav .pages li a span { font-size: 16px; }
  #header #gnav .pages li a span.eng { font-size: 10px; } }
#header #gnav .pages li a:before { content: ''; display: block; margin-left: auto; margin-right: auto; opacity: 0; position: absolute; bottom: 5px; left: 0; right: 0; transition: all 0.5s; transition-timing-function: ease-out; width: 0px; height: 1px; background-color: #FFF; }
@media screen and (min-width: 1025px) { #header #gnav .pages li:hover a:before, #header #gnav .pages li:hover p:before { opacity: 1; width: 40px; } }
@media screen and (min-width: 1025px) { #header #gnav .pages li.book { flex-basis: 100px; max-width: 100px; height: 75px; }
  #header #gnav .pages li.book a { background-color: #FFF; color: #000; transition: all 0.5s; } }
@media screen and (min-width: 1025px) and (min-width: 1025px) { #header #gnav .pages li.book a span.eng { color: #766d5e; } }
@media screen and (min-width: 1025px) { #header #gnav .pages li.book a:before { display: none; }
  #header #gnav .pages li.book a:hover { background-color: #766d5e; color: #FFF; }
  #header #gnav .pages li.book a:hover span { color: #bebebe; } }
@media screen and (max-width: 1024px) { #header #gnav .pages li.book a { background-color: #624442; color: #FFF; } }
#header #gnav #language { position: absolute; right: 20px; top: 85px; z-index: 7777; height: 30px; width: 100px; }
@media screen and (max-width: 1024px) { #header #gnav #language { top: 15px; right: 0; width: 70px; } }
#header #gnav #language .easy-select-box { background-color: #000; color: #FFF !important; width: 100%; height: 100%; position: relative; transition: all 0.5s; height: 30px; line-height: 30px; width: 100px !important; cursor: pointer; text-align: center; }
@media screen and (max-width: 1024px) { #header #gnav #language .easy-select-box { width: 70px !important; font-size: 12px; } }
#header #gnav #language .easy-select-box .esb-dropdown { top: 100%; }
#header #gnav #language .easy-select-box .esb-dropdown .esb-item { background-color: #8e8e8e; border-bottom: 1px dotted #595656; }
#header #gnav #language .easy-select-box .esb-dropdown .esb-item:last-child { border-bottom: 0; }
#header #gnav #language .easy-select-box .esb-dropdown .esb-item:hover { background-color: #595656; }

/* ========================================
	sp_bottom
======================================== */
#sp_bottom { position: fixed; z-index: 6666; left: 0; bottom: 0; width: 100%; }
#sp_bottom ul li { height: 50px; float: left; text-align: center; background-color: #624442; color: #FFF; }
#sp_bottom ul li.reserve { width: calc(100% - 141px); margin-right: 1px; font-size: 20px; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; justify-content: center; align-items: center; line-height: 1.2; }
@media screen and (max-width: 414px) { #sp_bottom ul li.reserve { flex-direction: column; } }
#sp_bottom ul li.reserve span { display: inline-block; margin-left: 1em; font-size: 13px; }
#sp_bottom ul li.tel { width: 140px; font-size: 20px; }
#sp_bottom ul li.tel a { width: 100%; height: 100%; color: #FFF; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; justify-content: center; align-items: center; padding-right: 90px; }

/*==================================== main_visual
====================================*/
#main_visual { width: 100%; height: 350px; position: relative; background-repeat: no-repeat; background-position: center center; background-size: cover; }
@media screen and (max-width: 414px) { #main_visual { height: 200px; } }
#main_visual > .search_box:not(.active) { position: absolute; bottom: 20px; left: 0; right: 0; margin-left: auto; margin-right: auto; }

.search_set { margin-left: auto; margin-right: auto; position: absolute; left: 0; right: 0; }
@media screen and (max-width: 1024px) { .search_set { display: none; position: fixed; top: 0; right: 0; width: 100%; height: 100vh; background-color: #FFF; z-index: 6666; padding-top: 40px; } }

@media screen and (min-width: 1025px) { #main_visual .search_set { bottom: 20px; max-width: 820px; margin-left: auto; margin-right: auto; }
  _:-ms-lang(x)::-ms-backdrop, #main_visual .search_set { width: 820px; } }
#bestrate-fixed { position: fixed; right: 0; top: 150px; z-index: 200; }
@media (max-width: 959px) { #bestrate-fixed { width: 50px; top: 100px; } }

/*======================= breadcrumb
=========================*/
#breadcrumb { margin-top: 20px; }
#breadcrumb ul { font-size: 0; }
#breadcrumb ul li { display: inline-block; position: relative; font-size: 14px; }
@media screen and (max-width: 768px) { #breadcrumb ul li { font-size: 12px; } }
#breadcrumb ul li:after { content: ''; display: inline-block; width: 5px; height: 5px; border-right: 1px solid #766d5e; border-top: 1px solid #766d5e; transform: rotate(45deg) translate(-2px, -1px); margin-left: 0.5em; margin-right: 0.5em; }
#breadcrumb ul li:last-of-type:after { display: none; }
#breadcrumb ul li a { position: relative; display: inline-block; }
#breadcrumb ul li a:after { content: ''; display: block; width: 100%; height: 1px; background-color: #766d5e; position: absolute; left: 0; bottom: 3px; opacity: 0; transition: all 0.2s; }
#breadcrumb ul li a:hover:after { opacity: 1; }
#breadcrumb + .cont { margin-top: 100px; }

/*==================================== footer
====================================*/
#footer { padding-bottom: 100px; }
#footer .hotel { text-align: center; margin-top: 100px; padding-top: 70px; padding-bottom: 110px; background: url("../images/common/bg_pattern.jpg") repeat; }
@media screen and (max-width: 1024px) { #footer .hotel { padding-top: 30px; padding-bottom: 40px; } }
#footer .hotel p, #footer .hotel a, #footer .hotel address { color: #FFF; }
#footer .hotel .logo { margin-bottom: 40px; }
@media screen and (max-width: 1024px) { #footer .hotel .logo { margin-bottom: 20px; } }
#footer .hotel address { font-style: normal; margin-bottom: 30px; }
@media screen and (max-width: 1024px) { #footer .hotel address { margin-bottom: 20px; } }
#footer .hotel .submenu { margin-top: 30px; }
@media screen and (max-width: 1024px) { #footer .hotel .submenu { margin-top: 20px; } }
#footer .hotel .submenu li { display: inline-block; }
#footer .hotel .submenu li:after { content: '/'; display: inline-block; margin-left: 0.5em; margin-right: 0.5em; color: #FFF; }
#footer .hotel .submenu li:last-child:after { display: none; }
#footer .hotel .submenu li a:hover { text-decoration: underline; }
#footer .hotel .sns { text-align: center; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; align-items: center; justify-content: space-between; width: 200px; margin: 30px auto; }
#footer .hotel .sns p { width: 100%; max-width: 40px; }
#footer .group h3 { padding: 15px; text-align: center; font-size: 18px; cursor: pointer; border-bottom: #c6c6c6 1px solid; }
#footer .group h3 span { position: relative; display: block; color: #c6c6c6; font-size: 12px; margin-top: 10px; padding-bottom: 10px; }
#footer .group h3 span:after { position: absolute; margin-left: auto; margin-right: auto; left: 0; right: 0; bottom: 0; width: 30px; height: 10px; content: ' '; background: url("../images/common/group_arrow.png") no-repeat center center/contain; transition: all 0.5s; }
#footer .group h3:hover span:after { bottom: -5px; }
#footer .group h3.open span:after { transform: rotate(-180deg); }
#footer .group h3.open:hover span:after { bottom: 5px; }
#footer .group h4 { margin: 0 10px 25px 0; max-width: 165px; padding: 4px 15px; font-weight: bold; line-height: 1.2; border: #c6c6c6 1px solid; }
#footer .group .wrapper { display: none; padding-top: 35px; padding-bottom: 15px; line-height: 1.6; font-size: 11px; }
@media screen and (max-width: 414px) { #footer .group .wrapper { padding-left: 10px; padding-right: 10px; } }
#footer .group .wrapper .group_list { word-wrap: break-word; overflow-wrap: break-word; }
@media screen and (min-width: 1025px) { #footer .group .wrapper .group_list { display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; } }
@media screen and (min-width: 1025px) { #footer .group .wrapper .group_list .left { flex-basis: 20%; max-width: 20%; } }
@media screen and (max-width: 1024px) { #footer .group .wrapper .group_list .left { display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; flex-wrap: wrap; }
  #footer .group .wrapper .group_list .left section { flex-basis: 25%; max-width: 25%; } }
@media screen and (max-width: 768px) { #footer .group .wrapper .group_list .left section { flex-basis: 50%; max-width: 50%; } }
#footer .group .wrapper .group_list .right { display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; flex-wrap: wrap; }
@media screen and (min-width: 1025px) { #footer .group .wrapper .group_list .right { flex-basis: 100%; max-width: 100%; } }
#footer .group .wrapper .group_list .right section { flex-basis: 25%; max-width: 25%; }
@media screen and (max-width: 768px) { #footer .group .wrapper .group_list .right section { flex-basis: 50%; max-width: 50%; min-width: 140px; } }
#footer .group .wrapper .group_list h5 { margin-right: 20.83333%; margin-bottom: 5px; padding-left: 8.33333%; border-bottom: #c6c6c6 1px solid; }
#footer .group .box ul { margin-bottom: 25px; }
#footer .group .box ul li { margin-left: 8.33333%; margin-right: 20.83333%; }
@media screen and (max-width: 1024px) { #footer .group .box ul { margin-bottom: 25px; }
  #footer .group .box ul li { margin-left: 4.16667%; margin-right: 10.41667%; }
  #footer .group .left { float: none; width: auto; }
  #footer .group .left div { float: left; width: 33.3333%; }
  #footer .group .right { float: none; width: auto; }
  #footer .group .right h5 { margin-right: 20.83333%; margin-bottom: 5px; padding-left: 8.33333%; border-bottom: #c6c6c6 1px solid; }
  #footer .group .right > section { float: left; width: 25%; } }
@media screen and (max-width: 414px) { #footer .group .box ul li { margin-left: 4.16667%; margin-right: 4.16667%; } }
#footer .banner_large { max-width: 1040px; margin-top: 100px; text-align: center; }
@media screen and (max-width: 768px) { #footer .banner_large { margin-top: 30px; } }
#footer .banners { max-width: 1040px; margin-top: 50px; }
@media screen and (max-width: 768px) { #footer .banners { margin-top: 30px; } }
#footer .banners ul { display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; flex-wrap: wrap; }
#footer .banners ul li { margin-left: 40px; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; justify-content: center; }
@media screen and (min-width: 769px) { #footer .banners ul li { flex-basis: calc((100% - 120px)/4); max-width: calc((100% - 120px)/4); margin-bottom: 30px; }
  #footer .banners ul li:nth-child(4n+1) { margin-left: 0; }
  #footer .banners ul li:nth-last-of-type(-n+4) { margin-bottom: 0; } }
@media screen and (max-width: 768px) { #footer .banners ul li { flex-basis: calc((100% - 40px)/2); max-width: calc((100% - 40px)/2); margin-bottom: 30px; }
  #footer .banners ul li:nth-child(2n+1) { margin-left: 0; }
  #footer .banners ul li:nth-last-of-type(-n+2) { margin-bottom: 0; } }
#footer .banners ul li a { width: 100%; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; justify-content: center; align-items: flex-start; align-content: flex-start; }
#footer .banners ul li a img { display: block; max-height: none; }
#footer .copy { margin-top: 100px; text-align: center; font-size: 11px; font-weight: 500; color: #bebebe; }
@media screen and (max-width: 768px) { #footer .copy { margin-top: 40px; } }
#footer .copy .group_logo { margin-bottom: 30px; }

/* IE11 */
_:-ms-lang(x)::-ms-backdrop, #footer .banners ul li a { display: block; }

@media screen and (min-width: 769px) { _:-ms-lang(x)::-ms-backdrop, #footer .banners ul li { flex-basis: calc((100% - 120px)/4 - 1px); max-width: calc((100% - 120px)/4 - 1px); } }
@media screen and (max-width: 768px) { _:-ms-lang(x)::-ms-backdrop, #footer .banners ul li { flex-basis: calc((100% - 40px)/2 - 1px); max-width: calc((100% - 40px)/2 - 1px); } }
/* Edge(EdgeHTML) */
@media screen and (min-width: 769px) { _:-ms-lang(x)::backdrop, #footer .banners ul li { flex-basis: calc((100% - 120px)/4 - 1px); max-width: calc((100% - 120px)/4 - 1px); } }
@media screen and (max-width: 768px) { _:-ms-lang(x)::backdrop, #footer .banners ul li { flex-basis: calc((100% - 40px)/2 - 1px); max-width: calc((100% - 40px)/2 - 1px); } }
/*==================================== 見出し
====================================*/
h3.line { font-size: 24px; line-height: 1.5; text-align: center; margin-bottom: 40px; }
h3.line span { color: #766d5e; font-size: 11px; display: block; margin-top: 10px; }
h3.line span.sub_main { font-size: 18px; color: #000; }
h3.line:before { content: ''; display: block; width: 30px; height: 1px; background-color: #766d5e; margin-left: auto; margin-right: auto; margin-bottom: 20px; }

/*1文字アクセントカラー*/
.first_c { font-size: 35px; line-height: 1.4; word-break: keep-all; }
.first_c em { color: #766d5e; width: 1em; font-style: normal; word-break: keep-all; }

h4.line_horizon { text-align: center; position: relative; margin-bottom: 50px; }
h4.line_horizon:before { content: ''; display: block; width: 100%; max-width: 1200px; margin-left: auto; margin-right: auto; height: 1px; position: absolute; top: 50%; left: 0; right: 0; background-color: #eeeeee; z-index: 0; }
h4.line_horizon span { font-size: 18px; display: inline-block; margin-left: auto; margin-right: auto; background-color: #FFF; position: relative; z-index: 1; padding-left: 60px; padding-right: 60px; }

.bg_colored h4.line_horizon:before { background-color: #FFF; }
.bg_colored h4.line_horizon span { background-color: #eeeeee; }

.info .title { margin-bottom: 20px; position: relative; }
.info .title:before { content: ''; display: block; width: 100%; height: 1px; background-color: #eeeeee; position: absolute; left: 0; bottom: 0; z-index: 1; }
.info .title:after { content: ''; display: block; width: 150px; height: 1px; background-color: #766d5e; position: absolute; left: 0; bottom: 0; z-index: 2; }

/*==================================== button
====================================*/
.button { margin-top: 40px; }
@media screen and (max-width: 414px) { .button { margin-top: 20px; } }
.button a, .button > label { border: 1px solid #bebebe; position: relative; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; justify-content: center; align-items: center; transition: all 0.5s; }
.button a:before, .button > label:before { content: ''; display: block; width: 6px; height: 6px; border-top: 1px solid #766d5e; border-right: 1px solid #766d5e; transform: rotate(45deg); position: absolute; right: 10px; top: 50%; z-index: 2; margin-top: -3px; transition: all 0.5s; }
.button a:hover, .button > label:hover { background-color: #766d5e; border-color: #766d5e; color: #bebebe; cursor: pointer; }
.button a:hover:before, .button > label:hover:before { right: 5px; border-color: #bebebe; }
@media screen and (min-width: 415px) { .button a, .button > label { max-width: 200px; height: 36px; margin-left: auto; margin-right: auto; } }
@media screen and (max-width: 414px) { .button a, .button > label { height: 50px; } }
@media screen and (min-width: 415px) { .button.large a { max-width: 300px; } }
.button.gold a, .button.gold > label { background-color: #766d5e; border: 0; color: #bebebe; }
.button.gold a:before, .button.gold > label:before { border-color: #bebebe; }
.button.gold a:hover, .button.gold > label:hover { background-color: #bebebe; color: #000; }
.button.gold a:hover:before, .button.gold > label:hover:before { border-color: #766d5e; }
.button.blank a:before { width: 14px; height: 13px; margin-top: -7px; background-image: url("../images/common/ico_blank_g.png"); border: 0; transform: rotate(0deg); }
.button.blank a:hover:before { background-image: url("../images/common/ico_blank_w.png"); right: 10px; }
.button.modal > label:before { width: 14px; height: 14px; margin-top: -7px; background-image: url("../images/common/ico_modal_g.png"); border: 0; transform: rotate(0deg); }
.button.modal > label:hover:before { background-image: url("../images/common/ico_modal_w.png"); right: 10px; }

@keyframes button-line { 0% { width: 0px; }
  100% { width: 20px; } }
.button_outer .button_inner p { border: 1px solid #bebebe; position: relative; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; justify-content: center; align-items: center; transition: all 0.5s; }
.button_outer .button_inner p:before { content: ''; display: block; width: 6px; height: 6px; border-top: 1px solid #766d5e; border-right: 1px solid #766d5e; transform: rotate(45deg); position: absolute; right: 10px; top: 50%; z-index: 2; margin-top: -3px; transition: all 0.5s; }
@media screen and (min-width: 415px) { .button_outer .button_inner p { width: 100%; max-width: 200px; height: 36px; margin-left: auto; margin-right: auto; } }
.button_outer:hover a img { opacity: 1; }
.button_outer:hover .button_inner p { background-color: #000; border-color: #000; color: #FFF; }
.button_outer:hover .button_inner p:before { right: 5px; border-color: #bebebe; }

/*======================= ページ内リンク
=========================*/
@media screen and (min-width: 769px) { .p_link { display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; justify-content: center; margin-top: 100px; } }
@media screen and (max-width: 768px) { .p_link { margin-top: 40px; } }
.p_link li { height: 55px; }
@media screen and (min-width: 769px) { .p_link li { border-left: 1px solid #bebebe; border-right: 1px solid #bebebe; margin-right: -1px; flex-basis: 400px; max-width: 400px; flex-shrink: 1; flex-grow: 1; } }
@media screen and (max-width: 768px) { .p_link li { border-bottom: 1px solid #bebebe; }
  .p_link li:last-of-type { border-bottom: 0; } }
.p_link li a { display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; justify-content: center; align-items: center; flex-direction: column; height: 100%; width: 100%; padding-left: 10px; padding-right: 10px; position: relative; transition: all 0.5s; }
.p_link li a:after { content: ''; display: block; width: 10px; height: 10px; border-right: 1px solid #766d5e; border-bottom: 1px solid #766d5e; transform: rotate(45deg); transition: all 0.5s; }
.p_link li a:hover { background-color: #eeeeee; }

.type { display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; flex-wrap: wrap; justify-content: center; }
.type .button_outer { margin-left: 1px; margin-bottom: 1px; }
.type .button_outer a { position: relative; display: block; overflow: hidden; }
.type .button_outer a img { position: relative; z-index: 0; transition: all 0.5s; transform: scale(1); display: block; }
.type .button_outer a .text { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; flex-direction: column; justify-content: center; align-items: center; z-index: 1; color: #FFF; background-color: rgba(0, 0, 0, 0.25); transition: all 0.5s; text-shadow: 0 0 15px #000; }
.type .button_outer a .text .title { font-size: 22px; margin-bottom: 40px; text-align: center; width: 100%; }
.type .button_outer a .text .button_inner { width: 80%; }
.type .button_outer a:hover img { transform: scale(1.1); }
.type .button_outer a:hover .text { background-color: rgba(0, 0, 0, 0); }
.type .button_outer a:hover .button_inner p { background-color: #FFF; border-color: #FFF; color: #000; text-shadow: 0 0 0 transparent; }
@media screen and (min-width: 415px) { .type.type02 .button_outer { flex-basis: calc(50% - 0.5px); max-width: calc(50% - 0.5px); }
  .type.type02 .button_outer:nth-child(2n+1) { margin-left: 0; }
  .type.type02 .button_outer:nth-last-of-type(-n+2) { margin-bottom: 0; } }
@media screen and (min-width: 415px) { .type.type03 .button_outer { flex-basis: calc(33.333333% - 0.7px); max-width: calc(33.333333% - 0.7px); }
  .type.type03 .button_outer:nth-child(3n+1) { margin-left: 0; }
  .type.type03 .button_outer:nth-last-of-type(-n+3) { margin-bottom: 0; } }

/*======================= リスト
=========================*/
dl.table { font-size: 15px; line-height: 1.6; border: 1px solid #eeeeee; }
@media screen and (min-width: 769px) { dl.table { display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; flex-wrap: wrap; } }
dl.table > dt, dl.table > dd { padding: 20px; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; justify-content: center; flex-direction: column; }
dl.table > dt > a[href], dl.table > dd > a[href] { color: #766d5e; text-decoration: underline; }
dl.table > dt > a[href]:hover, dl.table > dd > a[href]:hover { text-decoration: none; }
dl.table > dt { text-align: center; background-color: #eeeeee; border-bottom: 1px solid #FFF; align-items: center; }
@media screen and (min-width: 769px) { dl.table > dt { flex-basis: 200px; max-width: 200px; } }
@media screen and (max-width: 768px) { dl.table > dt { width: 100%; } }
dl.table > dt:last-of-type { border-bottom: none; }
dl.table > dd { border-bottom: 1px solid #eeeeee; }
@media screen and (min-width: 769px) { dl.table > dd { flex-basis: calc(100% - 200px); max-width: calc(100% - 200px); } }
@media screen and (max-width: 768px) { dl.table > dd { width: 100%; } }
dl.table > dd:last-of-type { border-bottom: none; }

dl.detail { display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; flex-wrap: wrap; font-size: 15px; line-height: 1.6; }
dl.detail > dt, dl.detail > dd { margin-bottom: 10px; }
dl.detail > dt { flex-basis: 100px; max-width: 100px; position: relative; padding-right: 1em; }
dl.detail > dt:after { content: '：'; display: block; position: absolute; right: 0; top: 0; }
dl.detail > dt.wide { margin-bottom: 0; }
dl.detail > dd { flex-basis: calc(100% - 100px); max-width: calc(100% - 100px); }
dl.detail > dd.wide { flex-basis: 100%; max-width: 100%; }

/*======================= boxes
=========================*/
.boxes.box2, .boxes.box3, .boxes.box4 { display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; flex-wrap: wrap; margin-bottom: 50px; }
@media screen and (max-width: 768px) { .boxes.box2, .boxes.box3, .boxes.box4 { margin-bottom: 30px; } }
.boxes.box2:last-child, .boxes.box3:last-child, .boxes.box4:last-child { margin-bottom: 0; }
@media screen and (min-width: 769px) { .boxes.box2 > div, .boxes.box3 > div, .boxes.box4 > div { flex-grow: 0; flex-shrink: 0; margin-left: 50px; margin-top: 50px; } }
@media screen and (max-width: 768px) { .boxes.box2 > div, .boxes.box3 > div, .boxes.box4 > div { margin-top: 30px; }
  .boxes.box2 > div:first-child, .boxes.box3 > div:first-child, .boxes.box4 > div:first-child { margin-top: 0; } }
.boxes.box2 > div figure, .boxes.box3 > div figure, .boxes.box4 > div figure { text-align: center; }
.boxes.box2 > div figure img, .boxes.box3 > div figure img, .boxes.box4 > div figure img { width: 100%; }
.boxes.box2 > div figure video, .boxes.box3 > div figure video, .boxes.box4 > div figure video { width: 100%; }
.boxes.box2 > div h4, .boxes.box3 > div h4, .boxes.box4 > div h4 { font-size: 18px; margin-bottom: 20px; }
@media screen and (min-width: 769px) { .boxes.box2 > div { flex-basis: calc(50% - 25px); max-width: calc(50% - 25px); }
  .boxes.box2 > div:nth-child(2n+1) { margin-left: 0; }
  .boxes.box2 > div:nth-child(-n+2) { margin-top: 0; } }
.boxes.box2 > div figure { margin-bottom: 20px; }
@media screen and (max-width: 768px) { .boxes.box2 > div figure { margin-bottom: 10px; } }
.boxes.box3 > div { /*@media screen and (max-width: 768px) {
	padding-left: 20px;
	padding-right: 20px;
}*/ }
@media screen and (min-width: 769px) { .boxes.box3 > div { flex-basis: calc(33.333333% - 34px); max-width: calc(33.333333% - 34px); margin-left: 51px; }
  .boxes.box3 > div:nth-child(3n+1) { margin-left: 0; }
  .boxes.box3 > div:nth-child(-n+3) { margin-top: 0; } }
.boxes.box3 > div figure { margin-bottom: 10px; }
@media screen and (max-width: 768px) { .boxes.box3 > div figure { margin-bottom: 10px; } }
@media screen and (min-width: 769px) { .boxes.box4 > div { flex-basis: calc((100% - 150px) / 4); max-width: calc((100% - 150px) / 4); margin-left: 50px; }
  .boxes.box4 > div:nth-child(4n+1) { margin-left: 0; }
  .boxes.box4 > div:nth-child(-n+4) { margin-top: 0; } }
@media screen and (min-width: 414px) and (max-width: 768px) { .boxes.box4 > div { flex-basis: calc((100% - 50px) / 2); max-width: calc((100% - 50px) / 2); margin-left: 50px; }
  .boxes.box4 > div:nth-child(2n+1) { margin-left: 0; }
  .boxes.box4 > div:nth-child(-n+2) { margin-top: 0; } }
.boxes.box4 > div figure { margin-bottom: 10px; }
@media screen and (max-width: 768px) { .boxes.box4 > div figure { margin-bottom: 10px; } }
.boxes.icon_list > div { border: 1px solid #eeeeee; padding: 20px; }
@media screen and (max-width: 768px) and (min-width: 415px) { .boxes.icon_list > div { flex-basis: calc(33.333333% - 6.666666px); max-width: calc(33.333333% - 6.666666px); margin-left: 10px; margin-top: 10px; }
  .boxes.icon_list > div:nth-child(3n+1) { margin-left: 0; }
  .boxes.icon_list > div:nth-child(-n+3) { margin-top: 0; } }
@media screen and (max-width: 414px) { .boxes.icon_list > div { flex-basis: calc(50% - 5px); max-width: calc(50% - 5px); margin-left: 10px; margin-top: 10px; }
  .boxes.icon_list > div:nth-child(2n+1) { margin-left: 0; }
  .boxes.icon_list > div:nth-child(-n+2) { margin-top: 0; } }
.boxes.icon_list > div figure { margin-bottom: 0; }
.boxes.icon_list > div figure img { width: auto; }

/* IE11 */
@media screen and (min-width: 769px) { _:-ms-lang(x)::-ms-backdrop, .boxes.box4 > div { flex-basis: calc((100% - 150px) / 4 - 1px); max-width: calc((100% - 150px) / 4 - 1px); } }
@media screen and (min-width: 414px) and (max-width: 768px) { _:-ms-lang(x)::-ms-backdrop, .boxes.box4 > div { flex-basis: calc((100% - 50px) / 2 - 1px); max-width: calc((100% - 50px) / 2 - 1px); } }
/* Edge(EdgeHTML) */
@media screen and (min-width: 769px) { _:-ms-lang(x)::backdrop, .boxes.box4 > div { flex-basis: calc((100% - 150px) / 4 - 1px); max-width: calc((100% - 150px) / 4 - 1px); } }
@media screen and (min-width: 414px) and (max-width: 768px) { _:-ms-lang(x)::backdrop, .boxes.box4 > div { flex-basis: calc((100% - 50px) / 2 - 1px); max-width: calc((100% - 50px) / 2 - 1px); } }
/*======================= cont_lr
=========================*/
@media screen and (min-width: 769px) { .cont_lr { display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; margin-top: 50px; } }
@media screen and (max-width: 768px) { .cont_lr { margin-top: 30px; } }
.cont_lr:first-of-type { margin-top: 0; }
.cont_lr:after { content: ''; display: block; clear: both; }
@media screen and (min-width: 769px) { .cont_lr > .image, .cont_lr > .text { flex-basis: 50%; max-width: 50%; flex-shrink: 0; }
  .cont_lr.img_r .text { order: 1; padding-left: 10px; padding-right: 8.333333%; }
  .cont_lr.img_r .image { order: 2; }
  .cont_lr.img_l .text { order: 2; padding-right: 10px; padding-left: 8.333333%; }
  .cont_lr.img_l .image { order: 1; } }
.cont_lr .text { padding-top: 50px; padding-bottom: 50px; }
@media screen and (max-width: 1024px) { .cont_lr .text { padding-top: 20px; padding-bottom: 20px; } }
@media screen and (min-width: 769px) { .cont_lr .text .button a, .cont_lr .text .button > label { margin-left: 0; } }
.cont_lr .text .detail { margin-top: 30px; }
@media screen and (max-width: 768px) { .cont_lr .text .detail { margin-top: 20px; } }
.cont_lr .image img { width: 100%; display: block; }
.cont_lr h4 { font-size: 22px; line-height: 1.6; margin-bottom: 30px; }
@media screen and (max-width: 1024px) { .cont_lr h4 { margin-bottom: 20px; font-size: 18px; } }

/*======================= text_cont
=========================*/
.text_cont h4 { font-size: 22px; line-height: 1.6; margin-bottom: 30px; }
@media screen and (max-width: 1024px) { .text_cont h4 { margin-bottom: 20px; font-size: 18px; } }
.text_cont .text .info { margin-top: 40px; width: 440px; }

@media screen and (min-width: 769px) { .text_lr { display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; }
  .text_lr > .text { flex-basis: 52.083334%; max-width: 52.083334%; flex-shrink: 0; padding-left: 10px; padding-right: 4.166666%; }
  .text_lr > .text .button a, .text_lr > .text .button > label { margin-left: 0; }
  .text_lr > .info { flex-basis: 47.916666%; max-width: 47.916666%; flex-shrink: 0; }
  .text_lr > .info.bg_colored { padding: 30px 20px; } }
@media screen and (max-width: 768px) { .text_lr > .info { margin-top: 20px; }
  .text_lr > .info.bg_colored { padding: 20px 20px; }
  .text_lr .text { padding-left: 10px; padding-right: 10px; } }

.text_wide .text { padding-left: 10px; padding-right: 10px; }

/*======================= bg_accent
=========================*/
.bg_colored { padding-top: 50px; padding-bottom: 50px; background-color: #eeeeee; }
@media screen and (max-width: 768px) { .bg_colored { padding-top: 30px; padding-bottom: 30px; } }

.bg_accent { padding-top: 50px; padding-bottom: 50px; background: url("../images/common/bg_pattern2.jpg") repeat; }
@media screen and (max-width: 768px) { .bg_accent { padding-top: 30px; padding-bottom: 30px; } }

.bg_accent_over { padding-top: 50px; position: relative; }
@media screen and (max-width: 768px) { .bg_accent_over { padding-top: 30px; } }
.bg_accent_over:before { content: ''; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 80%; background: url("../images/common/bg_pattern2.jpg") repeat; z-index: -1; }
@media screen and (max-width: 768px) { .bg_accent_over:before { height: 100%; padding-bottom: 30px; } }

/*=======================
	modal
=========================*/
.modal_button { display: none; }

.modal_wrapper { position: fixed; z-index: 100000; top: 0; left: 0; width: 100%; height: 100vh; display: none; }
.modal_wrapper .modal_inner { width: auto; max-width: 80%; background: #fff; border-radius: 3px; box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.2); padding: 20px; text-align: center; position: relative; animation: fadein .3s 1, zoomin .3s 1; }
.modal_wrapper .modal_inner .modal_close { position: absolute; top: -20px; right: -20px; display: flex; align-items: center; justify-content: center; line-height: 1; background: #000; border-radius: 50%; width: 40px; height: 40px; cursor: pointer; transition: all .2s ease; }
.modal_wrapper .modal_inner .modal_close span { width: 30px; height: 30px; display: block; position: relative; }
.modal_wrapper .modal_inner .modal_close span:after { content: ''; display: block; width: 20px; height: 2px; background-color: #FFF; position: absolute; top: 50%; left: 20%; transform: rotate(45deg); }
.modal_wrapper .modal_inner .modal_close span:before { content: ''; display: block; width: 20px; height: 2px; background-color: #FFF; position: absolute; top: 50%; left: 20%; transform: rotate(-45deg); }
.modal_wrapper .modal_inner figure img { display: block; max-height: calc(90vh - 50px - 1.8em); }
.modal_wrapper .modal_inner figure figcaption { margin-top: 10px; font-weight: bold; }

.modal_button:checked + .modal_wrapper { display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; align-items: center; justify-content: center; background-color: rgba(0, 0, 0, 0.5); animation: fadein .3s 1; }

@keyframes fadein { 0% { opacity: 0; }
  100% { opacity: 1; } }
@keyframes zoomin { 0% { transform: scale(0.9); }
  100% { transform: scale(1); } }
/*=======================
	Inview Animation
=========================*/
.fadein { opacity: 0; transition: all 3s; }
@media screen and (max-width: 1024px) { .fadein { transition: all 3s; } }
.fadein.show { opacity: 1.0; }
.fadein.fade_left { -webkit-transform: translateX(-50px); -moz-transform: translateX(-50px); transform: translateX(-50px); }
.fadein.fade_left.show { -webkit-transform: translateX(0); -moz-transform: translateX(0); transform: translateX(0); }
.fadein.fade_right { -webkit-transform: translateX(50px); -moz-transform: translateX(50px); transform: translateX(50px); }
.fadein.fade_right.show { -webkit-transform: translateX(0); -moz-transform: translateX(0); transform: translateX(0); }
.fadein.fade_upper { -webkit-transform: translateY(-50px); -moz-transform: translateY(-50px); transform: translateY(-50px); }
.fadein.fade_upper.show { -webkit-transform: translateY(0); -moz-transform: translateY(0); transform: translateY(0); }
.fadein.fade_bottom { -webkit-transform: translateY(50px); -moz-transform: translateY(50px); transform: translateY(50px); }
.fadein.fade_bottom.show { -webkit-transform: translateY(0); -moz-transform: translateY(0); transform: translateY(0); }

/*=======================
	lead
=========================*/
#lead h3 { font-size: 30px; text-align: center; }
#lead h3 span { display: block; font-size: 20px; color: #bebebe; }
#lead .cont_lr { margin-top: 50px; }
#lead .cont_lr .image { position: relative; z-index: 1; }
#lead .cont_lr .text { position: relative; z-index: 0; /*background-size: calc(100% - 16.666666%);*/ /*background-size: contain;
background-repeat: no-repeat;
background-position: left bottom;
background-image: url("../images/common/bg_circle01.png");*/ }
#lead .cont_lr .text:before { content: ''; display: block; position: absolute; opacity: 0; transition: all 2s; transition-delay: 0.5s; z-index: -1; background: url("../images/common/bg_circle01.png") no-repeat top left/contain; width: 364px; height: 325px; bottom: -50px; left: -50px; }
@media screen and (max-width: 768px) { #lead .cont_lr .text:before { width: 250px; height: 224px; bottom: auto; top: -90px; left: -50px; } }
#lead .cont_lr .text.show:before { opacity: 1; }
@media screen and (max-width: 768px) { #lead .cont_lr .text { text-align: center; }
  #lead .cont_lr .text .info { text-align: left; } }

/*======================= スライダー
=========================*/
.slider-container { position: relative; }
.slider-container .slick-slider { margin-bottom: 0; }
.slider-container .arrows .slick-prev, .slider-container .arrows .slick-next { width: 40px; height: 70px; z-index: 6666; }
.slider-container .arrows .slick-prev { left: -55px; }
.slider-container .arrows .slick-next { right: -55px; }
.slider-container .slick-dots { bottom: 20px; }
.slider-container .slick-dots li button:before { width: 16px; height: 16px; content: ''; background-color: #FFF; border-radius: 50%; opacity: 1; }
.slider-container .slick-dots li.slick-active button:before { background-color: #766d5e; }

.pet_link { display: none; }

@media screen and (max-width: 1024px) { .pet_link { display: block; } }

/*# sourceMappingURL=common.css.map */
