@import url('https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300;0,400;1,300&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Acme&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@300&display=swap');
/* text #007a96*/
.font_bold {font-weight: normal}
#fakeloader .fl {
   animation-name: fadein;
    animation-duration: 1.7s;
    animation-timing-function: ease-out;
    animation-fill-mode: forwards;
}
@keyframes fadein {
	0% {opacity:0;}
	80%{opacity: 0.9}
	100% {opacity:0.3;}
}
#top_cms .cms_title .cms_title_inner {
    overflow: hidden;
        padding-bottom: 0;
}
.cms_1-a .date {
    background: #fff;
    border-radius: 24px;
    display: inline-block;
    padding: 1px 10px;
    margin-top: 9px;
    font-size: 12px;
}
#top_cms {overflow: hidden}
#footer_info .inner .border {
    border: 1px solid #b3d690;
}
.nav_box {
    background-color: #daf4fa;
    padding: 34px 20px;
}
.index_header .nav_box {
       padding: 30px 100px 6% 3%;
}
/* ------------------------------------FADEIN---------------------------------------------- */

.catch {
    opacity: 0;
     transform: translateX(30px);
     transition: .4s;
     transition-property: opacity,transform
}
.fadeCon {
opacity: 0;
     transform: translateY(60px);
     transition: 1.2s;
     transition-property: opacity,transform
    
}
h1.logo{
     opacity: 0;
     transform: translateY(-30px);
     transition: .4s;
     transition-property: opacity,transform
}
h1.logo.trans, .catch.trans, .fadeCon.trans{
     opacity: 1;
     transform: none
}
#global-nav ul{
     opacity: 0;
     transform: translateX(-30px);
     transition: .4s;
     transition-property: opacity,transform
}
#global-nav ul.trans{
     opacity: 1;
     transform: none
}
#video {
    overflow: hidden;
    position: relative;
    display: inline-block;
}	
#video:before {
    background: #669ca1;
    content: '';
    display: block;
    height: 100%;
    position: absolute;
    transform: translateX(-100%);
    transition: all .9s 0s ease;
    width: 100%;
    z-index: 1;
}
#video.active:before {
    transform: translateX(101%);
}
/* ------------------------------------FADEIN END---------------------------------------------- */







#header {position: relative;}
.page1 #header:before {
position: absolute;
    content: "";
    display: block;
    width: calc(100% - 306px - 11%);
    height: 100%;
    background-color: #daf4fa;
    top: -100px;
    right: -1px;
}
.page1 h1.logo {
    left: 70px;
    top: 15px;
    width: 155px;
}
h1.logo {
    /*position: absolute;*/
    left: 23px;
    top: 15px;
    width: 180px;
}
h1.logo img {width: 100%!important}
.page1 .index_header .nav_box {
    padding: 30px 100px 5% 3%;
}
.page1 .nav_box {
        background-color: #daf4fa;
        background-color: transparent;
    border-top: 20px solid #fff;
}

.contact_box {
    right: 2%;
    top: 0px;
    margin-top: 15px;
}
.page1 #global-nav {
    min-width: 256px;    margin-top: 302px;
}
#global-nav ul li a .after, .fat-nav.active li a .after {
 bottom: -4px;
    height: 15px;
    transform: scale(0, 1);
    transition: transform .3s;
    z-index: -1;
    background-color: #b3d690;
}
#global-nav ul li a, .fat-nav.active li a {
    z-index:0;
}
.cms_6-b .cate_box:first-of-type {
    border-top: 1px solid #ffffff;
}
.cms_6-b .cate_box, .cms_6-b .cate_box .box_txt1, .cms_6-b .cate_box .box_txt2 {
    border-color: #ffffff;
}
.cms_title h2 {
    z-index: 1;
    position: absolute;
    left: 0;
    right: 0;
    text-align: center;
    top: 101px;
}
.cms_title p {
    color: #e3faff;
    opacity: 1;
    font-size: 138px;
    padding-left: 5%;
    font-family: 'Quicksand', sans-serif;
    transition: all 2s cubic-bezier(0.19, 1, 0.22, 1);
    /*position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    top: -10px;
    z-index: 0;
    text-align: right;
    padding-right: 28%;*/
}
#top_cms .cms_title .cms_title_inner span {
    top: 231px;
}
.top_cms_box:nth-of-type(1) .cms_title p, .top_cms_box:nth-of-type(4) .cms_title p {
       color: #fff; 
}
.more {
    z-index: 0;
    overflow: hidden;
}
.more span.before {
    background-color: #007a96;
}

