main {background: #A4E7DD;}
.main-section {position: relative; overflow: hidden;}
.main-section .left-bg,
.main-section .right-bg {position: absolute; height: 100%; top: 0; background: url(../images/bg-repeat.png) repeat-y; background-size: contain;}
.main-section .left-bg {width: calc(50% - 391px); left: 0; background-position: top right;}
.main-section .right-bg {width: calc(50% - 391px); top: 300px; right: 0; background-position: top left;}
.content-01 {padding-top: 50px;}

.content-03 {position: relative; z-index: 3;}
.content-03 .more-link-div {position: absolute; bottom: 25%; left: 50%; transform: translateX(-50%); width: 100%; text-align: center;}
.content-03 .more-link-div {display: none;}
.content-03 a {background: #3B4E84; color: #fff; font-weight: 600; font-size: 24px; padding: 15px 10px 20px; display: inline-block; width: 40%; text-align: center; position: relative; border-radius: 100px;}
.content-03 a span {position: absolute; top: 50%; right: 20px; transform: translateY(-50%);}
.content-03 a span svg path{stroke: #fff;}

.content-04 {background: #FFFDE6; padding-top: 50px; margin-top: -40px; text-align: center;}
.content-04 .d-flex {padding: 0 1%;}
.content-04 .d-flex .item{width: 24.5%; margin-bottom: 0.5%; border-radius: 10px; background: #0092D8; padding: 15px 5px;}
.content-04 .d-flex .item p {color: #fff; font-weight: 600; line-height: 25px; height: 50px; overflow: hidden; text-align: center; font-size: 20px;}
.content-05 {background: #FFFDE6; padding: 50px 0 30px;}
.content-05 img {margin-top: -5px;}
.content-05 div img {position: relative; z-index: 2; margin-top: 0;}
.content-05 p {margin-top: 15px; padding-left: 15px; font-weight: 600;}
.content-06 {}

.content-07 {background: #50BBEF; border-radius: 10px; padding-bottom: 50px; position: relative;}
.content-07 .d-flex {padding: 0 1%;}
.content-07 .d-flex .item {width: 19.5%; margin-bottom: 0.5%; background: #fff; border-radius: 5px; text-align: center; padding: 25px 0 10px;}
.content-07 .d-flex .item p {font-size: 14px; font-weight: 600; margin-top: 5px; line-height: 20px; height: 40px; overflow: hidden;}

.content-07 .more-link-div {margin-top: 50px; text-align: center;}
.content-07 .more-link-div {display: none;}
.content-07 a {background: #3B4E84; color: #fff; font-weight: 600; font-size: 24px; padding: 15px 10px 20px; display: inline-block; width: 60%; text-align: center; position: relative; border-radius: 100px;}
.content-07 a span {position: absolute; top: 50%; right: 20px; transform: translateY(-50%);}
.content-07 a span svg path{stroke: #fff;}

.content-09 img{width: calc(100% + 20px); max-width: 766px; margin-left: -20px;}
.content-11 img{width: calc(100% + 10px); max-width: 756px; margin-left: -10px;}
.content-16 {border: solid 3px #0092D8; overflow: hidden; border-radius: 10px;}
.content-16 .t-center{background: #FFFFFF; padding: 30px 16px 10px; font-size: 0; line-height: 0;}
.content-16 .voice-list {background: #EBF8FF; border-top: solid 3px #0092D8; border-top-left-radius: 10px; border-top-right-radius: 10px; overflow: hidden; margin-top: -12px; padding: 10px 30px;}
.content-16 .voice-list .voice-item {}
.voice-item .voice-name {font-size: 30px; font-weight: 600; color: #023166; padding: 10px 0; border-bottom: solid 1px #0092D8;}
.voice-item .voice-content {padding: 20px 0; font-size: 18px; width: 50%;}
.voice-item .voice-image {
    padding: 20px 20px 20px 0;
    width: 50%;
}

.content-18 video {width: 100%;}

.contact-banner {background: url(../images/bg-contact.png) no-repeat; background-size: cover; padding: 50px 0;}
.contact-banner .contact-banner-inner {background: #fff; border-radius: 10px; padding-top: 30px; padding-bottom: 30px;}
.contact-banner .contact-links a {display: inline-flex; width: 350px; height: 60px; justify-content: center; align-items: center; font-size: 20px; font-weight: 600; color: #fff; border-radius: 10px;}
.contact-banner .contact-links a img {margin-right: 10px; transition: all .15s linear;}
.contact-banner .contact-links div:first-of-type {margin-bottom: 15px;}
.contact-banner .contact-links div:first-of-type a {background: #00B200; box-shadow: 0px 3px 0px 0px rgb(0, 77, 0, 0.8);}
.contact-banner .contact-links div:last-of-type a {background: #023166; box-shadow: 0px 3px 0px 0px rgb(0, 25, 53, 0.8);}
.contact-banner .img-ill {position: absolute; right: -200px; bottom: -61px;}

.btn-hover {position: relative; overflow: hidden;}
.btn-hover::after {content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #fff; opacity: .5; transform: translateX(-101%);}
.btn-hover:hover::after {-webkit-animation: btn-hover 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) alternate forwards; animation: btn-hover 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) alternate forwards;}
.btn-hover span {transition: all .3s linear;}
.btn-hover:hover span {right: 25px;}

@-webkit-keyframes btn-hover {
    to {
        -webkit-transform: translateX(101%);
        transform: translateX(101%);
    }
}

@keyframes btn-hover {
    to {
        -webkit-transform: translateX(101%);
        transform: translateX(101%);
    }
}


footer {padding: 25px 0 10px; background: #023166;}
footer p,
footer a  {color: #fff;}
footer p {font-weight: 600;}
footer p.copyright {text-align: center; margin-top: 20px;}
footer .footer-info {display: flex; justify-content: center; align-items: center; margin-top: 35px;}
footer .footer-menu {text-align: center;}
footer .footer-menu a {margin: 0 10px; display: inline-block; font-weight: 600; position: relative; padding-bottom: 5px; overflow: hidden;}
footer .footer-menu a:before {content: ''; display: block; position: absolute; left: 0; bottom: 0; z-index: 1; width: 100%; height: 2px; background-color: #fff; transform: translateX(-101%); transform-origin: top left;}
footer .footer-menu a:hover::before {animation: hover-gnav 0.25s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards alternate;}
footer .footer-menu a.link-contact {padding: 0 15px 2px; border-radius: 100px; background: #fff; color: #023166;}
footer .footer-menu a.link-contact::before {content: unset;}

.building-area {padding: 50px 0 0; font-size: 0; line-height: 0;}

header {position: fixed; top: 0; left: 0; width: 100%; padding: 20px 0 15px; z-index: 999; transition: all .3s linear;}
header .d-flex {align-items: flex-start;}
header .logo img {width: 200px; transition: all .3s linear;}
header .pc-menu {display: flex;}
header .pc-menu a {display: block; margin: 0 10px; font-weight: 600; padding-bottom: 5px; position: relative; overflow: hidden;}
header .pc-menu a:before {content: ''; display: block; position: absolute; left: 0; bottom: 0; z-index: 1; width: 100%; height: 2px; background-color: #000; transform: translateX(-101%); transform-origin: top left;}
header .pc-menu a:hover::before {animation: hover-gnav 0.25s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards alternate;}
@-webkit-keyframes hover-gnav {
    to {
        -webkit-transform: translateX(0%);
        transform: translateX(0%);
    }
}

@keyframes hover-gnav {
    to {
        -webkit-transform: translateX(0%);
        transform: translateX(0%);
    }
}
header .pc-menu a.link-contact {padding: 0 15px 2px; border-radius: 100px; background: #023166; color: #fff;}
header .pc-menu a.link-contact::before {content: unset;}

header.sticky {padding: 15px 0 10px; background: #FFDD33;}
header.sticky .logo img{width: 120px;}
header.sticky .d-flex {align-items: center;}

.top-banner {background: #FFDD33; padding: 150px 0; background-image: url(../images/top-banner-bg.png); background-repeat: no-repeat; background-position: center; background-size: contain;}
.top-banner .top-banner-desc p {font-weight: 600; font-size: 30px; border-radius: 100px; padding: 15px 50px 17px; background: #32B9AE; color: #fff; letter-spacing: 1px;}
.top-banner .top-banner-thumb {flex: 0 0 20%; margin-top: 120px;}
.top-banner .top-banner-text {flex: 1; padding-left: 50px;}

.top-banner .top-banner-text h1 {font-size: 0; display: inline-block; text-align: center; line-height: 0;}
.top-banner .top-banner-text h1 span {position: relative; display: inline-block; text-align: center;}

.top-banner .top-banner-text .top-banner-item {flex: 0 0 46%; margin: 0 2%; padding: 20px; border-radius: 10px;}
.top-banner .top-banner-text .top-banner-item h2 {font-size: 30px; color: #fff; text-transform: uppercase; font-weight: 600; text-align: center; position: relative; z-index: 2;}
.top-banner .top-banner-text .top-banner-item .item-img {margin: -25px 0; text-align: center;}
.top-banner .top-banner-text .top-banner-item:first-of-type {background: #3FC8B4;}
.top-banner .top-banner-text .top-banner-item:first-of-type:hover {box-shadow: 5px 5px 0px 0px rgba(63, 200, 180, .5);}
.top-banner .top-banner-text .top-banner-item:first-of-type:hover span {background: #3FC8B4; border-color: #fff;}
.top-banner .top-banner-text .top-banner-item:first-of-type:hover span svg path{stroke: #fff;}
.top-banner .top-banner-text .top-banner-item:last-of-type {background: #000000;}
.top-banner .top-banner-text .top-banner-item:last-of-type p {color: #fff;}
.top-banner .top-banner-text .top-banner-item .t-center {margin-top: 20px; margin-bottom: -45px;}
.top-banner .top-banner-text .top-banner-item .t-center span {display: inline-flex; width: 50px; height: 50px; align-items: center; justify-content: center; border: solid 3px #3FC8B4; border-radius: 100%; background: #fff; transition: all .3s linear;}
.top-banner .top-banner-text .top-banner-item .t-center span svg path {transition: all .3s linear;}
.top-banner .top-banner-text .top-banner-item:last-of-type .t-center span {border-color: #000;}
.top-banner .top-banner-text .top-banner-item:last-of-type .t-center span svg path{stroke: #000;}
.top-banner .top-banner-text .top-banner-item:last-of-type:hover {box-shadow: 5px 5px 0px 0px rgba(0, 0, 0, .5);}
.top-banner .top-banner-text .top-banner-item:last-of-type:hover span {background: #000; border-color: #fff;}
.top-banner .top-banner-text .top-banner-item:last-of-type:hover span svg path{stroke: #fff;}


.fixed-links {position: fixed; right: 0; top: 50%; transform: translateY(-50%); z-index: 10;}
.fixed-links a {display: flex; align-items: center; justify-content: center; width: 140px; height: 100px; font-size: 20px; color: #fff; font-weight: 600; text-align: center;}
.fixed-links a {margin-bottom: 15px; border-top-left-radius: 10px; border-bottom-left-radius: 10px; box-shadow: 0px 3px 0px 0px rgba(0, 0, 0, .4);}
.fixed-links a img {width: 35px;}
.fixed-links a:last-of-type {margin-bottom: 0px;}
.fixed-links a:nth-of-type(1) {background: #26A299;}
.fixed-links a:nth-of-type(2) {background: #E94709;}
.fixed-links a:nth-of-type(3) {background: #00B900;}
/* .fixed-links a:hover {width: 150px;} */

/* New Style */
footer .footer-menu {display: none;}
footer .footer-info {margin-top: 0;}
header {display: none;}
.top-banner {padding: 120px 0 150px;}
.sp-show {display: none;}
.pc-show {display: block;}

.top-sp-show {display: none !important;}
.top-pc-show {display: inline-block !important;}

.sp-phone-banner {}
.sp-phone-banner a {position: relative; font-size: 0; line-height: 0; display: block;}
.sp-phone-banner a .banner-ill{position: absolute; left: 30px; width: 150px; top: 50%; transform: translateY(-50%);}

.page-top {position: fixed; z-index: 99; bottom: 50px; right: 25px; display: none;}
.page-top:hover {cursor: pointer;}

/* .content-18 {background: #fff;} */
.logo-img {position: relative;}