@charset "UTF-8";
/*========================================================================
   Layout
========================================================================*/
.container, .content, .inner {
 clear: both;
 width: 100%;
 height: auto;
 position: relative;
}

.container:after, .content:after, .inner:after {
 content: "";
 display: block;
 clear: both;
}

.container {
 max-width: 680px;
 margin: 0px auto;
 padding: 0 3%;
 -webkit-box-sizing: border-box;
 box-sizing: border-box;
}

.container.mb {
 margin-bottom: 3.75em;
}

@media screen and (min-width: 768px) {
 .container.mb {
  margin-bottom: 5em;
 }
}

@media screen and (min-width: 992px) {
 .container {
  max-width: 1000px;
 }
}

@media screen and (min-width: 1312px) {
 .container {
  padding-left: 0;
  padding-right: 0;
 }
}

.content.margin {
 margin: 3.75em 0;
}

.content.padding {
 padding: 6rem 0;
}

@media screen and (min-width: 992px) {
 .content.margin {
  margin: 5em 0;
 }
 .content.padding {
  padding: 7rem 0;
 }
}

.inner {
 width: 96%;
 margin: 0px auto;
}

h2 {
 font-size: 3.2rem;
 position: absolute;
 top: 50%;
 left: 50%;
 -webkit-transform: translate(-50%, -50%);
 -ms-transform: translate(-50%, -50%);
 transform: translate(-50%, -50%);
}

h3 {
 font-size: 3.0rem;
 font-weight: bold;
 line-height: 1;
 max-width: 100%;
 margin-bottom: 1em;
 text-align: center;
}

h3.decoline {
 display: table;
 max-width: 394px;
 min-width: 300px;
 width: auto;
 margin-left: auto;
 margin-right: auto;
 padding: 0 12% 17px;
 -webkit-box-sizing: border-box;
 box-sizing: border-box;
 background: url(../img/ttl_deco.png) no-repeat center bottom/contain;
}

@media screen and (min-width: 992px) {
 h3.decoline {
  padding: 0 7% 17px;
 }
}

h4 {
 font-size: 2.1rem;
 font-weight: bold;
 line-height: 1;
 margin-bottom: 1em;
}

.captile {
 display: table;
 background: url(../img/cap_decotile.png) no-repeat left center;
 padding-left: 28px;
}

.decoside {
 display: table;
 margin: 0 auto 1em;
 text-align: center;
}

.decoside::before, .decoside::after {
 content: url(../img/deco_capL.png);
 display: inline-block;
 margin: 0 10px;
 vertical-align: middle;
}

.decoside::after {
 content: url(../img/deco_capR.png);
}

.bgfix {
 background-attachment: fixed;
}

/*------------------------------------------------------------
   Header
--------------------------------------------------------------*/
#header_wrap {
 padding-top: 135px;
 width: 100%;
 position: relative;
}

@media screen and (min-width: 600px) {
 #header_wrap {
  padding-top: 100px;
 }
}

#header {
 width: 100%;
 height: auto;
 background-color: #933;
 position: absolute;
 top: 0;
 left: 0;
 z-index: 50;
 -webkit-box-shadow: 2px 0 10px rgba(0, 0, 0, 0.4);
 box-shadow: 2px 0 10px rgba(0, 0, 0, 0.4);
 -webkit-transition: .4s;
 transition: .4s;
}

#header .container {
 max-width: 1000px;
 background-color: #933;
}

#header #logo .logomini {
 display: none;
}

#header #logo .setlogo_l {
 display: none;
}

#header .tel {
 width: 17px;
 height: 25px;
 float: left;
 overflow: hidden;
}

#header .tel img {
 max-width: inherit;
}

#header .header_btn {
 max-width: calc(100% - 48px);
 width: auto;
 padding-top: 3px;
 margin-bottom: 5px;
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
}

#header .header_btn > * {
 margin: 0 2.5px;
}

#header .side_btn {
 position: fixed;
 top: 60px;
 right: -40px;
 z-index: 50;
 -webkit-transition: .4s;
 transition: .4s;
}

#header .side_btn > * {
 margin-bottom: 10px;
}

.btn.language, .btn_faq {
 width: 110px;
}

