@charset "utf-8";
@import "css/clear.css";
@import "css/utill.css";
@import "css/hamburger.css";


/* 基本設定 ---------------------------------------------*/

* {
margin:0;
padding:0;
font-size:100%;
font-weight:normal;
list-style:none;
-webkit-text-size-adjust:100%;
-webkit-tap-highlight-color:rgba(0, 0, 0, 0);
}

body {
text-align:center;
font-size:100%;
font-family:"游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
line-height:1.7;
letter-spacing:0.1em;
color:#fff;
background:#668c46;
}

img{ border:none; vertical-align:middle; max-width:100%;}
img{ width:auto\9; height:auto\9;}

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




header{ width:100%; text-align:left; position:fixed; top:0; left:0; z-index:300; background:#ADB100; background:#668c46;}

#loopText{ padding:0.5em 0 0.3em; position:relative; left:50%; opacity:0; margin-left:-540px; display:inline-block;
animation-name: loopText;
animation-duration: 24s;
animation-timing-function: linear;
animation-iteration-count: infinite;
}

@-webkit-keyframes loopText {
0% { margin-left:-540px; opacity:0;}
2% { opacity:1;}
98% { opacity:1;}
100% { margin-left:72px;  opacity:0;}
}

@keyframes loopText {
0% { margin-left:-540px; opacity:0;}
2% { opacity:1;}
98% { opacity:1;}
100% { margin-left:72px;  opacity:0;}
}

#headerContent{ max-width:1000px; margin:0 auto; position:relative; padding:0 1rem;}
#logo img{ height:80px; padding:1rem 0;}

#gNav{ position:absolute; top:0; left:50%;
transform:translate(-50%, 0);
-webkit-transform:translate(-50%, 0);
}
#gNav li{ display:inline-block; padding:0 1rem;}
#gNav li a{ font-family: 'Great Vibes', cursive; line-height:100px; font-size:180%;
-webkit-transition: all 0.5s;
transition: all 0.5s;
opacity:1;
}
#gNav li a:hover{ opacity:0.75;} 

#sNav{ position:absolute; top:0; right:0;}
#sNav li{ display:inline-block; padding-left:2rem;}
#sNav li a{ font-family: 'Great Vibes', cursive; line-height:100px; font-size:180%;
-webkit-transition: all 0.5s;
transition: all 0.5s;
opacity:1;
}
#sNav li a:hover{ opacity:0.75;} 




#mainWrapper{ background:url(img/fronte_bg.jpg) center center no-repeat; background-size:cover; width:100%; position:fixed; top:110px; left:0; margin:0 auto; z-index: -1;}

.zoomSlide{ position:relative; max-width:1080px; margin:0 auto; height:640px; overflow:hidden;}
.zoomSlidePhoto{ width:100%; height:640px; position:absolute; top:0; left:0;}
.zoomIn{
animation: zoomFadeOut 8s;
}

#photo01{ background:#000 url(img/main_01.jpg) center 0 no-repeat; background-size:cover; -webkit-transform: scale(1.2); transform: scale(1.2);}
#photo02{ background:#000 url(img/main_02.jpg) center 0 no-repeat; background-size:cover; -webkit-transform: scale(1.2); transform: scale(1.2);}
#photo03{ background:#000 url(img/main_03.jpg) center 0 no-repeat; background-size:cover; -webkit-transform: scale(1.2); transform: scale(1.2);}
#photo04{ background:#000 url(img/main_04.jpg) center 0 no-repeat; background-size:cover; -webkit-transform: scale(1.2); transform: scale(1.2);}

#slideCover{ max-width:1080px; width:100%; height:640px; position:absolute; top:0; left:50%; transform:translate(-50%, 0); -webkit-transform:translate(-50%, 0);
background: -webkit-linear-gradient(left, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0) 90%, rgba(0, 0, 0, 1) 100%);
background: linear-gradient(to right, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0) 90%, rgba(0, 0, 0, 1) 100%);
}
#slideCover img{width:150px; height:auto; position:absolute; top:45%; left:50%; transform:translate(-50%, -50%); -webkit-transform:translate(-50%, -50%);}

