@charset "utf-8";
  
.inner:after {
	  content: "";
	  clear: both;
	  display: block;
}
  

/*
=========================================
  Top page
=========================================
*/


#photo {
  width: 100%;
  height: 760px;
  z-index:-10;
  position:relative;
  overflow: hidden;
}
#photo img{
    top:-100px;
    left: 0;
	width: 100%;
	min-width:1920px;
	position:absolute;
}
@media screen and (max-width: 2000px) {
#photo img{
    top: 0;
}
}

#photo_sp{
	display:none;
}

a.btn{
	display:block;
	max-width:320px;
	width:100%;
	padding: 35px 0;
	text-align:center;
	background:url(../img/a_yaji.png) right no-repeat;
	font-size:1.1rem;
	letter-spacing:0.15rem;
	font-weight:500;
}
.mortar .kazari,
.gardens .kazari,
.news .kazari{
	font-family: 'Libre Caslon Text', serif;
	opacity:0.08;
	font-size: 9rem;
	position:absolute;
}
@media screen and (max-width: 1200px) {
.mortar .kazari,
.gardens .kazari,
.news .kazari{
	font-size: 7rem;
}
}
@media screen and (max-width: 900px) {
.mortar .kazari,
.gardens .kazari,
.news .kazari{
	font-size: 5rem;
}
#photo{
	display:none;
}
#photo_sp {
	display:block;
	width: 100%;
	height:560px !important;
  z-index:-10;
  position:relative;
  overflow: hidden;
}
#photo_sp img{
    top:-100px;
    right: 0;
	width: 100%;
	min-width:680px;
	position:absolute;
}
}

/*---------------------------------------
  Intro
---------------------------------------*/

.intro{
	max-width:1200px;
	width:100%;
	margin:0 auto;
	position:absolute;
	top:285px;
	left: 0;
	right: 0;
}
.intro .intro_cont{
	position:relative;
}
.intro img{
	position:absolute;
}

.intro .moji{
	top:0;
	left:20%;
}

.intro .imgs_area{
	top:345px;
	left:0px;
	position:absolute;
}

.intro video{
	width:640px;
}
.intro .img2{
	top:80px;
	left:-83px;
	z-index: -1;
}
.intro .tate{
	float:right;
	margin-top:150px;
}
.intro .tate p{
	font-size: 1.8rem;
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
	font-family :
	YuMincho,    /* Mac用 */
	'Yu Mincho', /* Windows用 */
	serif;
	font-weight:500;
	letter-spacing:0.2rem;
	line-height:1.6;
}
.intro .tate p span{
		background:#FFFFFF;
		padding:25px 15px;
}

.intro_txt{
	position:absolute;
	top: 530px;
	right:0;
	width: 515px;
	}


@media screen and (max-width: 1200px) {
.intro .moji{
	width:80%;
	left:10%;
}
.intro .tate{
	padding-right:50px;
}
.intro .imgs_area{
	top:420px;
}
.intro video,
.intro .img2{
	width:50%;
}
.intro_txt{
	width:47%;
}


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

.intro .tate{
	margin-top: 50px;
	padding-right:100px;
}

.intro .tate p{
	font-size: 1.4rem;
	line-height:2;
}

.intro .moji{
	top:-80px;
}
.intro .imgs_area{
	top: 690px;  
	left:10%;
	width:80%;
}
.intro .imgs_area video{width:100%;}
.intro .img2{
	top:50px;
	width:100%;
}
.intro_txt{
	top: 380px;
	right:0;
	padding:0 5% 0 5%;
	width: 90%;
	text-align:center;
}
.intro_txt a.btn{
	margin:0 auto;
}

}

@media screen and (max-width: 700px) {
  
.intro .imgs_area{
	top: 790px;  
}  
}


/*---------------------------------------
  Gardens
---------------------------------------*/

.gardens{
	max-width:1400px;
	width:100%;
	margin:17rem auto 0 auto;
	background:url(../img/top_bardens_bg.jpg) center top no-repeat;
	position:relative;
	text-align:center;
	min-height: 980px;
/*	margin-top: 380px;*/
	margin-top: 450px;
}
.gardens .kazari{
	top: -35px;
	left:0;
	right:0;
}
.gardens h2{
	padding-top: 100px;
}

.gardens p{
	padding:25px 0;
	max-width:550px;
	width:100%;
	margin:0 auto;
}
.gardens .btn{
	margin:0 auto;
}

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