/* language btn
--------------------------------------------------*/
.btn.language {
 cursor: pointer;
 position: relative;
 z-index: 50;
}

.btn.language > a::after {
 content: "∨";
 position: absolute;
 top: 50%;
 right: 0.5em;
 -webkit-transform: scale(1, 0.5) translate(0, -75%);
 -ms-transform: scale(1, 0.5) translate(0, -75%);
 transform: scale(1, 0.5) translate(0, -75%);
}

.btn.language a {
 background-color: #367;
 background-image: none;
 padding: 0.44em 1.4em 0.44em 0.7em;
}

.btn.language .btns {
 opacity: 0;
 position: absolute;
 top: 0;
 left: 0;
 -webkit-transition: .4s;
 transition: .4s;
}

.btn.language .btns .btn {
 position: absolute;
 top: 0;
 left: 0;
 -webkit-transition: .5s;
 transition: .5s;
}

.btn.language:hover {
 opacity: 0.8;
}

.btn.language:hover .btns {
 top: 100%;
 opacity: 1;
}

.btn.language:hover .btn {
 position: relative;
}

/* Header fixed
--------------------------------------------------*/
#header.fixed {
 position: fixed;
 margin-top: -85px;
 -webkit-animation: fadedown .6s both;
 animation: fadedown .6s both;
}

#header.fixed .setlogo {
 opacity: 0;
}

#header.fixed .header_btn {
 margin-top: -5px;
 margin-bottom: 10px;
}

#header.fixed .side_btn {
 -webkit-animation: fadeleft 1.4s;
 animation: fadeleft 1.4s;
 right: -15px;
 opacity: .7;
}

@-webkit-keyframes fadeleft {
 0% {
  right: -100%;
  opacity: 0;
 }
 60% {
  right: 0%;
  opacity: 1;
 }
 90% {
  right: 0%;
  opacity: 1;
 }
 100% {
  right: -15px;
  opacity: .7;
 }
}

@keyframes fadeleft {
 0% {
  right: -100%;
  opacity: 0;
 }
 60% {
  right: 0%;
  opacity: 1;
 }
 90% {
  right: 0%;
  opacity: 1;
 }
 100% {
  right: -15px;
  opacity: .7;
 }
}

#header.fixed .side_btn:hover {
 right: 0;
 opacity: 1;
}

/* keyframes -------------------------------------*/
@-webkit-keyframes fadedown {
 0% {
  top: -100%;
  opacity: 0;
 }
 100% {
  top: 0%;
  opacity: 1;
 }
}
@keyframes fadedown {
 0% {
  top: -100%;
  opacity: 0;
 }
 100% {
  top: 0%;
  opacity: 1;
 }
}

/* mediaquery
----------------------------------------------------*/
@media screen and (min-width: 480px) {
 #header .tel {
  width: 179px;
 }
}

@media screen and (min-width: 768px) {
 #header .header_btn {
  padding-top: 0;
  position: absolute;
  top: 0;
  right: 55px;
  -webkit-transition: .4s;
  transition: .4s;
 }
 #header.fixed {
  margin-top: -50px;
 }
 #header.fixed .header_btn {
  margin-top: 0;
  top: 60px;
 }
}

@media screen and (min-width: 992px) {
 #header {
  height: 110px;
  position: absolute;
 }
 #header #logo {
  width: 390px;
 }
 #header #logo .logomini {
  display: none;
 }
 #header #logo .setlogo {
  display: none;
 }
 #header #logo .setlogo_l {
  display: block;
 }
 #header .header_btn {
  right: 420px;
 }
 #header .tel {
  position: absolute;
  top: 75px;
  right: 10px;
 }
}

/* toggle Nav
--------------------------------------------------------------*/
.nav_toggle {
 display: block;
 position: fixed;
 right: 0px;
 top: 0px;
 width: 55px;
 height: 55px;
 cursor: pointer;
 z-index: 100;
}

.nav_toggle > div {
 position: absolute;
 height: 30px;
 width: 30px;
 top: 15px;
 right: 12px;
}

