@charset "utf-8";

/* reset css */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure,  footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent; box-sizing:border-box;}
body {line-height:1;}
span, p, img, strong, dl, dt, dd, ol, ul, li, article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block;}
nav ul {list-style:none;}
blockquote, q {quotes:none;}
blockquote:before, blockquote:after,q:before, q:after {content:''; content:none;}
a {margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent; box-sizing:border-box;}
ins {background-color:#ff9; color:#000; text-decoration:none;}
mark {background-color:#ff9; color:#000;  font-style:italic; font-weight:bold;}
del {text-decoration: line-through;}
abbr[title], dfn[title] {border-bottom:1px dotted; cursor:help;}
table {border-collapse:collapse; border-spacing:0;}
hr {display:block; height:1px; border:0; border-top:1px solid #cccccc; margin:1em 0; padding:0;}
input, select {vertical-align:middle; box-sizing:border-box;}
a {box-sizing:border-box;}
/* /reset css */



/* common */
body {font-size:16px; line-height:180%; color:#292929; -webkit-text-size-adjust:100%; background-color:rgba(250,250,250,1.0); font-family: 'Noto Serif JP', serif;}

.pc_only {display:block;}
.sp_only {display:none;}
.pcin_only {display:inline;}
.spin_only {display:none;}

.clearfix {width:100%; clear:both;}

.cont {display:block; width:100%; min-width:1040px; margin:0px auto; position:relative;}
.contin {display:block; width:1000px; margin:0px auto;}

#contents {padding:40px 0px 40px 0px; }
#contents h2 {padding:40px 0px 40px 0px; font-size:24px; line-height:120%; letter-spacing:1px; font-weight:normal; text-align:left; opacity:0; }

#page-top {position: fixed; bottom: 40px; right: 40px; z-index:5000;}
#page-top a {padding: 0px; display: block; background-position:center center; background-repeat:no-repeat; background-size:cover; display:block; width:40px; height:40px; opacity:0.8;}
#page-top a:hover {text-decoration: none; opacity:0.6;}
/* /common */



/* header */
header {width:100%; height:auto; position:fixed; top:0px; left:0px; z-index:5800; background-color:transparent; }
header.btnhidden {height:auto; }
.header_space {display:block; width:100%; }

#sp_navi {display:block; width:100%; max-width:1100px; margin:0px auto; position:relative; }
#header_rogosp {display:none; z-index:5900; }
#header_rogopc {display:block; z-index:5900; }
.header_rogo {width:20vw; max-width:240px; padding:0px 0px 0px 0px;  position:absolute; top:0px; left:0px; opacity:0; }
.header_rogo img {width:100%; margin:auto; position:absolute; top:0; bottom:0; left:0px; }
#sp_navi ul {display:table; margin:0px 0px 0px auto; }
#sp_navi ul li {display:table-cell; vertical-align:middle; position:relative; opacity:0; }
@-webkit-keyframes fadeInDownCustom{
	0%{opacity:0;-webkit-transform:translate3d(0,-25%,0);transform:translate3d(0,-25%,0)}
	to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}
}
@keyframes fadeInDownCustom{
	0%{opacity:0;-webkit-transform:translate3d(0,-25%,0);transform:translate3d(0,-25%,0)}
	to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}
}
.fadeInDownCustom{-webkit-animation-name:fadeInDown;animation-name:fadeInDownCustom}

#sp_navi ul li img {display:block; width:100%; height:70%; margin:auto; position:absolute; top:0; bottom:0; left:0; right:0; opacity:0; animation-duration: 1.2s; animation-timing-function: linear;}
#sp_navi ul li:hover img {animation-name: menubackFadeIn; }
@keyframes menubackFadeIn {
    0% {opacity:0;}
	25% {opacity:0;}
    100% {opacity:1;}
}
#sp_navi ul li a {display:block; padding:52px 16px 52px 16px; color:#292929; font-size:13px; line-height:120%; letter-spacing:2px; font-weight:normal; text-align:center; position:relative; text-decoration:none; animation-duration: 1.2s; animation-timing-function: linear;}
#sp_navi ul li a:hover {animation-name: menuFadeIn; }
@keyframes menuFadeIn {
    0% {opacity:1;}
	15% {opacity:0.3;}
    100% {opacity:1;}
}

.sp_btn {display:none; }

/* /header */



/* footer */
div#map {opacity:0; } 
div#map > div {padding:160px 0px 0px 0px; }
div#map iframe {width:100%; height:420px; }

footer {}
footer > div {padding:120px 0px 120px 0px; }
footer > div:after {content:""; display:block; width:100%; clear:both; }
.footer_rogo {display:block; width:200px; float:left; opacity:0; }
.footer_rogo img {width:100%; }
footer ul {display:table; float:right; width:438px; }
footer ul li {display:table-cell; vertical-align:middle; text-align:center; opacity:0; }
footer ul li a {display:block; padding:10px 12px 0px 12px; color:#292929; font-size:13px; line-height:120%; letter-spacing:1px; font-weight:normal; text-align:center; text-decoration:none; animation-duration: 1.2s; animation-timing-function: linear;}
footer ul li a:hover {animation-name: menuFadeIn; }
/* /footer */



/* top */
.header_rogo_top {width:20vw; max-width:240px; padding:0px 0px 0px 0px;  position:absolute; top:0px; left:0px; opacity:0; }
.header_rogo_top img {width:100%; margin:auto; position:absolute; top:0; bottom:0; left:0px; }

div#top_title {}
div#top_title > div {padding:210px 0px 240px 0px; }
div#top_title a#title_rogo {display:inline-block; text-decoration:none; opacity:0; animation-delay:0.3; color: #262626; text-align: center; letter-spacing: .05em;}
@-webkit-keyframes fadeInRightCustom{
	0%{opacity:0;-webkit-transform:translate3d(25%,0,0);transform:translate3d(25%,0,0)}
	to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}
}
@keyframes fadeInRightCustom{
	0%{opacity:0;-webkit-transform:translate3d(25%,0,0);transform:translate3d(25%,0,0)}
	to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}
}
.fadeInRightCustom{-webkit-animation-name:fadeInRight;animation-name:fadeInRightCustom}
div#top_title a#title_rogo span {display:block; width:100%; padding:15px 0px; color:#666; font-size:24px; line-height:120%; letter-spacing:4px; font-weight:normal; text-align:center; }
div#top_title img {width:300px; margin: 0 auto;}

div#top_title ul {
    display: grid;
    place-content: center;
    text-align: left;
}


