@charset "UTF-8";

#lt-splash {position: relative;	width: 100%; height: 100vh;	background: #000; z-index: 9999999;	text-align:center; color:#fff;}
.lt-splash-fadeUp{animation-name: fadeUpAnime; animation-duration:0.5s; animation-fill-mode:forwards; opacity: 0;}
@keyframes fadeUpAnime{from { opacity: 0; transform: translateY(100px);} to {opacity: 1; transform: translateY(0);}}    
#lt-splash-logo {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}  
#lt-splash-logo img{width: 30%;}  
.base-c-wrap{opacity: 0; width:100%; position: relative; top: 0; overflow: hidden;}
body.appear .base-c-wrap{animation-name:PageAnimeAppear; animation-duration:1s; animation-delay: 0.8s; animation-fill-mode:forwards; opacity: 0;}
@keyframes PageAnimeAppear{0% { opacity: 0;} 100% { opacity: 1;}}  

.lt-splashbg02{display: none; content: ""; position:fixed; transform: scale(100); z-index: 999; top:calc(50% - 1rem); left:calc(50% - 1rem); width: 2rem; height: 2rem; background-color: #fd827c;}
body.appear .lt-splashbg02{display: block; border-radius: 50%; animation-name:PageAnime02; animation-duration:1s; animation-fill-mode:forwards;}
@keyframes PageAnime02{0% {transform: scale(100);} 100% {transform: scale(0); display: none;}}

/* loading ※https://projects.lukehaas.me/css-loaders/ */
.loader02 {font-size: 10px; margin: 50px auto; text-indent: -9999em; width: 11em; height: 11em; border-radius: 50%; background: #ffffff; background: -moz-linear-gradient(left, #ffffff 10%, rgba(255, 255, 255, 0) 42%); background: -webkit-linear-gradient(left, #ffffff 10%, rgba(255, 255, 255, 0) 42%); background: -o-linear-gradient(left, #ffffff 10%, rgba(255, 255, 255, 0) 42%); background: -ms-linear-gradient(left, #ffffff 10%, rgba(255, 255, 255, 0) 42%); background: linear-gradient(to right, #ffffff 10%, rgba(255, 255, 255, 0) 42%); position: relative; -webkit-animation: load-a02 1.4s infinite linear; animation: load-a02 1.4s infinite linear; -webkit-transform: translateZ(0); -ms-transform: translateZ(0);  transform: translateZ(0);}
.loader02:before {width: 50%; height: 50%; background: #ffffff; border-radius: 100% 0 0 0; position: absolute; top: 0; left: 0; content: '';}
.loader02:after {background: #000; width: 75%; height: 75%; border-radius: 50%; content: ''; margin: auto;  position: absolute; top: 0; left: 0; bottom: 0; right: 0;}
@-webkit-keyframes load-a02 {0% {-webkit-transform: rotate(0deg); transform: rotate(0deg);} 100% {-webkit-transform: rotate(360deg); transform: rotate(360deg);}}
@keyframes load-a02 {0% {-webkit-transform: rotate(0deg); transform: rotate(0deg);} 100% {-webkit-transform: rotate(360deg); transform: rotate(360deg);}}

#logo-area-ico ul {list-style: none;}  
#logo-area-ico .sns-buttons {position: relative; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; overflow: hidden;}
#logo-area-ico .sns-buttons li{flex:0 0 30%; text-align:center !important;}
#logo-area-ico ul.sns-buttons{padding:0!important; margin:3px auto!important;}      
  

.ltfb-f-wrap{display: flex; justify-content: center; align-items: center; flex-direction:column ;width: 100%;}
.ltfb-f-wrap .ltfb-f01-area{position: relative; overflow: hidden; width: 100%; text-align: center;}

.ltfbc-f-wrap{display: flex; justify-content: center; align-items: flex-start; flex-direction: row; flex-wrap: wrap; width: 100%;}
.ltfbc-f-wrap .ltfb-f4c-area{width: 50%; padding: 15px 0 15px 25px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc;}     

#lt-f01-wrap .ltfbc-f-wrap a{text-decoration: none; color: #fff;}  
#lt-f01-wrap .ltfbc-f-wrap a:hover{color:#fd827c;}      
#lt-f01-wrap img{width: 80%; padding: 20px 10px 10px;}  
#lt-f01-wrap ul{list-style: none;}
#lt-f01-wrap .sns-buttons {position: relative; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; overflow: hidden;}
#lt-f01-wrap .sns-buttons li{flex:0 0 20%; text-align:center !important;}
#lt-f01-wrap ul.sns-buttons{padding:0!important; margin:10px auto!important;}  
     
.flbtn-lt9{border-radius:50%; position:relative; display:inline-block; width:40px; height:40px; font-size:25px; text-decoration:none; transition:.5s; background-color:#444; color:#fff;}
.flbtn-lt9:hover{text-decoration:none;}
.flbtn-lt9 i{position:absolute;	top:50%; left:50%; -ms-transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); transform:translate(-50%,-50%);}
.flbtn-lt9.fl_tw2:hover{background:linear-gradient(135deg, #13f1fc 0%,#0470dc 100%);}
.flbtn-lt9.insta_btn2:hover{background:-webkit-linear-gradient(135deg, #427eff 0%, #f13f79 70%) no-repeat; background:linear-gradient(135deg, #427eff 0%, #f13f79 70%) no-repeat;}
.flbtn-lt9.fl_fb2:hover{background:-webkit-linear-gradient(top, #5c80c6 0%, #34528c 74%); background:linear-gradient(to bottom, #5c80c6 0%, #34528c 74%);}
.flbtn-lt9.fl_yu2:hover{background:linear-gradient(135deg, #f5515f 0%,#c9293c 100%);}
.flbtn-lt9.fl_li2:hover{background: linear-gradient(135deg, #3a9278 0%,#00c300 100%);}  

#copyright{margin: 0 auto; padding: 10px; background: #bcc2c8; color: #040000; font-size: 0.8rem; line-height: 1rem; text-align: center;}
#copyright a{text-decoration: none; color: #040000;}
#copyright a:hover{text-decoration: none; color: #040000;}  
  
#page-top a{display: flex;	justify-content:center;	align-items:center;	background:#262a2b;	border-radius: 5px;	width: 50px; height: 50px; color: #fff; text-align: center; text-transform: uppercase; text-decoration: none; font-size:1.6rem; transition:all 0.3s;}
#page-top a:hover{background: #777;}
#page-top {position: fixed; right: 10px; z-index: 2; opacity: 0; transform: translateY(100px);}
#page-top.UpMove{ animation: UpAnime 0.5s forwards;}
@keyframes UpAnime{from {opacity: 0; transform: translateY(100px);} to {opacity: 1; transform: translateY(0);}}
#page-top.DownMove{animation: DownAnime 0.5s forwards;} 
@keyframes DownAnime{from {opacity: 1; transform: translateY(0);} to {opacity: 1; transform: translateY(100px);}}

#lt-btmbar01 {display: block; position: fixed; bottom: -90px; width: 100%; height: 140px; background: #262a2b; z-index: 9999; transition: all 0.5s cubic-bezier(0.90, 0.10, 0.10, 0.95);}
#lt-btmbar01 a {cursor:pointer; display: inline-block; width: 20%; text-align: center; color: #888; transition: all .3s ease;}
#lt-btmbar01 a.active, #lt-btmbar01 a:hover {color: #fd827c;} 
#lt-btmbar01 i {padding: 10px 0 3px; margin: 0; font-size: 18px;}
#lt-btmbar01 p {padding: 0 0 2px; margin: 0; font-size: 10px;}
#lt-btmbar01 img {padding: 10px 0 3px; margin: 0; vertical-align: bottom; width:18px;}  
#lt-btmbar01 .morebtn{position:fixed;bottom:0;}  
 
#slide-wrapper{ position:relative; }
#slide-wrapper .slider {position:relative; z-index: 1; height: 60vh;}
#slide-wrapper .slider-item01 { background:url(../../images/temp-t01.jpg); }
#slide-wrapper .slider-item02 { background:url(../../images/temp-t02.jpg); }
#slide-wrapper .slider-item03 { background:url(../../images/temp-t03.jpg); }
#slide-wrapper .slider-item {width: 100%; height:60vh; background-repeat: no-repeat; background-position: center; background-size: cover;}
#slide-wrapper .slick-track { height: 60vh;}
#slide-wrapper  h1{position: absolute; top: 80%; left: 35%; transform: translate(-50%, -50%); z-index: 10; color: #fd827c; font-size: 2.2rem;}
  
  
.aboutus-heading{ width: 100%; background-color: #262a2b;}  
#why_senses {
    position: relative;
}
#why_senses .why_senses-bg {
    position: relative;
    background: url(../../images/temp-t04.jpg) no-repeat center;
    background-size: cover;
    background-attachment: inherit;
    width: 100%;
    height: 50vh;
}
.cont-up-block {
    text-align: center;
    font-size: 1.1rem;
    line-height: 1.6rem;
    font-weight: normal;
}
.count-size {
    font-size: 4rem;
    color: #00b7b8;
    line-height: 4.1rem;
}
.why_senses-ad-area {
    list-style: none;
    width: 96%;
    max-width: 900px;
    margin: 0 auto;
}
.why_senses-ad-area li {
    margin: 10px 0;
}
.why_senses-ad-area section {
    border: 1px solid #ccc;
}
.why_senses-ad-title {
    position: relative;
    cursor: pointer;
    font-size: 1rem;
    font-weight: normal;
    padding: 3% 3% 3% 50px;
    transition: all .5s ease;
}
.why_senses-ad-title::before,
.why_senses-ad-title::after {
    position: absolute;
    content: '';
    width: 15px;
    height: 2px;
    background-color: #333;
}
.why_senses-ad-title::before {
    top: 48%;
    left: 15px;
    transform: rotate(0deg);
}
.why_senses-ad-title::after {
    top: 48%;
    left: 15px;
    transform: rotate(90deg);
}
.why_senses-ad-title.close::before {
    transform: rotate(45deg);
}
.why_senses-ad-title.close::after {
    transform: rotate(-45deg);
}
.why_senses-ad-box {
    display: none;
    background: #f3f3f3;
    margin: 0 3% 3% 3%;
    padding: 3%;
}
  
/* table design*/   
.lt-t01{width: 100%; text-align: left; border-collapse: collapse; border-spacing: 0;} 
.lt-t01 th{padding: 10px; border-bottom: solid 4px #00b7b8; vertical-align: top; color: #00b7b8;}  
.lt-t01 td{padding: 10px; border-bottom: solid 1px #00b7b8; vertical-align: top;}   
.lt-t01 a{text-decoration: none; color: #000;}
.lt-t01 a:hover{color: #000;}  

/* flexbox column design responsive*/
.ltfbcr-wrap{width: 100%; display: flex; flex-direction: column; justify-content: center; align-items: flex-start;}
.ltfbcr-wrap .ltfb2c-area{width: 50%; padding:5px;}  
.ltfbcr-wrap .ltfb3c-area{width: 33%; padding:5px;}   
.ltfbcr-wrap .ltfb4c-area{width: 25%; padding:5px;}     
  

#access .access-area {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    background: #fff;
    box-shadow: 0 4px 4px #ccc;
    width: 90%;
    margin: 20px auto;
}
#access .access-area .access-block {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 40px 20px;
}
#access .access-area .access-block h3 {
    font-size: 1.2rem;
    margin: 0 0 20px 0;
}
#access .access-area .access-block p {
    margin: 0 0 20px 0;
}
#access .access-map {
    width: 100%;
}
#access .iframe-wrap {
    position: relative;
    padding-bottom: 51.65%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
    z-index: 2;
}
#access .iframe-wrap iframe,
#access .iframe-wrap object,
#access .iframe-wrap embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}  
  

  
  
  
  
  
  
  
  
/* mobile first (lmobile,portrait) */
/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
.ltmds-l2w{margin-left: 2px;}    
.ltfb-f-wrap{flex-direction: row;}  
.ltfb-f-wrap .ltfb-f01-area{width: 50%;}
#lt-f01-wrap img{width: 100%;}    
.ltfbcr-wrap{flex-direction: row;}  
  
  
  
  
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
.ltfbc-f-wrap .ltfb-f4c-area{width: 25%; padding: 10px 0 10px 25px; border: 0px;}     
#slide-wrapper  h1{ top: 90%; left: 50%; font-size: 2.6rem;}    
#why_senses .why_senses-bg {
    background-attachment: fixed;
}
.count-size {
    font-size: 6rem;
    line-height: 6.1rem;
}  
#access .access-area .access-block,
#access .access-map {
    width: 50%;
}
#access .access-area .access-block {
    padding: 10px;
  
  
  
  
}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
}