.nav_toggle span {
 display: block;
 position: absolute;
 width: 100%;
 border-bottom: solid 3px #fff;
 -webkit-transition: .35s ease-in-out;
 transition: .35s ease-in-out;
}

.nav_toggle span:nth-child(1) {
 top: 0px;
}

.nav_toggle span:nth-child(2) {
 top: 10px;
}

.nav_toggle span:nth-child(3) {
 top: 20px;
}

@media screen and (min-width: 992px) {
 .nav_toggle {
  display: none;
 }
}

/* open ************************/
#header.open .nav_toggle span:nth-child(1) {
 top: 10px;
 -webkit-transform: rotate(-45deg);
 -ms-transform: rotate(-45deg);
 transform: rotate(-45deg);
}

#header.open .nav_toggle span:nth-child(2), #header.open .nav_toggle span:nth-child(3) {
 top: 10px;
 -webkit-transform: rotate(45deg);
 -ms-transform: rotate(45deg);
 transform: rotate(45deg);
}

#header.open #nav {
 top: 100%;
 opacity: 1;
}

@media screen and (min-width: 992px) {
 #header.open #nav {
  top: inherit;
 }
}

#header.open .tel {
 display: block;
}

/* Grobal Nav
--------------------------------------------------------------*/
#nav {
 width: 100%;
 height: auto;
 background-color: #933;
 background-color: rgba(0, 0, 0, 0.8);
 position: absolute;
 top: -100vh;
 z-index: -1;
 opacity: 0;
 -webkit-transition: .4s;
 transition: .4s;
}

#nav img {
 display: none;
}

@media screen and (min-width: 992px) {
 #nav {
  opacity: 1;
  width: auto;
  height: auto;
  background-color: transparent;
  position: absolute;
  top: 0px;
  right: 40px;
  z-index: 0;
 }
 #nav img {
  display: block;
 }
 #nav span {
  display: none;
 }
}

#nav ul {
 padding: 1em 0;
}

#nav li {
 text-align: center;
 border-bottom: dotted #888 1px;
}

@media screen and (max-width: 896px) and (orientation: landscape) {
 #nav li {
  display: inline-block;
  min-width: 260px;
  width: 48%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
 }
}

#nav li a {
 display: inline-block;
 position: relative;
 color: #fff;
 padding-top: .5em;
 padding-bottom: .5em;
}

#nav li a::after {
 content: "";
 display: block;
 width: 0%;
 height: 2px;
 position: absolute;
 bottom: 0px;
 left: 50%;
 -webkit-transition: .3s;
 transition: .3s;
 background-color: #933;
}

#nav li a:hover {
 text-decoration: none;
}

#nav li a:hover::after {
 text-decoration: none;
 width: 100%;
 left: 0%;
}

@media screen and (min-width: 992px) {
 #nav ul {
  padding: 0;
  width: 360px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
  -ms-flex-direction: row-reverse;
  flex-direction: row-reverse;
 }
 #nav li {
  height: 185px;
  margin: 0 0 0 10px;
  padding: 0px;
  border-bottom: 0px;
 }
 #nav li a {
  padding: 0;
 }
 #nav li a::after {
  display: none;
 }
}

@media screen and (min-width: 992px) {
 .navwrap {
  max-width: 1000px;
  width: 100%;
  position: absolute;
  top: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
 }
 #header.fixed {
  margin-top: 0;
  height: 80px;
  background-color: rgba(0, 0, 0, 0.8);
 }
 #header.fixed .container {
  background-color: transparent;
 }
 #header.fixed #logo {
  max-width: 165px;
  width: 15%;
  position: absolute;
  left: 2px;
  top: 3px;
 }
 #header.fixed #logo .logomini {
  display: block;
 }
 #header.fixed #logo .setlogo_l {
  display: none;
 }
 #header.fixed .header_btn {
  width: auto;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  position: absolute;
  top: 0;
  right: 40px;
 }
 #header.fixed .tel {
  position: relative;
  top: 0px;
  left: 0;
 }
 #header.fixed .btn.language {
  position: relative;
  top: 0px;
  right: 0;
 }
 #header.fixed #nav {
  position: absolute;
  top: 52px;
  right: 40px;
 }
 #header.fixed #nav img {
  display: none;
 }
 #header.fixed #nav span {
  display: block;
 }
 #header.fixed #nav ul {
  width: auto;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
 }
 #header.fixed #nav li {
  height: 30px;
  margin: 0 12px;
 }
 #header.fixed #nav li a {
  display: block;
 }
 #header.fixed #nav li a::after {
  display: block;
  bottom: 0px;
  background-color: #bbb;
 }
}