@-webkit-keyframes zoomFadeOut {
0% {-webkit-transform: scale(1.2); transform: scale(1.2); opacity:1;}
70% { opacity:1;}
100% { -webkit-transform: (1); transform: scale(1); opacity:0;}
}

@keyframes zoomFadeOut {
0% {-webkit-transform: scale(1.2); transform: scale(1.2); opacity:1;}
70% { opacity:1;}
100% { -webkit-transform: (1); transform: scale(1); opacity:0;}
}




#table{ min-height:600px; background:url(img/table.png) center 0 no-repeat; background-size:cover; position:relative; top:-100px;  margin:0 auto -100px; margin-top:680px;}
#anniversary{ width:390px; height:auto;}




.defaultSection{ background:#ADB100; background:#668c46; padding:100px 0;}
.whiteBgSection{ background:#fff; padding:100px 0; color:#000;}




#message dt{ font-family: 'Pinyon Script', cursive; line-height:1.4; font-size:240%; padding-bottom:4rem;}
#message dd{ font-size:120%;}
#thanksWrapper{ height:580px; max-width:1080px; background:url(img/thanks_bg.jpg) center center no-repeat; background-size:cover; margin:4rem auto 0; position:relative;}
#thanksWrapper p{ font-family: 'Great Vibes', cursive; line-height:1.4; font-size:380%; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); -webkit-transform:translate(-50%, -50%);}




#footer{ padding:4rem 0; background:#fff; color:#000;}
#footer h2{ font-family: 'Great Vibes', cursive; line-height:1.4; font-size:240%; color:#000; margin:0 0 1rem;}
#footer p a{ color:#000;}

#btmBtnList{ margin:2rem auto;}
#btmBtnList li{ display:inline-block; margin:0 1rem; min-width:240px;}
#btmBtnList li a{ display:block; height:320px; width:100%; background:url(img/btmBtn_bg.jpg) 0 center no-repeat; background-size:auto 320px; position:relative;}
#btmBtnList li a span{ color:#fff; font-family: 'Great Vibes', cursive; line-height:1.4; font-size:320%; position:absolute; left:50%; transform:translate(-50%, -50%); -webkit-transform:translate(-50%, -50%);}
#btmBtnList li:nth-child(1) a span{ top:25%; top:20%;}
#btmBtnList li:nth-child(2) a span{ top:50%; top:20%;}
#btmBtnList li:nth-child(3) a span{ top:75%; top:20%;}
#map-canvas{ max-width:1080px; margin:2rem auto; height:580px;}




.pageTitle{ color:#000; font-family: 'Great Vibes', cursive; line-height:1.4; font-size:320%; margin:2rem auto;}
.pageTitle.colorWhite{ color:#fff;}




.container {
  margin: 0 auto;
  padding: 40px;
  max-width:1080px;
  color: #333;
  background: #ADB100;
}
.slick-slide {
  text-align: center;
  color: #000;
  background: #ADB100;
}
#galleryWrapper{ text-align:center; margin:2rem auto 0;}
#galleryWrapper ul{ margin:4rem auto;}
#galleryWrapper ul:last-child{ margin:4rem auto 0;}
#galleryWrapper ul li{ display:inline-block; margin:0 0.5rem 1rem;
transition: all 0.5s;
-webkit-transition: all 0.5s;
opacity:1;
}
#galleryWrapper ul li img{ width:auto; height:180px;}
#galleryWrapper ul li:hover{
opacity:0.9;
}

#galleryWrapper h3{ margin-bottom:-2rem; margin-top:4rem;}
#galleryWrapper h3 img{ width:auto; height:160px;}
#galleryWrapper h3 span{ display:block; margin-top:0.5rem;}


.fadeIn{ opacity:0; animation: fadeIn 0.5s; animation-delay:0.5s; animation-fill-mode:forwards;}
@-webkit-keyframes fadeIn {
0% { opacity:0;}
100% { opacity:1;}
}

@keyframes fadeIn {
0% { opacity:0;}
100% { opacity:1;}
}

.motion{
-webkit-transition: all 0.5s;
transition: all 0.5s;
-webkit-transform: translateY(-2rem);
transform:translateY(-2rem);
opacity:0;
}
.motionOn{
-webkit-transform: translateY(0);
transform:translateY(0);
opacity:1;
}

.age{ font-family: 'Great Vibes', cursive; line-height:1.4; font-size:420%;}

.historyTable{ display:table; table-layout:fixed; max-width:1080px; width:100%; margin:0 auto;}
.historyTableCellLeft{ display:table-cell; width:50%; text-align:right; padding:1rem 4rem 0 1rem; border-right:1rem solid #668c46; box-sizing:border-box; vertical-align:top; position:relative;}
.historyTableCellRight{ display:table-cell; width:50%; text-align:left; padding:1rem 0 1rem 4rem; border-left:1rem solid #668c46; box-sizing:border-box; vertical-align:top; position:relative;}
.historyTableCellLeft img,.historyTableCellRight img{ margin:2rem auto; position:relative; z-index:100;}

#imgLayout00{ margin-bottom:4rem;}
#imgLayout01{ left:3rem; position:absolute; width:100%;}
#imgLayout02{ left:-7rem;}
#imgLayout03{ width:100%; height:auto; left:-5rem; margin-right:-4rem;}
#imgLayout04{ width:100%; height:auto;}
#imgLayout05{ right:-2rem;}
#imgLayout06{ left:-7rem;}
#imgLayout07{ right:-14rem;}
#imgLayout08{ left:-6rem; top:25rem; width:70%; height:auto;}
#imgLayout09{ left:-2rem;}

#historyLately{ max-width:960px; color:#fff; background:#ADB100; background:#668c46; padding:4rem 0; margin:-2rem auto 0; font-size:120%;}

#imgLayoutAdd01{ width:50%; height:auto; left:-2rem; margin-right:-1rem;}
#imgLayoutAdd02{ width:50%; height:auto;}
#imgLayoutAdd03{ width:100%; height:auto; right:-7rem;}
#imgLayoutAdd04{ width:50%; height:auto; left:-2rem; margin-right:-1rem;}
#imgLayoutAdd05{ width:50%; height:auto;}
#imgLayoutAdd06{ width:100%; height:auto; right:-2rem;}


#storyContent h2{ font-weight:bold; font-size:140%;}
#storyContent p{ margin:2rem auto;}
#storyDetail{ display:none;}
#storyOpen img{ width:200px; height:auto; cursor:pointer; display:block; margin:2rem auto 0;}
#onOff{ display:inline-block; line-height:1; color:#fff; padding:0.5rem 2rem; background:#000; cursor:pointer;
animation-name: loopBgColor;
animation-duration: 1s;
animation-timing-function: linear;
animation-iteration-count: infinite;
animation-direction:alternate;
}

@-webkit-keyframes loopBgColor {
0% { background:#adb100;}
100% { background:#668c46;}
}

@keyframes loopBgColor {
0% { background:#adb100;}
100% { background:#668c46;}
}



.spaceTable{ display:table; table-layout:fixed; max-width:1080px; width:100%; margin:0 auto;}
.spaceTableCell--S{ display:table-cell; width:33%; box-sizing:border-box; vertical-align:top; padding:0 0.5rem 1rem;}
.spaceTableCell--L{ display:table-cell; width:67%; box-sizing:border-box; vertical-align:top; padding:0 0.5rem 1rem;}
.spaceTableCell--S img:nth-child(1){ margin-bottom:1rem;}




.linkTable{ display:table; table-layout:fixed; max-width:640px; width:100%; margin:0 auto;}
.linkTableCell{ display:table-cell; width:50%; box-sizing:border-box; vertical-align:top; padding:0 1rem 1rem; text-align:left;}
.linkTableCell ul li{ margin-bottom:1rem;}
.linkTableCell ul li:before{ content:"○ ";}
.linkTableCell ul li a{
-webkit-transition: all 0.5s;
transition: all 0.5s;
opacity:1;
}
.linkTableCell ul li a:hover{
opacity:0.75;
}


.single-item div img{ height:600px; margin:0 auto;}