.gardens h2{
	padding-top: 60px;
}
}
@media screen and (max-width: 900px) {

.gardens{
	background:url(../img/top_bardens_bg_sp.jpg) center bottom no-repeat;
	background-size:contain;
	position:relative;
	text-align:center;
	min-height: 535px;
	margin-top: 880px;
	padding:0 5% 600px 5%;
	width:90%;
}

.gardens p{
	padding:25px 0 0;
}

.gardens h2{
	padding-top: 30px;
}
}
@media screen and (max-width: 700px) {
.gardens{
	margin-top: 780px;
	padding:0 5% 420px 5%;
}
}
@media screen and (max-width: 500px) {
.gardens{
/*	margin-top: 700px;*/
	margin-top: 800px;  
	padding: 0 5% 230px 5%;
}
}

/*---------------------------------------
  Mortar
---------------------------------------*/
.mortar {
  width: 100%;
  min-height: 500px;
  padding-bottom:3rem;
  background-image:
    url(../img/top_carft_right.jpg), /* 最前面の背景レイヤーの背景画像 */
    url(../img/top_carft_left.jpg),
    url(../img/top_carft_bg.jpg);
  background-repeat:
    no-repeat, /* 最前面の背景レイヤーに対応 */
	no-repeat,
	repeat;
  background-position:
    right top, /* 最前面の背景レイヤーに対応 */
	left bottom,
	top;
}
.mortar .kazari{
	top: -150px;
	left:0;
}
.mortar h2{
	padding:100px 0 25px;
}

.mortar_cont{
	position:relative;
	max-width:1200px;
	width: 100%;
	text-align:center;
	margin:0 auto;
}
.mortar_cont img{
	position:absolute;
	top:150px;
	left:100px;
}

.mortar_ft{
	width:100%;
}
.mortar .btn{
	margin:0 auto;
}
@media screen and (max-width: 1200px) {
.mortar .kazari{
	top: -115px;
	left:0;
}
}
@media screen and (max-width: 900px) {
.mortar .kazari{
	top: -30px;
	line-height:0.9;
}
.mortar h2{
	padding:80px 0 25px;
}
.mortar_cont img{
	position:absolute;
	top:450px;
	left:70px;
}
.mortar {
	width: 90%;
	padding:0 5% 12rem 5%;
  background-image:
    url(../img/top_carft_right_sp.jpg), /* 最前面の背景レイヤーの背景画像 */
    url(../img/top_carft_left_sp.jpg),
    url(../img/top_carft_bg.jpg);
}

}


/*---------------------------------------
  News
---------------------------------------*/


.news{
	max-width:1200px;
	width:100%;
	margin:0 auto;
	position:relative;
	padding:6rem 0 8rem 0;
}
.news .kazari{
	top:7px;
	right:0;
}
.news h2{
	font-family: 'Libre Caslon Text', serif;
	text-align:left;
	border-bottom:1px solid #e4e4e4;
	padding-bottom:3rem;
	font-weight:500;
}
.news h2 span{
	font-size: 1rem;
}

.news dl{
	border-bottom:1px solid #e4e4e4;
	padding-left:2rem;
	overflow:hidden;
}
.news dt{
	font-family: 'Libre Caslon Text', serif;
	letter-spacing:0.1rem;
	padding:1.5rem 0 1.5rem 30px;
	float:left;
	width:150px;
	background:url(../img/line_green.gif) no-repeat left;
}
.news dd{
	padding:1.5rem 2rem 1.5rem 0;
	margin-left:180px;
font-family:"Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
}
.news dd a{
	font-family: 'Libre Caslon Text', serif;
	float:right;
	display:block;
	max-width:110px;
	width:100%;
	padding: 0 30px;
	background:url(../img/a_yaji.png) right no-repeat;
	font-size:0.7rem;
	letter-spacing:0.15rem;
	font-weight:500;
}
@media screen and (max-width: 1200px) {
.news .kazari{
	right:20px;
}
.news{
	width:94%;
	margin:0 auto;
	position:relative;
	padding:6rem 3% 8rem 3%;
}
.news dl{
	padding-left:0;
}
.news dt{
	float:none;
	width:100%;
}
.news dd{
	padding:0 1rem 1.5rem 0;
	margin-left:0;
}
.news dd a{
	padding: 20px 30px;
}
}
@media screen and (max-width: 1200px) {
.news .kazari{
	top:30px;
}
.news h2{
	padding-bottom:1rem;
}
.news{
	padding:6rem 5% 6rem 5%;
	width:90%;
}
.news dd{
	padding:0 0 1.5rem 0;
}
}


/*--------topロゴをフェード-----------*/

.start {
	background: #FFF;
	position: fixed;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 9000;
}
.start p {
	position: fixed;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	display: none;
	z-index: 9999;
	width: 280px;
}