#facilities #nav01 a:after,
#cuisine #nav02 a:after,
#onsen #nav03 a:after,
#contact #nav04 a:after,
#access #nav05 a:after,
#sightseeing #nav06 a:after {
 text-decoration: none;
 width: 100%;
 left: 0%;
}

/*------------------------------------------------------------
   Footer
--------------------------------------------------------------*/
#footer {
 background-image: url(../img/bg_gara02gr.jpg);
 font-size: 0.92em;
 line-height: 1.6;
 text-align: center;
 padding-top: 3em;
 margin-top: 30px;
 position: relative;
}

#footer::before {
 content: "";
 display: block;
 width: 100%;
 height: 30px;
 background: url(../img/deco_barB.png) repeat-x;
 position: absolute;
 top: -30px;
}

#footer .container {
 padding-bottom: 3em;
}

#footer a {
 color: #fff;
}

#footer a:hover {
 color: #fff;
 text-decoration: underline;
}

@media screen and (min-width: 992px) {
 #footer {
  text-align: left;
 }
}

#footer_logo {
 margin-bottom: 1em;
}

#footer_add {
 margin-bottom: 0.5em;
}

@media screen and (min-width: 992px) {
 #footer_add {
  float: left;
 }
}

#footer_nav {
 display: none;
}

@media screen and (min-width: 992px) {
 #footer_nav {
  display: block;
  float: right;
 }
 #footer_nav ul {
  float: left;
  margin-left: 2em;
 }
 #footer_nav li {
  margin-bottom: 0em;
 }
 #footer_nav li::before {
  content: "＞";
  display: inline-block;
  width: 1.2em;
  height: 1em;
  -webkit-transform: scale(0.5, 1);
  -ms-transform: scale(0.5, 1);
  transform: scale(0.5, 1);
 }
 #footer_nav a {
  color: #fff;
 }
 #footer_nav a:hover {
  color: #fff;
  text-decoration: underline;
 }
}

#footer_yadobnr {
 clear: both;
 margin-left: 0.8em;
}

#copyright {
 clear: both;
 width: 100%;
 height: auto;
 padding: 7px 0px;
 font-size: 1.3rem;
 text-align: center;
 color: #ddd3cd;
 background-color: #000;
}

#pagetop {
 position: fixed;
 bottom: 5px;
 right: -57px;
 clear: both;
 -webkit-transition: .4s;
 transition: .4s;
 z-index: 500;
}

#pagetop a {
 text-align: center;
 text-decoration: none;
 color: #eee;
 height: auto;
 width: auto;
 vertical-align: middle;
 display: table-cell;
 overflow: hidden;
}

#pagetop.isActive {
 right: 0;
}

/*------------------------------------------------------------
   Main Visual
--------------------------------------------------------------*/
#mainVisual {
 width: 100%;
 /*max-height: 900px;
	height: 100vh;*/
 height: auto;
 background-image: url(movie/top_movie.jpg);
 background-repeat: no-repeat;
 background-position: center center;
 background-size: cover;
 position: relative;
 overflow: hidden;
}

#mainVisual::before {
 content: "";
 display: block;
 padding-top: 43.75%;
}

#main_movie {
 width: 100%;
 height: 100%;
 position: absolute;
 left: 0px;
 top: 0px;
}

#main_movie video {
 min-width: 100%;
 min-height: 100%;
 width: 100%;
 height: auto;
 /*position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%)*/
}

video {
 min-width: 100%;
 min-height: 100%;
 width: 100%;
 height: auto;
}

/*------------------------------------------------------------
   Contents
--------------------------------------------------------------*/
#contents {
 overflow: hidden;
}

#contents:after {
 content: "";
 display: block;
 clear: both;
}

.txtArea p {
 margin-bottom: 1.5em;
}

