@charset "utf-8";
/* CSS Document */

/*common*/
body {font-family: "游ゴシック", YuGothic, "メイリオ", Meiryo, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", Verdana, Roboto, "Droid Sans", sans-serif;}
h1 { color: #DD4B3A; font-size: 2.5rem; font-weight: bold; text-align: center; margin-bottom: 4.5rem; }
h2 { font-size: 1.5rem; font-weight: bold; text-align: center; margin-bottom: 2rem; }
h3 { font-size: 1rem; font-weight: bold; }

.logo { width: 207px; height: 55px; background: url(img/logo.png) no-repeat; background-size: 100%; white-space: nowrap; text-indent: 100%; overflow: hidden; }
table td, table th {
	border-bottom: #FFF 1px solid;
}
@media screen and (max-width:767px){
	h1 { font-size: 1.5rem; margin-bottom: 1.5rem; }
	h2 { font-size: 1.2rem; margin-bottom: 1.2rem; }
	h3 { font-size: 1rem; margin-bottom: 1rem; }
}

.shadowbutton { box-shadow: 0 5px 3px #efefef; -ms-transition: all .2s; -webkit-transition: all .2s; transition: all .2s; }
.shadowbutton:hover { box-shadow: none;transform: -ms-translateY(5px);transform: -webkit-translateY(5px);transform: translateY(5px); }


/*TOP*/
.calendar { position: absolute; top: 80px; right: 15%;}
.right-copy { width: 100px; height: 400px; background: url(img/txt_r.png) no-repeat; position: absolute; top: 270px; right: 11%; }
.left-copy { width: 100px; height: 400px; background: url(img/txt_l.png) no-repeat; position: absolute; top: 270px; left: 10%; }

@media screen and (max-width:767px){
	#home .mainvisual { padding-top: 120px; }
	#home .right-copy { top: 200px; right: 5%; -ms-transform: scale(.6); -webkit-transform: scale(.6); transform: scale(.6); -ms-transform-origin: top right;-webkit-transform-origin: top right; transform-origin: top right; }
	#home .left-copy { top: 150px; left: 5%; -ms-transform: scale(.6); -webkit-transform: scale(.6); transform: scale(.6); -ms-transform-origin: top left;-webkit-transform-origin: top left; transform-origin: top left;}
	#home .news_area { width: 100%; margin: 0; }
	#home .news_area h3 { font-size: 1rem; }
}
.news_area .shadowbutton { 
    background: #FFF;
	width: 22.7%;
}
.news_area ul li { 
	border-radius: 10px;
    display: inline-block;
    margin-bottom: 40px;
    padding: 10px;
    margin: 0.2%;
	vertical-align: top;
}
.news_area h3 { margin-bottom: 0; }
.readmore { text-align: center; width: 250px; padding: 1em 0; position: absolute; left:0; right:0; margin: 3% auto; background:#FFF; border-radius: 10px; }
.readmore:before { vertical-align: middle; }
.text_center {
	text-align:center;
	padding: 10% 0 5%;
}


@media screen and (min-width:768px){
.inner {
    position: relative;
}
.concept .imgClm {
	right: 50px;
}
.inner .imgClm {
    position: absolute;
    z-index: -1;   
    top: 0;
}
}

@media screen and (max-width:767px){
	.imgClm img {
	width:100%;
}
}

.concept .inner .txtClm p {
    font-size: 1.1rem;
}
.inner .txtClm p {
    line-height: 2.5;
    margin: 0 0 40px;
}
.inner .txtClm {
    position: relative;
}
.inner .txtClm h2 {
    font-size: 1.5rem;
    font-weight: bold;
    line-height: 2.5;
    margin: 0 0 40px;
	text-align: left;
}
.inner .txtClm h2 span {
    border-bottom: 1px solid #000;
    padding-bottom: 5px;
}

.inner .txtClm p span {
    background: #fff;
    padding: 3px 0;
}

.event {
	background: #fff url(https://89cafe.com/wp-content/themes/89cafe/img/bg_event.png) repeat-y center -140px;
}
@media screen and (min-width:768px){
.event .animation {
	width:49%;
	display: inline-block;
    vertical-align: top;
	padding: 5%;
}
}
h5 {
	font-size: 1.2rem;
    font-weight: bold;
    line-height: 2.5;
}
	



/*ふわ*/
.fadeInDown {
 -webkit-animation-fill-mode:both;
 -ms-animation-fill-mode:both;
 animation-fill-mode:both;
 -webkit-animation-duration:1s;
 -ms-animation-duration:1s;
 animation-duration:1s;
 -webkit-animation-name: fadeInDown;
 animation-name: fadeInDown;
 visibility: visible !important;
 padding-bottom:10%;
}
@-webkit-keyframes fadeInDown {
 0% { opacity: 0; -webkit-transform: translateY(20px); }
 100% { opacity: 1; -webkit-transform: translateY(0); }
}
@keyframes fadeInDown {
 0% { opacity: 0; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); }
 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
}


/*header*/
header::before {
    background: url(https://89cafe.com/wp-content/themes/89cafe/img/bg_tree01.png) no-repeat 0 0;
    left: 0;
}
@media screen and (min-width:768px){
header::after {
    background: url(img/bg_tree02.png) no-repeat 0 0;
    right: 0;
}
header::before, header::after {
    top: 0;
}
}
@media screen and (max-width:767px){
header::after {
    display:none;
}
header::before, header::after {
    top: -50px;
}
}
header::before, header::after {
    content: "";
    height: 197px;
    width: 434px;
    position: absolute;
    z-index: -1;
}

/*footer*/
.btn {
    display: inline-block;
    box-sizing: border-box;
    line-height: 1em;
    box-sizing: border-box;
    background: #000000;
    color: #FFF;
    position: relative;
    overflow: hidden;
    text-align: center;
}
.btn.btn-s {
    height: 25px;
    border-radius: 13px;
    color: #FFFFFF;
    padding: 0 1.5em;
    font-size: 0.7rem;
    line-height: 25px;
    letter-spacing: 0.2em;
}
.btn.mapbtn {
    margin-left: 1em;
    vertical-align: middle;
}


/*ゆらゆら*/
.swing {
    margin:10px;
    -moz-animation: swing linear 5s infinite;
    -moz-transform-origin: center -30px 0;
    -webkit-animation: swing linear 5s infinite;
    -webkit-transform-origin: center -30px 0;
    -ms-animation: swing linear 5s infinite;
    -ms-transform-origin: center -30px 0;
    -o-animation: swing linear 5s infinite;
    -o-transform-origin:center -30px 0;
    animation: swing linear 5s infinite;
    transform-origin: center -30px 0;
    display: block;
    float:left;
}
 
@-moz-keyframes swing {
    0% { -moz-transform: rotate(0deg) }
    25% { -moz-transform: rotate(5deg); }
    50% { -moz-transform: rotate(0deg); }
    75% { -moz-transform: rotate(-5deg); }
    100% { -moz-transform: rotate(0deg); }
}
@-webkit-keyframes swing {
    0% { -webkit-transform: rotate(0deg); }
    25% { -webkit-transform: rotate(5deg); }
    50% { -webkit-transform: rotate(0deg); }
    75% { -webkit-transform: rotate(-5deg); }
    100% { -webkit-transform: rotate(0deg); }
}    
@-o-keyframes swing {
    0% { -o-transform: rotate(0deg); }
    25% { -o-transform: rotate(5deg); }
    50% { -o-transform: rotate(0deg); }
    75% { -o-transform: rotate(-5deg); }
    100% { -o-transform: rotate(0deg); }
}
@-ms-keyframes swing {
    0% { -ms-transform: rotate(0deg); }
    25% { -ms-transform: rotate(5deg); }
    50% { -ms-transform: rotate(0deg); }
    75% { -ms-transform: rotate(-5deg); }
    100% { -ms-transform: rotate(0deg); }
}
@keyframes swing {
    0% { transform: rotate(0deg); }
    25% { transform: rotate(5deg); }
    50% { transform: rotate(0deg); }
    75% { transform: rotate(-5deg); }
    100% { transform: rotate(0deg); }
}


/*slider*/
.wideslider {
    width: 100%;
    text-align: left;
    position: relative;
    overflow: hidden;
    margin: 0 auto;
    padding: 0 0 40px;
    height: 460px;
}

.wideslider ul,
.wideslider ul li {
    float: left;
    display: inline;
    overflow: hidden;
	border-radius: 10px;
}

.wideslider ul li img {
    width: 100%;
    display: none;
}

.wideslider_base {
    top: 0;
    position: absolute;
    left:center;
}
.wideslider_wrap {
    top: 0;
    position: absolute;
    overflow: hidden;

}
.slider_prev,
.slider_next {
    top: 0;
    position: absolute;
    z-index: 50;
    cursor: pointer;
}
.slider_prev img{
    position: absolute;
    right: -25px;
    top: 200px
}
.slider_next img{
    position: absolute;
    left: -25px;
    top: 200px
}


.slidepagination {
    bottom: 10px;
    left: 0px;
    width: 100%;
    text-align: center;
    position: absolute;
    z-index: 100;
}

.slidepagination a {
    margin: 0 3px;
    width: 10px;
    height: 10px;
    display: inline-block;
    overflow: hidden;
    background: url('https://89cafe.com/wp-content/themes/89cafe/images/slide_point.png') 0 0 no-repeat;
    border-radius: 5px;
}
.slidepagination a.active {
    background: url('https://89cafe.com/wp-content/themes/89cafe/images/slide_point_a.png') 0 0 no-repeat;
    filter:alpha(opacity=100)!important;
    -moz-opacity: 1!important;
    opacity: 1!important;
}


/*home*/
.calendar { padding: 50px 0 0; ;}

.calendar .year { font-family: inherit; font-size: 1.3rem; line-height: 100%; padding-bottom: 10px; display: block; background: url(https://89cafe.com/wp-content/themes/img/line-h.png) no-repeat bottom center; background-size: 50px auto;}
.calendar .date { font-family: inherit; font-size: 2.2rem; line-height: 100%; display: block; margin-top: 10px; }

@media screen and (max-width:767px){
	.calendar { width: 57px; height: 70px; padding: 25px 0 0; }
	.calendar .year { font-size: .8rem; padding-bottom: 5px; background-size: 15px auto;}
	.calendar .date { font-size: 1.2rem; margin-top: 3px;}
}


#home .mainvisual { position: relative; }
#home .mainvisual #treeimg { width: 100%; height: auto; min-height: 700px; text-align: center; position: relative; }
#home .mainvisual #treeimg:before { content:''; width: 100%; height: 0; padding-bottom: 75%; display: block; }
#home .mainvisual #treeimg img { width: auto; height: 100%; position: absolute; top:0; left: 0; right:0; bottom:0; margin: auto; display: inline-block; }


@-webkit-keyframes roots {
	0% { background-image: url(https://89cafe.com/wp-content/themes/89cafe/img/dot_red_s1.png), url(https://89cafe.com/wp-content/themes/89cafe/img/line-v.png); background-position: top center, center 0; }
	50% { background-image: url(https://89cafe.com/wp-content/themes/89cafe/img/dot_red_s1.png), url(https://89cafe.com/wp-content/themes/89cafe/img/line-v.png); background-position: top center, center 806px; }
	100%{ background-image: url(https://89cafe.com/wp-content/themes/89cafe/img/dot_red_s1.png), url(https://89cafe.com/wp-content/themes/89cafe/img/line-v.png); background-position: top center, center 1612px ;}
}
@keyframes roots {
	0% { background-image: url(https://89cafe.com/wp-content/themes/89cafe/img/dot_red_s1.png), url(https://89cafe.com/wp-content/themes/img/line-v.png); background-position: top center, center 0; }
	50% { background-image: url(https://89cafe.com/wp-content/themes/89cafe/img/dot_red_s1.png), url(https://89cafe.com/wp-content/themes/img/line-v.png); background-position: top center, center 806px; }
	100%{ background-image: url(https://89cafe.com/wp-content/themes/89cafe/img/dot_red_s1.png), url(https://89cafe.com/wp-content/themes/img/line-v.png); background-position: top center, center 1612px ;}
}

@media screen and (max-width:767px){
	#home .mainvisual #treeimg { min-height: 0; }
	
}

.news_area img { width: 100%; border-radius:10px;}

.news_area .txtarea { width: 100%; height: auto; padding: 40px 0; position: relative; }


/*menu*/
@media screen and (max-width: 768px) {
#menu {
	padding-top:30%;
}
}
#menu .box {
	border: 1px solid #ccc;
    border-radius: 10px;
    padding: 5%;
}
#menu dl dt {
	background:url(img/icon.png) no-repeat;
	padding: 1%;
    color: #582B25;
}
#menu dl dd {
	border-bottom: dashed 1px #ccc;
}
#menu h5 {
	margin-top:5%;
}
#menu .food {
    border-radius: 250px;
}

@media screen and (min-width: 769px) {
	#menu .menu_left {
		width:75%;
		float:left;
	}
	#menu .food {
	width: 20%;
	}
}


/*gallery*/
@media screen and (max-width: 768px) {
#gallery {
	padding-top:30%;
}
}
#gallery .date {
	font-weight:bold;
}
#gallery .box {
	border: 1px solid #ccc;
    border-radius: 10px;
    padding: 5%;
	margin-bottom:5%;
}
#gallery dl dt,
#gallery .ttl {
	background:url(img/icon.png) no-repeat;
	padding: 1%;
    color: #582B25;
}
#gallery .ttl {
font-weight: bold;
	margin-top:10%;
	clear:both;
}
#gallery dl dd {
	border-bottom: dashed 1px #ccc;
}
#gallery .news_area {
	padding-bottom:5%;
}

/*access*/
	
@media screen and (min-width: 769px) {
.bg_img01 {
    position: absolute;
    right: 5%;
    top: 30%;
}
}

@media screen and (max-width: 768px) {
#access {
	padding-top:30%;
}
	.bg_img01 {
    display:none;
}
}

/*contact*/
@media screen and (max-width: 768px) {
#contact {
	padding-top:30%;
}
}
#contact .blue {
color: #2ca9e1;
}
#contact #form_button {
text-align: center;
}
#contact #form_button input {
margin-bottom: 1em;
    font-size: 16px;