.mini {
    position: relative;
    display: flex;
    align-items: center;
    color: #007a96;
    font-weight: bold;
    margin-bottom: 10px;
}
.mini::before {
    content: '';
    display: block;
    height: 2px;
    margin-right: 1rem;
    width: 8rem;
    background-color: #71bccd;
}
.catch {
    z-index: 1;
    width: 75px;
    top: 13%;
    right: 8%;
    filter: drop-shadow(0px 2px 2px rgba(0,0,0,0.2));
}
#contents .mini {
    position: absolute;
    top: 50%;
    margin-top: -14px;
}
#contents .contents_inner h2 {
    margin-bottom: 0;
}
#contents2 {
      background-color: #f2ffe4;  
}
@media(min-width: 769px) {
    .hamburger {
    width: 57px;
    height: 57px;
    padding: 17px 0px 10px 13px;
}
    #main_img {
    top: 73px;
}
#main_img .inner {
    margin-right: 0;width: calc(100% - 306px - 2%);
}
}

@media screen and (min-width:667px) and ( max-width:768px) {
  #main_img .inner {
    margin-right: calc(259px + 15px);
    width: auto;
}  

}
@media screen and (max-width: 768px){
    #global-nav ul {
    margin-top: 45px;
}
.all_header #global-nav ul li {
    width: auto;
}
.page1 h1.logo {
    width: 131px;
}
h1.logo {
    width: 151px;
}    
.catch {
    width: 45px;
    top: 18%;
    right: 6%;
    filter: drop-shadow(0px 2px 2px rgba(0,0,0,0.4));
}
.mini {
    font-size: 12px;
}
#contents .mini {
        
        position: absolute;
    top: 50%;
    margin-top: -10px;
}
.mini::before {
    margin-right: 0.8rem;
    width: 5rem;

}
}

/* ------------------------------------------------------------------------------------------*/
.catch_txt .font1, .point01, .point02, .cms_title p {
/* font-family: 'Rubik', sans-serif;
font-family: 'Acme', sans-serif;*/
}

/* --------------------------------- LOGO --------------------------------------------- */
#header .inner.width_60per {
    width: 75%!important;
}
#fakeloader .fl {
    max-width: 185px!important;
}
/* ------------------------------------------------------------------------------ */
.fat-nav li:last-child a {
    border-bottom: 1px solid #fff;
    border-top: 1px solid #fff;
}
.point01, .point02 {
    font-size: 2rem;
}
#global-nav li a span {
  opacity: 1;
}
.font_2dw {
        font-size: -webkit-calc(1rem - 1px);
    font-size: calc(1rem - 1px);
}
#global-nav li a span {
    font-weight: bold;color: #007a96;
}

#contents2 .contents_txt h2 span {
    background-color: #fff;
}
#catch .catch_txt h2 span, #contents2 .contents_txt h2 span {
    display: none;
}
.top_cms_box:nth-of-type(1) .border_color1, .top_cms_box:nth-of-type(4) .border_color1 {
       border-color: #fff; 
}
.top_cms_box:nth-of-type(1), .top_cms_box:nth-of-type(4) {
padding-top: 80px;
background: #daf4fa;
padding-left: 30px; padding-right: 30px;
padding-bottom: 90px;
}
.top_cms_box:nth-of-type(4) {
padding-top:90px;
}




@media screen and (max-width: 768px){
    .cms_title p {
    transform: inherit!important;
    padding-left: 0;
}
header {
    padding-bottom: 5%;
}
}
@media screen and (max-width: 667px){
    #cms_2-a .cate, #cms_2-b .cate, #cms_6-b .cate {
    margin-top: -45px;
    padding-top: 45px;
}
    #top_cms .cms_title .cms_title_inner span {
    top: 97px;
}
.cms_title h2 {
    top: 6px;
}
    .index_header .nav_box {
    padding: 8px 100px 2% 3%;
}
    .page1 .nav_box {
    border-top: 0;
}
    #fakeloader .fl {
    max-width: 123px!important;
}
    #copyright {
        font-size: 11px;
    }
.cms_title p {
    font-size: 46px;
}
 #contents .mini {
        position: inherit;
    }
    .hamburger {
    background: #b3d690;
}
.hamburger__icon {
    margin-top: 12px;
}
    .page1 h1.logo, h1.logo {
    left: 10px;
    top: -11px;
    width: 141px;
}
h1.logo {
    width: 153px;
    position: inherit;
}
.index_header #logo, #logo {
    max-width: 202px;
}
.page1 .index_header .nav_box {
    padding: 9px 10px 7px 15px;
}
.nav_box {
    padding: 7px 10px 7px 15px;
}
.index_header #logo, #logo {
    max-width: 53px;
}
#main_img {
       padding-top: 64px!important; 
}
.catch {
    width: 24px;
    top: 26%;
    right: 9%;
}
#main_img .inner {
    padding-bottom: 0!important;
}
.top_cms_box:nth-of-type(1), .top_cms_box:nth-of-type(4) {
padding-top: 23px;
    padding-bottom: 43px;
}
}


@media all and (-ms-high-contrast: none) {
#page8 #contact_tel a, #page8 a.border_so1 {
    padding-top: 37px;
}
.cms_title p {
    font-size: 125px;
    padding-left: 0;
}
.hamburger {
    background-color: #b3d690;
}
}