.txtArea p:last-child {
 margin-bottom: 0;
}

.flex-box {
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
}

.flex-box.jc_between {
 -webkit-box-pack: justify;
 -ms-flex-pack: justify;
 justify-content: space-between;
}

.flex-box.jc_center {
 -webkit-box-pack: center;
 -ms-flex-pack: center;
 justify-content: center;
}

.flex-box.va_center {
 -webkit-box-align: center;
 -ms-flex-align: center;
 align-items: center;
}

.flex-box.wrap {
 -ms-flex-wrap: wrap;
 flex-wrap: wrap;
}

.btn {
 min-width: 110px;
 width: auto;
 height: auto;
 display: table;
}

.btn a {
 line-height: 1em;
 font-weight: normal;
 display: table-cell;
 text-align: center;
 vertical-align: middle;
 text-decoration: none;
 padding: 0.5em 2em 0.5em 1em;
 -webkit-box-sizing: border-box;
 box-sizing: border-box;
 border-radius: 0px;
 background-image: url(../img/bg_gara02gr.jpg);
 -webkit-transition: .1s ease-in-out;
 transition: .1s ease-in-out;
 opacity: 1;
 color: #fff;
 position: relative;
}

.btn a::after {
 content: ">";
 position: absolute;
 top: 50%;
 right: 0.7em;
 -webkit-transform: scale(0.5, 1) translate(0, -50%);
 -ms-transform: scale(0.5, 1) translate(0, -50%);
 transform: scale(0.5, 1) translate(0, -50%);
}

.btn a:hover {
 opacity: .75;
}

.matbox {
 width: auto;
 padding: 20px;
 background-image: url(../img/mat_green.png);
 margin-bottom: 20px;
}

.matbox:after {
 content: "";
 display: block;
 clear: both;
}

.decobar {
 position: relative;
}

.decobar.btm {
 padding-bottom: 10rem;
}

.decobar.btm::after {
 content: "";
 display: block;
 width: 100%;
 height: 30px;
 background: url(../img/deco_barR.png) repeat-x;
 position: absolute;
 bottom: 0;
}

.decobar.btm.bl::after {
 background: url(../img/deco_barB.png) repeat-x;
}

.decobar.top {
 margin-top: 30px;
}

.decobar.top::before {
 content: "";
 display: block;
 width: 100%;
 height: 30px;
 background: url(../img/deco_barR.png) repeat-x;
 position: absolute;
 top: -30px;
}

.decobar.top.bl::before {
 background: url(../img/deco_barB.png) repeat-x;
}

/*------------------------------------------------------------
   Other
--------------------------------------------------------------*/
/* news
-------------------------------------------------------------------*/
#index_news {
 background-image: url(../img/mat_black.jpg);
 padding: 3em 0;
}

#index_news h3 {
 font-size: 2.4rem;
 line-height: 1.3;
}

#index_news h3.underline::after {
 background-color: #ddd3cd;
}

#index_news .news_box {
 font-family: YuGothic, "游ゴシック体", "Yu Gothic Medium", "游ゴシック Medium", "メイリオ", sans-serif;
 height: 14em;
 padding: 0.6em;
 -webkit-box-sizing: border-box;
 box-sizing: border-box;
 overflow: auto;
}

#index_news .news_box li {
 line-height: 1.4;
 margin-bottom: 0.8em;
}

@media screen and (max-width: 479px) {
 #index_news .news_box li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
 }
 #index_news .news_box li > span:not(:first-child) {
  margin-left: 1.5em;
 }
}

#index_news .news_box li a {
 color: inherit;
}

#index_news .news_box .up_ymd {
 display: block;
}

#index_news .news_box .catName {
 color: #666;
}

#index_news .news_box .title {
 display: inline-block;
}

#index_news .news_box .newMark {
 display: inline;
 height: 1.2em;
 padding: 1.5px 3px;
 margin-top: 3px;
 font-size: 1.2rem;
 line-height: 1;
 font-weight: bold;
 color: #715b49;
 color: #fff;
 background-color: #d53;
 border-radius: 3px;
}

