﻿@charset "UTF-8";
#banner{position: relative;}
.slogan{position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);color: #FFFFFF;font-size: 4vw;font-weight: bolder; text-align: center;}
.slogan_text {

    animation-name: fadeIn;
    animation-duration: 1.2s;
    animation-fill-mode: both;
    display: block;
}
.slogan_text:nth-child(2) {
    -webkit-animation-delay: 0.3s;
    animation-delay: 0.3s;
}
.slogan_text:nth-child(3) {
    -webkit-animation-delay: 0.6s;
    animation-delay: 0.6s;
}
#sec-01{padding: 8rem 0;position: relative;overflow: hidden;}
/* #sec-01::before{content: "";width: 682px;height: 550px;background-repeat: no-repeat;background-size: contain;background-position: center;position: absolute;top: 50%;right: -150px;transform: translateY(-50%);z-index: 0;
background-image: url("data:image/svg+xml,%3Csvg%20width%3D%22681%22%20height%3D%22554%22%20viewBox%3D%220%200%20681%20554%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M381.255%20504.597C442.421%20547.719%20548.805%20574.243%20617.94%20532.925C698.882%20484.553%20692.209%20369.718%20649.857%20308.617C607.505%20247.515%20571.217%20216.717%20579.355%20126.954C590.966%20-1.09458%20389.308%20-33.6387%20270.49%2038.0143C169.043%2099.1842%20135.574%20140.383%2047.8811%20229.5C-55.5171%20334.579%2021.9086%20505.037%20164.671%20483.607C273.205%20467.314%20374.651%20499.931%20381.264%20504.588L381.255%20504.597Z%22%20fill%3D%22%23E6F8FB%22%20fill-opacity%3D%220.89%22%2F%3E%0A%3C%2Fsvg%3E");}
#sec-01::after{content: "";width: 380px;height: 518px;background-repeat: no-repeat;background-size: contain;background-position: center;position: absolute;bottom: -150px;left: -100px;z-index: 0;
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%22380%22%20height%3D%22518%22%20viewBox%3D%220%200%20380%20518%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M342.299%20205.841C358.852%20153.204%20355.985%2070.674%20315.886%2027.936C268.939%20-22.1015%20195.216%204.13281%20163.352%2046.3927C131.489%2088.6526%20118.263%20120.851%2058.1018%20131.617C-27.719%20146.974%20-10.7051%20300.116%2058.6316%20373.447C117.827%20436.059%20151.081%20452.805%20225.916%20500.185C314.155%20556.05%20410.774%20467.86%20369.69%20367.719C338.456%20291.588%20340.505%20211.526%20342.291%20205.836L342.299%20205.841Z%22%20fill%3D%22%23E6F8FB%22%20fill-opacity%3D%220.89%22%2F%3E%0A%3C%2Fsvg%3E");} */
#sec-01 img{border-radius: 35px;}
#sec-02 h1{position: absolute;width: auto;color: #FFFFFF; text-shadow: 0px 1px 10px rgba(255, 255, 255, 0.40);top: 50%;transform: translateY(-50%);left: 10%;font-size: 3vw;}
.sec-03-box{padding: 2rem 0;justify-content: space-around;align-items: center;}
.sec-03-box h2{margin-bottom: 1.5rem;}
.sec-03-box img{border-radius: 35px;}
#sec-04{background-color: #FDF7EF;position: relative;overflow: hidden;}
/* #sec-04::before{content: "";width: 555px;height: 411px;position: absolute;right: -9%;top: 50%;transform: translateY(-50%);background-repeat: no-repeat;background-size: contain;background-position: center;z-index: 1;
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%22555%22%20height%3D%22411%22%20viewBox%3D%220%200%20555%20411%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M310.324%20372.941C360.072%20405.321%20446.752%20425.76%20503.27%20395.708C569.439%20360.525%20564.363%20275.487%20530.017%20229.945C495.67%20184.403%20466.172%20161.334%20473.096%2094.964C482.974%200.286699%20318.608%20-25.3329%20221.473%2026.7917C138.54%2071.2902%20111.111%20101.525%2039.3063%20166.812C-45.3589%20243.792%2017.2447%20370.533%20133.748%20355.759C222.319%20344.527%20304.952%20369.438%20310.331%20372.935L310.324%20372.941Z%22%20fill%3D%22%23FFFCF8%22%2F%3E%0A%3C%2Fsvg%3E%0A");} */
#sec-04 .container{position: relative;z-index: 2;}
.sec-04-box h6{padding-top: 1rem;}
.sec-04-textbox{width: 430px;margin-left: auto;margin-right: auto;max-width: 100%;}
/* #btnShop{display: inline-block;border: #F27722 solid 2px;padding: 7px 30px;cursor: pointer;color: #F27722;font-weight: bold;}
#btnShop:hover{background-color: #F27722;color: #FFFFFF;} */
.sec-05-Box{max-width: 991px; width: 100%;text-align: center;margin: 2.5rem auto;}
.tabs__content_wrapper .swiper img{border-radius: 35px;}
.tabs__content_wrapper .swiper_tech{position: relative;}
.tabs__content_wrapper .swiper_tech_intro{align-self: center;padding-left: 1.5rem;padding-right: 1.5rem;}
.tabs__content_wrapper .swiper_tech_intro ul {list-style-type: disc;}
.tabs__content_wrapper .swiper_tech_intro ul li{padding-bottom: 1.5rem;}
.tabs.style__horizontal .tabs__content.is__active {
    background: #FFFCF8;
}
.swiper_tech .swiper-button-next{bottom: 10px;top: auto;}
.swiper_tech .swiper-button-prev{bottom: 10px;top: auto;left: auto;right: 45px;}
.swiper_tech .swiper-button-next:after{content: "";background-repeat: no-repeat;background-size: 12px;background-position: center;width: 25px;height: 25px; border-radius: 100%;border: 1px solid #231815;outline: none;
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2210%22%20height%3D%2213%22%20viewBox%3D%220%200%2010%2013%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M4.11963%201L9.53963%206.42L4.11963%2011.84%22%20stroke%3D%22%23231815%22%20stroke-width%3D%220.57%22%20stroke-miterlimit%3D%2210%22%2F%3E%0A%3Cpath%20d%3D%22M9.54%206.41992H0%22%20stroke%3D%22%23231815%22%20stroke-width%3D%220.57%22%20stroke-miterlimit%3D%2210%22%2F%3E%0A%3C%2Fsvg%3E");}
.swiper_tech .swiper-button-prev:after{content: "";background-repeat: no-repeat;background-size: 12px;background-position: center;width: 25px;height: 25px; border-radius: 100%;border: 1px solid #231815;outline: none;
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2211%22%20height%3D%2213%22%20viewBox%3D%220%200%2011%2013%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M6.42041%2011.8398L1.00041%206.41984L6.42041%200.999844%22%20stroke%3D%22%23231815%22%20stroke-width%3D%220.57%22%20stroke-miterlimit%3D%2210%22%2F%3E%0A%3Cpath%20d%3D%22M1.00004%206.41992H10.54%22%20stroke%3D%22%23231815%22%20stroke-width%3D%220.57%22%20stroke-miterlimit%3D%2210%22%2F%3E%0A%3C%2Fsvg%3E");}
.SwiperSec06 .swiper-wrapper {transition-timing-function: linear !important;}
.SwiperSec06 img{border-radius: 35px;}
@media (max-width:1400px) {
}
@media (max-width:1300px) {
}
@media (max-width:1200px) {
    #sec-01::before {width: 510px;height: 400px;}
    #sec-01::after {
        width: 27vw;
        height: 53vw;
        bottom: -14vw;
        left: -7vw; }
}
@media (max-width:991px) {
    #sec-01{padding-top: 3.5rem;}
    .sec-03-box{margin-bottom: 2rem;}
    .sec-03-box > div:nth-child(2){margin-bottom: 1rem;}
    #copyright {text-align: center;}
}
@media (max-width:767px) {
    .sec-04-box{padding: 0 1rem;}
    .sec-04-box figure{display: flex;flex-wrap: nowrap; align-items: center;margin-bottom: 2.75rem;}
    .sec-04-box figure > div:nth-child(1){flex: 0 0 auto;width: 90px; text-align: center;}
    .sec-04-box figure figcaption{flex: 1 0 0;padding-left: 1rem;}
    .tabs__content_wrapper .swiper img {border-radius: 10px;}
    .tabs__content_wrapper .swiper_tech_intro{padding-left: 0;padding-right: 0;padding-top: 2rem;}
    .tabs__content_wrapper .swiper_tech_intro ul li {padding-bottom: 0.75rem;line-height: 168%;}
    #sec-01 img, .sec-03-box img {border-radius: 15px;}
}
@media (max-width:576px) {
    .slogan{font-size: 8vw;}
    .slogan_text {padding-bottom: 1.5rem;}
    #sec-01 h2,#sec-01 p,#sec-03 .sec-03-box,.sec-04-textbox{text-align: center;}
    #sec-02 h1 {
        color: #737373;
        text-shadow: 0px 1px 10px rgba(255, 255, 255, 0.40);
        transform: none;
        top: 10%;
        left: 0;
        width: 100%;
        text-align: center;
        font-size: 6.5vw;
    }
    .SwiperSec06 img{border-radius: 10px;}
}
@media (max-width:480px) {
}
@media (max-width:450px) {
}
@media (max-width:400px) {
}
@media (max-width:375px) {
}
@media (max-width:350px) {
}

@keyframes fadeIn {
    0% {transform: translateY(-150px);
        opacity: 0;
    }

    100% {
        transform: translateY(0);
        opacity: 1;
    }
}