background-color: #333333;
    color: #fff;
width: 50%;
padding: 2%;
}
.inquiry #form_button input:hover {
cursor: pointer;
}
.inquiry .blue_arbitrarily {
    background: #2ca9e1;
    color: #FFF !important;
    padding: 1.5%;
    border-radius: 10%;
    font-size: 11px;
    margin-right: 5%;
}
.inquiry .red {
    background: #fc5b5b;
    color: #FFF !important;
    padding: 1.5%;
    border-radius: 10%;
    font-size: 11px;
    margin-right: 5%;
}
.inquiry .year input {
width:20%;
}
.inquiry .wpcf7-form-control-wrap {
background: #FFF !important;
}
.wpcf7-form-control-wrap input, .wpcf7-form-control-wrap textarea {
    border: none !important;
    background: #F6F6F6;
padding:2%;
}
.inquiry tr th {
font-weight:bold !important;
text-align: left;
}
.inquiry tr th,
.inquiry tr td {
border-bottom: dashed 1px #ccc;
}

@media screen and (min-width: 768px) {
.inquiry {
width:100%;
}
.inquiry td, .inquiry th {
padding:1%;
}
.inquiry tr th {
width: 40%;
}
.inquiry .blue {
    font-size: 11px;
    padding-left: 13%;
}
}
@media screen and (max-width: 767px) {
.wpcf7-textarea,
.wpcf7-text  {
    width:80%;
}
.inquiry tr th,
.inquiry tr td {
display:block;
padding:2%;
}
.inquiry .blue {
    font-size: 11px;
    padding-left: 14%;
}
}