@media screen and (min-width: 768px) {
 #index_news .container {
  width: 85%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
 }
 #index_news .container h3 {
  width: 25%;
  max-width: 280px;
  margin-top: 0;
  padding-bottom: 0;
  border-bottom: 0;
 }
 #index_news .container .news_box {
  border-left: dotted 1px #999;
  width: 75%;
  height: 10em;
 }
 #index_news .container .news_box li > * {
  margin-left: 1.5em;
 }
 #index_news .container .news_box li > * span {
  display: inline-block;
 }
}

/* plansearch
-------------------------------------------------------------------*/
#plansearch {
 padding: 20px 0;
 background: #918d40;
 color: #fff;
 font-size: 1.5rem;
 text-align: center;
}

#plansearch section {
 padding: 0;
}

#plansearch h2 {
 display: none;
}

#plansearch h3 {
 text-align: center;
}

@media only screen and (max-width: 385px) {
 #plansearch .plan_form {
  padding: 20px;
 }
 #plansearch .plan_form .form_box > * {
  width: 50% !important;
 }
 #plansearch .plan_form .price {
  width: 100% !important;
 }
 #plansearch .plan_form .price select {
  width: 45%;
 }
}

.plan_form {
 width: auto !important;
 margin: 0 auto 5px !important;
}

.plan_form .form_box {
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -ms-flex-flow: wrap;
 flex-flow: wrap;
 -webkit-box-pack: center !important;
 -ms-flex-pack: center !important;
 justify-content: center !important;
}

.plan_form .form_box > * {
 width: auto !important;
 text-align: left;
 margin: 0 !important;
 padding: 0.35em 0.45em !important;
 -webkit-box-sizing: border-box;
 box-sizing: border-box;
}

.plan_form .form_box .title {
 text-align: left;
 margin: 0;
}

.plan_form .form_box .price {
 width: auto;
 font-size: 1em;
 border-bottom: none;
}

.plan_form .form_box .search_btn {
 padding-top: 1.8em !important;
}

.plan_form .form_box .search_btn .btn {
 min-width: 100px;
 background-color: rgba(0, 0, 0, 0.55);
 color: #fff;
 font-size: 0.9em;
 padding: 0.5em;
}

.plan_form .form_box .option-input::before,
.plan_form .form_box .option-input::after {
 margin: 0em !important;
 padding: 0.1em;
}

.plan_form .form_box input, .plan_form .form_box textarea, .plan_form .form_box select,
.plan_form .form_box .option-input::after {
 border: 1px solid #999;
}

.plan_form .form_box input, .plan_form .form_box textarea, .plan_form .form_box select {
 margin: 0em !important;
 padding: 0.4em;
 -webkit-box-sizing: border-box;
 box-sizing: border-box;
 height: auto;
 color: #333;
 font-size: 0.875em;
}

.plan_form .form_box .check_in > *,
.plan_form .form_box .guests > *,
.plan_form .form_box .type > *,
.plan_form .form_box .search_btn > * {
 width: 100%;
}

@media screen and (min-width: 768px) {
 .plan_form .form_box .check_in > *,
 .plan_form .form_box .guests > *,
 .plan_form .form_box .type > *,
 .plan_form .form_box .search_btn > * {
  width: auto;
 }
}

@media screen and (min-width: 992px) {
 .plan_form .form_box .check_in > *,
 .plan_form .form_box .guests > *,
 .plan_form .form_box .type > *,
 .plan_form .form_box .search_btn > * {
  width: 100px;
 }
}

/* planList
-------------------------------------------------------------------*/
#planList {
 height: auto;
 padding-top: 60px;
 -webkit-box-sizing: border-box;
 box-sizing: border-box;
 padding-bottom: 60px;
}

#planList h2 {
 display: none;
}

#planList .plan_rss {
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -ms-flex-wrap: wrap;
 flex-wrap: wrap;
 -webkit-box-pack: start;
 -ms-flex-pack: start;
 justify-content: flex-start;
 max-width: 320px;
 width: 100%;
 margin: 0 auto 50px;
 font-family: YuGothic, "游ゴシック体", "Yu Gothic Medium", "游ゴシック Medium", "メイリオ", sans-serif;
}

@media screen and (min-width: 600px) {
 #planList .plan_rss {
  max-width: 640px;
 }
}