div#top_about {position:relative; }
.top_about_back {display:block; width:1000px; height:1100px; background-position:center center; background-repeat:no-repeat; background-size:cover; position:absolute; top:0px; right:0px; z-index:0; opacity:0; }
.top_about_cap {position:relative; z-index:100;}
.top_about_cap:after {content:""; display:block; width:100%; clear:both; }
div#top_about h1 {display:table; width:35%; height:600px; float:right; }
div#top_about h1 strong {display:table-cell; vertical-align:top; padding:150px 0px 150px 0px; opacity:0; }
/*div#top_about h1 span {display: block; writing-mode: vertical-rl; font-size:45px; line-height:120%; letter-spacing:0.1em; font-weight:bold; text-align:left; }*/
.top_about_caps {display:block; width:50%; float:left; padding:450px 0px 100px 0px; }
div#top_about h2 {font-size:18px; line-height:120%; letter-spacing:1px; font-weight:normal; text-align:left; opacity:0; }
div#top_about h3 {padding:126px 0px 50px 0px; font-size:14px; line-height:180%; letter-spacing:1px; font-weight:normal; text-align:justify; text-justify:inter-ideograph; opacity:0; }
@-webkit-keyframes fadeInUpCustom{
	0%{opacity:0;-webkit-transform:translate3d(0,20%,0);transform:translate3d(0,20%,0)}
	to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}
}
@keyframes fadeInUpCustom{
	0%{opacity:0;-webkit-transform:translate3d(0,20%,0);transform:translate3d(0,20%,0)}
	to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}
}
.fadeInUpCustom{-webkit-animation-name:fadeInUp;animation-name:fadeInUpCustom}