/*english*/
#english dl {
	border: 1px solid #ccc;
    border-radius: 10px;
    padding: 5%;
}
#english dl dt {
	background:url(img/icon.png) no-repeat;
	padding: 1%;
    color: #582B25;
}
#english dl dd {
	border-bottom: dashed 1px #ccc;
}
#english h5 {
	margin-top:5%;
}


/*pagetop*/
#pagetop {
    position: fixed;
    bottom: 10px;
    right: 10px;
}
@keyframes horizontal {
    0% { transform:translateX( -3px); }
  100% { transform:translateX(  0px); }
}
@keyframes vertical {
    0% { transform:translateY(-10px); }
  100% { transform:translateY(  0px); }
}
#pagetop {
  -webkit-animation: vertical 1s ease-in-out infinite alternate;
    animation: vertical 1s ease-in-out infinite alternate;
    -webkit-animation-duration: 1.3s;
    animation-duration: 1.3s;
}

#pagetop a {
  animation: vertical 1s ease-in-out infinite alternate;
}












/*.contact_info h3 { width: 100%; height: 3.5rem; background: url(https://89cafe.com/wp-content/themes/img/footer_msg.jpg) no-repeat top center; text-indent: 100%; white-space: nowrap; overflow: hidden; background-size: auto 100%; }*/
.contact_info + p { font-size: .8rem;}
.contact_info + p:before { content: "\203B"; color: #DF4545; display: inline-block; margin-right: .5em;  }
.contact_info .telnum { display: inline-block; font-weight: bold; text-align: left;}
.contact_info .telnum dt { font-size: .8rem; display: inline-block; vertical-align: middle; margin-right: 1em; }
.contact_info .telnum dd { font-size: 2rem;  display: inline-block; vertical-align: middle; }

.contact_info .fax,
.btn_contact,
#thanks .btn_thanks { color: #FFF !important; padding: 1rem 3rem; background: #DD4B3A; display: inline-block; border-radius: 8px; }
.contact_info .fax:before,
.contact_info .btn_contact:before,
#contact .btn_thanks:before { vertical-align: middle; }
#thanks .btn_thanks { margin: 50px auto 0; }
#thanks .conts_main { text-align: center; }

#contact .contact_info .btn_contact { display: none; }
footer .contact_info .fax { display: none; }

@media screen and (max-width:767px){

	.contact_info .telnum { width: 100%; text-align:center; margin: 1em auto 0; }
	.contact_info .telnum dt { font-size: .6rem; line-height: 120%; }
	.contact_info .telnum dd { font-size: 1.4rem; line-height: 120%; }

	.contact_info .fax,
	.contact_info .btn_contact { width: 90%; margin: 1rem auto 0; }
}

#error .conts_main h2 +p { margin-bottom: 50px; text-align: center;}
#error .btn_to_home { color: #FFF; padding: 1rem 3rem; background: #DD4B3A; display: table; margin: 0 auto; border-radius: 8px; }