@media screen and (min-width: 768px) {
 #planList .plan_rss {
  max-width: 1000px;
 }
}

#planList .mini {
 margin: 5px 5px 10px;
 width: calc(100% - 10px);
 line-height: 1.5;
 padding: .8em;
 -webkit-box-sizing: border-box;
 box-sizing: border-box;
 background-color: rgba(255, 255, 255, 0.9);
}

@media screen and (min-width: 600px) {
 #planList .mini {
  width: calc(100% / 2 - 10px);
 }
}

@media screen and (min-width: 768px) {
 #planList .mini {
  width: calc(100% / 3 - 10px);
 }
}

#planList .plan_img img {
 width: 100%;
 height: auto;
 border: solid 1px #999;
 -webkit-box-sizing: border-box;
 box-sizing: border-box;
}

#planList .plan_text {
 height: 8.5em;
 padding: .3em;
 overflow: hidden;
 text-align: left;
 font-size: 0.875em;
}

#planList .plan_text h4 {
 font-size: 1.15em;
 font-weight: bold;
 border-bottom: 1px dotted #c55;
 margin: .55em 0;
 padding-bottom: .35em;
}

#planList .plan_text h4 a {
 font-size: inherit;
}

#planList {
 color: #222;
}

.bnr_plan {
 max-width: 800px;
 width: 90%;
 margin: 0 auto;
 min-height: 120px;
 height: auto;
 border: solid 1px #fff;
 overflow: hidden;
}

.bnr_plan::after {
 content: "";
 display: block;
 padding-top: 25%;
}

.bnr_plan a {
 display: block;
 min-width: 450px;
 width: 100%;
 height: 100%;
 position: absolute;
 top: 50%;
 left: 50%;
 -webkit-transform: translate(-50%, -50%);
 -ms-transform: translate(-50%, -50%);
 transform: translate(-50%, -50%);
 background: url(../img/bnr_plan.jpg) no-repeat center/cover;
}

.bnr_plan a span {
 display: none;
}

/***[slick]**************************/
.slick-arrow {
 position: absolute;
 top: 50%;
 margin-top: -0.8em;
 z-index: 50;
 font-size: 1.2em;
 font-weight: bold;
 cursor: pointer;
 background-color: rgba(0, 0, 0, 0.7);
}

.slick-arrow.prev {
 padding-right: 0.5em;
 left: 0em;
}

.slick-arrow.next {
 padding-left: 0.5em;
 right: 0em;
}

.thumArea .slick-active {
 -webkit-transform: scale(0.9);
 -ms-transform: scale(0.9);
 transform: scale(0.9);
}

.thumArea .slick-current {
 -webkit-transform: scale(1);
 -ms-transform: scale(1);
 transform: scale(1);
}

.thumArea .slick-arrow.prev {
 left: -1.5em;
}

.thumArea .slick-arrow.next {
 right: -1.5em;
}

/* slick Dots
-------------------------------------------------------------------*/
.slick-dotted.slick-slider {
 margin-bottom: 0px;
}

.slick-dots {
 position: absolute;
 bottom: 8px;
 display: block;
 width: 100%;
 padding: 0;
 margin: 0;
 list-style: none;
 text-align: center;
}

.slick-dots li {
 position: relative;
 display: inline-block;
 margin: 0 5px;
 padding: 0;
 cursor: pointer;
}

.slick-dots li button {
 font-size: 0;
 line-height: 0;
 display: block;
 width: 25px;
 height: 5px;
 padding: 0px;
 cursor: pointer;
 color: transparent;
 border: 0;
 outline: none;
 background: transparent;
}

.slick-dots li button:hover,
.slick-dots li button:focus {
 outline: none;
}

.slick-dots li button:hover:before,
.slick-dots li button:focus:before {
 opacity: .95;
}

.slick-dots li button:before {
 font-size: 35px;
 line-height: 20px;
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
 content: '';
 text-align: center;
 opacity: .6;
 background-color: #bbb;
}

.slick-dots li.slick-active button:before {
 opacity: .8;
 background-color: #ccc;
}
/*# sourceMappingURL=layout.css.map */