@charset "utf-8";
@font-face {
    font-family: 'din';
    font-style: normal;
    font-weight: 300;
    src: url('../font/dinlt.eot');
    src: local('DIN Light'), 
	     url('../font/dinlt.eot?#iefix') format('embedded-opentype'),
         url('../font/dinlt.woff') format('woff'),
         url('../font/dinlt.ttf') format('truetype')
}
@font-face {
    font-family: 'din';
    font-style: italic;
    font-weight: 300;
    src: url('../font/dinltit.eot');
    src: local('DIN Light italic'), 
	     url('../font/dinltit.eot?#iefix') format('embedded-opentype'),
         url('../font/dinltit.woff') format('woff'),
         url('../font/dinltit.ttf') format('truetype')
}
@font-face {
    font-family: 'din';
    font-style: normal;
    font-weight: 400;
    src: url('../font/dinreg.eot');
    src: local('DIN Regular'), 
	     url('../font/dinreg.eot?#iefix') format('embedded-opentype'),
         url('../font/dinreg.woff') format('woff'),
         url('../font/dinreg.ttf') format('truetype')
}
@font-face {
    font-family: 'din';
    font-style: italic;
    font-weight: 400;
    src: url('../font/dinregit.eot');
    src: local('DIN Regular'), 
	     url('../font/dinregit.eot?#iefix') format('embedded-opentype'),
         url('../font/dinregit.woff') format('woff'),
         url('../font/dinregit.ttf') format('truetype')
}
@font-face {
    font-family: 'din';
    font-style: normal;
    font-weight: 600;
    src: url('../font/dinmid.eot');
    src: local('DIN Midium'), 
	     url('../font/dinmid.eot?#iefix') format('embedded-opentype'),
         url('../font/dinmid.woff') format('woff'),
         url('../font/dinmid.ttf') format('truetype')
}
@font-face {
    font-family: 'din';
    font-style: italic;
    font-weight: 600;
    src: url('../font/dinmidit.eot');
    src: local('DIN Midium'), 
	     url('../font/dinmidit.eot?#iefix') format('embedded-opentype'),
         url('../font/dinmidit.woff') format('woff'),
         url('../font/dinmidit.ttf') format('truetype')
}
@font-face {
    font-family: 'din';
    font-style: normal;
    font-weight: 700;
    src: url('../font/dinbld.eot');
    src: local('DIN Bold'), 
	     url('../font/dinbld.eot?#iefix') format('embedded-opentype'),
         url('../font/dinbld.woff') format('woff'),
         url('../font/dinbld.ttf') format('truetype')
}
@font-face {
    font-family: 'din';
    font-style: italic;
    font-weight: 700;
    src: url('../font/dinbldit.eot');
    src: local('DiIN Bold italic'), 
	     url('../font/dinbldit.eot?#iefix') format('embedded-opentype'),
         url('../font/dinbldit.woff') format('woff'),
         url('../font/dinbldit.ttf') format('truetype')
}
@import url('https://fonts.googleapis.com/css?family=Montserrat:400,600');
html {overflow-y:scroll;font-size: 10px; height:100%;}  
body,td,th {line-height:1.8em;color: #2c2c2c;background:#F0F1F1; background-attachment: fixed; background-size: 100%; -webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;animation: fadeIn 2s ease 0s 1 normal;-webkit-animation: fadeIn 2s ease 0s 1 normal; }
body {margin:0;padding: 0;width:100%;height:100%;position:relative;font-family:din , -apple-system, BlinkMacSystemFont, 'Helvetica Neue', "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;}
h1,h2,h3,h4,h5,h6 {padding:0;margin:0;font-weight:inherit;font-size:inherit;color: inherit;}
p,ul{padding:0;margin:0; font-size: inherit;}
.cl:after { content: "";clear: both;display: block;}
.soon{ opacity: 0.2;}
.none{ display:none;}

div{ padding:0; margin:0;}
img {border:0;border-style:none; width:100%;-ms-interpolation-mode: bicubic;-webkit-interpolation-mode: bicubic; line-height:none;}
a img:hover {opacity: 0.4 ;-webkit-transition: 0.7s;-moz-transition: 0.7s;-o-transition: 0.7s;transition: 0.7s;}
li {list-style-type:none;}
a:link {text-decoration: none; color:inherit; font-size:inherit; font-weight:inherit;}
a:visited {text-decoration: none; color:inherit;}
a:hover {text-decoration: none; color: #000;}
a:active {text-decoration: none; color:inherit;}
a,a:hover {-webkit-transition: 0.7s;-moz-transition: 0.7s;-o-transition: 0.7s;transition: 0.7s;}
::selection {background: #ea545d;color: #fff;}
::-moz-selection {background: #ea545d;color: #fff;}
.pc{ display:block;}
.sp{ display:none;}
.bdb{box-sizing: border-box;}
.bld{ font-weight: 600;}
.nml{ font-weight: 400;}
.right{ text-align:right;}
.center{ text-align:center; margin:auto;}
.cover{background-position: center !important; background-size: cover !important; }
.tr{-webkit-transition: 0.7s;-moz-transition: 0.7s;-o-transition: 0.7s;transition: 0.7s;}
.shadtx {text-shadow: 0 0 20px rgba(0,0,0,.5);}
.shadimg {-webkit-filter: drop-shadow(0 0 10px rgba(0, 0, 0, .5));}
.po_re{ position: relative;}
.maru5 {  border-radius: 5px; -webkit-border-radius: 5px;-moz-border-radius: 5px;}
.maru10 {  border-radius: 10px; -webkit-border-radius: 10px;-moz-border-radius: 10px;}
.in,.in2,.in3{ padding:0 40px; margin: auto; max-width: 1400px;}
.flx{display: -webkit-flex;display: flex;-webkit-align-items: center;align-items: center; }

/*HEADER*/
.headimg{background: url(../images/bg.jpg) center/cover no-repeat; height: 100%; background-attachment: fixed;}
.logo { text-align: center; padding: 40px 0; margin:0 auto; min-height: 300px; top: 35%; position: absolute; color: #d6dad8;z-index: 9999999; width: 100%; }
.logogo { text-align: center; padding: 40px 0; margin:0 auto; min-height: 300px; top: 25%; position: absolute; color: #d6dad8;z-index: 9999999; width: 100%; }
.logo img{ clear: both;max-width: 600px; width: 80%;}
.logogo img{ clear: both;max-width: 600px; width: 80%;}
.headline{  position: relative; width: 100%; display: block; line-height: 1.7em; font-size: 2rem; font-weight: 600; padding: 60px 0 15px;}
.lead{font-size: 1.5rem; line-height: 1.7em; margin: 0 0 60px ; }
.open_date{ font-size: 3.4rem; letter-spacing: 0.1em; font-weight: 600; border-bottom: 1px solid #fff; display: table; margin: 0 auto; line-height: 1.4em; padding: 0 0 15px 0;}
#map_canvas{ height: 60vh; margin: 30px 0 0 0;}
.contents{ margin: 70px 0 ; position: relative; overflow: hidden;}
.con_logo{max-width: 330px; margin: 0 auto 20px ; padding: 0 0 4% 0; line-height: 0; width: 80%;}
.con_logo2{max-width: 330px; margin: 0 auto 50px ;}
.con_h1{ font-size: 2rem; line-height: 1.9em; max-width: 470px; margin: 0 auto 30px;}
.con_lead{ font-size: 1.5rem; line-height: 1.8em; max-width: 470px; margin: 0 auto 120px;}
.con_infobox{ text-align: center; margin: 0 auto 80px;}
.con_inf_ttl{ font-size: 1.3rem; line-height: 1.1em; font-weight: 600; padding:0 20px 20px 20px; margin: 0 auto 20px; border-bottom: 1px solid #4F5651;display: table; letter-spacing:0.5em;font-family: 'Montserrat', sans-serif; }
.con_inf_txt{ font-size: 1.9rem; line-height: 1.4em;}
.f14{ font-size: 1.4rem;}
.con_bg{ position: absolute; z-index: -1;}
.bg1{ top: 20px; right: 5%; max-width: 450px; width: 38%;}
.bg2{ top: 150px; left: 5%; max-width: 450px; width: 38%;}
.bg3{ bottom: 10%; right: 5%; max-width: 450px; width: 38%;}
.bg4{ bottom: 35%; left: 5%; max-width: 450px; width: 38%;}
.ind_insta li{width: 22%; margin: 0 4% 4% 0; float: left; }
.ind_insta li:nth-child(4n){margin: 0 0 4% 0;  }
.copy { font-size: 1rem; line-height: 1em; padding:15px 0; background:#fff; text-align: center; letter-spacing: 0.15em; }

/*index*/
.top_main{ width:100%; height:100%; z-index:1; min-height:850px; top:0; position: relative;}
.bx-wrapper , .bx-viewport{ height:100%;}
.top_slider , .top_slider li{ height:100%;}
.top_main .bx-wrapper .bx-pager {position:absolute; bottom:20px; text-align:center; width:100%; z-index:10000;}
.top_main .bx-pager-item{  width:25px; display:inline-block; height:25px;}
.top_slider_bg{ height:100%;background-size:cover; background-position:center; position:absolute; width:100%;}
.i_plants{ padding: 10px 0 0 0;}
.i_plants li{ padding: 0 20px; font-size: 1.8rem; line-height: 1.2em; margin: 0 0 15px 0; width: 33.33333%; text-align: center; float: left; box-sizing: border-box;}
.online_badge{ position: fixed; right: 20px; top: 20px; width: 100px; z-index: 100000000;transform: rotate(10deg);
	-moz-transform: rotate(10deg);
	-webkit-transform: rotate(10deg);}
/*▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲*/

@media screen and (max-width:1024px) {
.in,.in2,.in3,.ctct_in{ padding:0 30px;}
/*HEADER*/
.open_date{ font-size: 3rem; }
#map_canvas{ height: 400px;}
    
    /*index*/
.top_main{ min-height:450px;}



}/*▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲*/

@media screen and (max-width:768px) {
.pc{ display:none !important;}
.sp{ display:block !important;}
.onpc{display: none;}
.nopc{display: block;}
.pc_center{ text-align:left; margin:auto;}
.sp_center{ text-align:center; margin:auto}
.in,{ padding:0 20px; margin:0;}
.in2{ padding:0;}
.in3{ padding:0 10px;}
/*HEADER*/
.headimg{background-attachment:scroll;}
.headline{ font-size: 1.8rem; text-align: left;}
.lead{font-size: 1.4rem;  text-align: left;margin: 0 0 30px ; }
.open_date{ font-size: 2.8rem; }
#map_canvas{ height: 300px;}
}
/*▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲*/
@media screen and (max-width:600px) {
.in{ padding:0 15px; }
.in3{ padding:0 5px;}
.contents{ margin: 60px 0 40px 0 ;}
.logo { top: 40%; }
.logogo { top: 30%; }
.open_date{ font-size: 2.4rem; }
.con_lead{ font-size: 1.4rem; margin: 0 auto 70px;}
	
.bg1{ top: 50px; right: -5%; max-width: 380px; width: 45%;}
.bg2{ top: 250px; left: -5%; max-width: 380px; width: 45%;}
.bg3{ bottom: 10%; right: -5%; max-width: 380px; width: 45%;}
.bg4{ bottom: 35%; left: -5%; max-width: 380px; width: 45%;}
.ind_insta li{width: 29.333% !important; margin: 0 4% 4% 0 !important; float: left; }
.ind_insta li:nth-child(3n){margin: 0 0 4% 0 !important;  }
.i_plants li{  width:50%;}

}