.top_more_btn {display:inline-block; padding:3px 3px 6px 3px; color:#292929; font-size:14px; line-height:120%; letter-spacing:1px; font-weight:normal; text-decoration:none; position:relative; opacity:0; }
.top_more_btn span {display:block; width:100%; height:1px; background-color:#292929; position:absolute; bottom:0px; left:0px; animation-duration: 0.3s; animation-timing-function: linear;}
.top_more_btn:hover span {animation-name: top_more_btnHover; }
@keyframes top_more_btnHover {
    0% {
        width:10%; 
    }
    100% {
        width:100%;
    }
}

div#top_news {}
div#top_news > div {padding:100px 0; }
div#top_news h2 {font-size:18px; line-height:120%; letter-spacing:1px; font-weight:normal; text-align:left; opacity:0; }
div#top_news ul {width:100%; padding:60px 0px 60px 0px; }
div#top_news ul li {width:100%; padding:0px 0px 0px 0px; opacity:0; }
div#top_news ul li a {display:block; padding:15px 0px 15px 20px; color:#292929; text-align:left; text-decoration:none; }
div#top_news ul li a:hover {opacity:0.75; }
div#top_news ul li a span {display:inline-block; padding:0px 10px 0px 0px; font-weight:normal; }
div#top_news ul li a strong {display:inline-block; font-weight:normal; }

div#top_blog {}
div#top_blog > div {padding:100px 0; }
div#top_blog h2 {font-size:18px; line-height:120%; letter-spacing:1px; font-weight:normal; text-align:left; opacity:0; }
div#top_blog ul {width:100%; padding:60px 0px 60px 0px; }
div#top_blog ul li {width:100%; padding:0px 0px 0px 0px; opacity:0; }
div#top_blog ul li a {display:block; padding:15px 0px 15px 20px; color:#292929; text-align:left; text-decoration:none; }
div#top_blog ul li a:hover {opacity:0.75; }
div#top_blog ul li a span {display:inline-block; padding:0px 10px 0px 0px; font-weight:normal; }
div#top_blog ul li a strong {display:inline-block; font-weight:normal; }

div#top_gallery {}
div#top_gallery > div {padding:100px 0; }
div#top_gallery h2 {font-size:18px; line-height:120%; letter-spacing:1px; font-weight:normal; text-align:left; opacity:0; }
.top_gallery_img {display:table; width:874px; margin:160px 0px 80px auto; }
.top_gallery_img li {display:table-cell; vertical-align:middle; width:33.3%; padding:48% 0px 0px 0px; background-position:center center; background-repeat:no-repeat; background-size:cover; opacity:0; }

div#top_sale {opacity:0; }
div#top_sale > div {padding:100px 0px 60px 0px;}
div#top_sale a {display:block; width:100%; margin:0px auto; padding:80px 40px 80px 40px; color:#FFF; font-size:36px; line-height:120%; letter-spacing:1px; font-weight:bold; text-align:left; background-position:center center; background-repeat:no-repeat; background-size:cover; text-decoration:none; text-shadow:1px 1px 5px rgba(0,0,0,0.8); animation-duration: 0.3s; }
div#top_sale a:hover {opacity:0.75; }

div#top_outlink {opacity:0; }
div#top_outlink > div {padding:0px 0px 100px 0px;}
div#top_outlink dl {display:table; width:58%; margin:0px auto; }
div#top_outlink dl dd {display:table-cell; vertical-align:middle; width:32%; border:1px #C9C9C9 solid; background-position:center center; background-repeat:no-repeat; background-size:contain; }
div#top_outlink dl dd a {display:block; width:100%; margin:0px auto; padding:14px 14px 14px 14px; color:#FFF; font-size:24px; line-height:120%; letter-spacing:1px; font-weight:bold; text-align:center; text-decoration:none; text-shadow:1px 1px 3px rgba(0,0,0,0.7); animation-duration: 0.3s; }
div#top_outlink a:hover {opacity:0.75; }
div#top_outlink dl dd:nth-child(3) {background-size:cover; }
div#top_outlink dl dd:nth-child(1) {background-color:#ffcc67; }
div#top_outlink dl dd:nth-child(1) h3 {opacity:0; }
div#top_outlink dl dd h3 img {display:inline-block; width:100px; margin:0px auto; }
div#top_outlink dl dd h3 span {display:inline-block; color:#113366; }
div#top_outlink dl dd h3 strong {display:inline-block; font-size:14px; line-height:120%; }
div#top_outlink dl dt {display:table-cell; vertical-align:middle; width:2%; }

div#top_contact {}
div#top_contact > div {padding:100px 0;}
div#top_contact > div:after {content:""; display:block; width:100%; clear:both; }
div#top_contact h2 {font-size:18px; line-height:120%; letter-spacing:1px; font-weight:normal; text-align:left; opacity:0; }
.top_form {display:block; width:70%; margin:80px 0px 40px auto; opacity:0; }
.formtable {width:100%; }
.formtable th {vertical-align:top; width:170px; padding:14px 16px 14px 0px; font-size:14px; line-height:120%; letter-spacing:1px; font-weight:normal; text-align:left; }
.formtable th span{ background: #C1272D; font-size: 80%; font-weight: bold; color: #fff; line-height: 1.6em; padding: 0 0.5em; margin-left: 1em; display: inline-block; }
.formtable td {vertical-align:top; padding:14px 0px 14px 0px; }
.formtable td input[type="text"] {width:100%; padding:10px; font-size:16px; background-color:rgba(250,250,250,1.0); border:1px #C9C9C9 solid; box-sizing:border-box; }
.formtable td textarea {width:100%; height:90px; padding:10px; font-size:16px; background-color:rgba(250,250,250,1.0); border:1px #C9C9C9 solid; box-sizing:border-box; }
.reqred {display:block; padding:0px 10px; color:#F00; font-size:14px; line-height:120%; letter-spacing:1px; font-weight:normal; }
.messagebox {padding:20px 0px 20px 138px; text-align:left; }
.top_form input[type="button"] {display:block; width:220px; margin:20px auto 20px 138px; padding:24px 10px 24px 10px; color:rgba(250,250,250,1.0); font-size:14px; line-height:120%; letter-spacing:1px; font-weight:normal; text-align:center; background-color:#292929; cursor:pointer; }
.top_form input[type="button"]:hover {opacity:0.75; }

div#insta {opacity:0; }
div.instaw {display:block; width:1020px; height:428px; margin:0px auto; overflow:hidden; }
div.instawsp {display:none; }
/* /top */



/* gallery */
ul.gallery {display:block; width:100%; padding:40px 0px 40px 0px; }
ul.gallery:after {content:""; display:block; width:100%; clear:both; }
ul.gallery li {display:block; float:left; opacity:0; }
ul.gallery_col3 li {width:33%; }
ul.gallery_col4 li {width:25%; }
ul.gallery li a {padding:20px; color:#292929; text-decoration:none; }
ul.gallery li a p {width:90%; margin:0px auto; padding-top:66.67%; position:relative; overflow:hidden; }
ul.gallery li a p img {width:100%; position:absolute;left:50%;top:50%;-webkit-transition:-webkit-transform 4s linear;transition:-webkit-transform 4s linear;transition:transform 4s linear;transition:transform 4s linear,-webkit-transform 4s linear;-webkit-transform:translate(-50%,-50%) scale(1);transform:translate(-50%,-50%) scale(1.0)}
ul.gallery li a:hover p img {-webkit-transform:translate(-50%,-50%) scale(1.6);transform:translate(-50%,-50%) scale(1.6)}
ul.gallery li a strong {padding:10px 0px 10px 0px; font-weight:normal; text-align:center; }

.more_btn {display:inline-block; padding:3px 3px 6px 3px; color:#292929; font-size:14px; line-height:120%; letter-spacing:1px; font-weight:normal; text-decoration:none; position:relative; opacity:0; }
.more_btn span {display:block; width:100%; height:1px; background-color:#292929; position:absolute; bottom:0px; left:0px; animation-duration: 0.3s; animation-timing-function: linear;}
.more_btn:hover span {animation-name: more_btnHover; }
@keyframes more_btnHover {
    0% {
        width:10%; 
    }
    100% {
        width:100%;
    }
}
/* /gallery */



/* about */
section.about {display:block; width:100%; margin:80px auto 0px auto; background-image:url(../img/about/re_about_img1.jpg); background-position:top right; background-repeat:no-repeat; background-size:cover; opacity:0; }
section.about article {display:block; width:50%; padding:100px 0px 100px 80px; }
section.about article.about_grad {background: rgba(0,0,0,0);
background: -moz-linear-gradient(left, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0) 100%);
background: -webkit-linear-gradient(left, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0) 100%);
background: linear-gradient(to right, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0) 100%);}
section.about article h3 {padding:0px 0px 40px 0px; color:#FFF; font-weight:normal; text-align:left; opacity:0; text-shadow:1px 1px 3px rgba(0,0,0,0.75),1px 1px 5px rgba(0,0,0,0.75),1px 1px 7px rgba(0,0,0,0.75); }
section.about article h3 span {font-size:14px; line-height:160%; letter-spacing:0px; }
section.about article h3 strong {font-size:32px; line-height:120%; letter-spacing:3px; }
section.about article h4 {padding:0px 0px 20px 0px; color:#FFF; font-size:16px; line-height:200%; letter-spacing:0px; font-weight:normal; text-align:left; opacity:0; text-shadow:1px 1px 3px rgba(0,0,0,0.75),1px 1px 5px rgba(0,0,0,0.75),1px 1px 7px rgba(0,0,0,0.75); }
section.about article h4 .lb {display: block;}
section.about article p {display:none; width:100%; padding:100% 0px 0px 0px; position:relative; opacity:0; overflow:hidden; }
/* section.about article p img {width:150%; position:absolute; top:-12%; right:-5px; } */
section.about article p img {width:150%; position:absolute; top:-12%; right:-43px; }
section.about article h5 {padding:20px 0px 0px 0px; color:#FFF; font-size:16px; line-height:200%; letter-spacing:0px; font-weight:normal; text-align:left; opacity:0; text-shadow:1px 1px 3px rgba(0,0,0,0.75),1px 1px 5px rgba(0,0,0,0.75),1px 1px 7px rgba(0,0,0,0.75); }
/* /about */



/* blog */
article#blog_sales {float:left; width:33%; padding:20px 0px 20px 0px; }
article#blog_sales a:hover {opacity:0.75; }
article#blog_sales h2 {padding:10px 0px 10px 0px; font-size:16px; line-height:120%; letter-spacing:0px; font-weight:normal; text-align:center; }
article#blog_sales p {width:90%; margin:0px auto; padding:90% 0px 0px 0px; background-position:center center; background-repeat:no-repeat; background-size:cover; }
/* /blog */