/* add AIO Info */
#cooling-form th, #cooling-form td {
    background: #ffffff00 !important;
    border-bottom: 1px solid #000 !important;
}
ul.tab-title,
ul.tab-title-b,
ul.tab-title-c {
    margin: 0 auto 1rem;
}


.tab-a .tab-title li,
.tab-b .tab-title-b li,
.tab-c .tab-title-c li {
    padding: 10px;
    font-size: 1.2rem;
    list-style-type: none;
    width: 80%;
    text-align: center;
    margin: 0 auto;
}

.tab-a .tab-title li a,
.tab-b .tab-title-b li a,
.tab-c .tab-title-c li a {
    display: block;
    color: #000000;
    text-decoration: none;
}

.tab-a .tab-title li a,
.tab-b .tab-title-b li a,
.tab-c .tab-title-c li a {
    background-color: #d8dadd;
    border: 1px solid #d8dadd;
    padding: 0.4rem 0.3rem;
    width: 100%;
}

.tab-a .tab-title li a:hover,
.tab-b .tab-title-b li a:hover,
.tab-c .tab-title-c li a:hover {
    color: #000000;
    background-color: #cbdef8;
    border: 1px solid #cbdef8;
    transform: translateY(-0.3em);
    box-shadow: 0 0 10px 0 #ffffff;
}

.tab-a .tab-title li.active a,
.tab-b .tab-title-b li.active a,
.tab-c .tab-title-c li.active a {
    color: #3b3b3b;
    background-color: #cbdef8;
    border: 1px solid #cbdef8;
}
.tab-b {
    margin: 3rem auto 0;
}
.aio img{
    border-radius: 1rem;
}
.aio sup {
    vertical-align: sub !important;
    font-size: 14px !important;
}
@media (min-width:700px){
    .tab-a .tab-title, 
    .tab-b .tab-title-b, 
    .tab-c .tab-title-c {
        display: flex;
        width: 80%;
        margin: 1rem auto;
    }
    .mt-8{
        margin-top: 8%;
    }
    .outside{
        display: flex;
        align-items: center;
        justify-content: center;
    }
}
/*--------------bootstrap header correction--------------*/

a,
abbr,
acronym,
address,
applet,
article,
aside,
audio,
b,
big,
blockquote,
body,
canvas,
caption,
center,
cite,
code,
del,
details,
dfn,
div,
em,
embed,
fieldset,
figcaption,
figure,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hgroup,
html,
i,
iframe,
img,
ins,
kbd,
label,
legend,
li,
mark,
menu,
nav,
object,
ol,
output,
p,
pre,
q,
ruby,
s,
samp,
section,
small,
span,
strike,
strong,
summary,
table,
tbody,
td,
tfoot,
th,
thead,
time,
tr,
tt,
u,
ul,
var,
video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

h5 {
    margin-bottom: 15px;
}

h5,
h5 a,
h5 a:hover {
    color: #777;
}

h5 {
    font-size: 18px;
    line-height: 28px;
    font-weight: 500;
}

h1 {
    margin-bottom: 15px;
}

h1,
h1 a,
h1 a:hover,
.text-logo #logo {
    color: #212121;
}

h1,
.text-logo #logo {
    font-size: 48px;
    line-height: 50px;
    font-weight: 400;
}

body,
button,
span.date_label,
.timeline_items li h3 span,
input[type="submit"],
input[type="reset"],
input[type="button"],
input[type="text"],
input[type="password"],
input[type="tel"],
input[type="email"],
textarea,
select,
.offer_li .title h3 {
    font-family: Arial, Tahoma, sans-serif;
}

body {
    font-size: 14px;
    line-height: 25px;
    font-weight: 400;
}

h1,
.text-logo #logo {
    font-size: 48px;
    line-height: 50px;
    font-weight: 400;
}

#Top_bar .top_bar_left .logo img {
    max-height: 45px !important;
}

#Top_bar .top_bar_left .menu_wrapper nav ul {
    margin-bottom: 0rem;
}


/*--------------//bootstrap header correction--------------*/

.carousel-control-next-icon {
    background-image: url(../button_right.png);
    width: 50px;
    height: 50px;
}

.carousel-control-prev-icon {
    background-image: url(../button_left.png);
    width: 50px;
    height: 50px;
}

.img {
    max-width: 100%;
    height: auto;
}

.features {}

.features .row {
    margin: 0;
}

.features .container {
    width: auto !important;
    max-width: -webkit-fill-available !important;
}

.bg {
    width: -webkit-fill-available;
}

.features .title {
    font-weight: 600;
    color: #3b5a90;
    font-size: 38px;
    /* letter-spacing: 0.025em; */
    font-family: 'noto-sans', 'Arial';
    /* margin-bottom: 0.5em; */
    /* line-height: 1.2em; */
    /* padding: 0; */
    line-height: rem;
}

.features .title span {
    font-size: 1.2rem;
    font-weight: 600;
}

.features .sub_title {
    font-family: 'noto-sans', 'Arial';
    font-size: 32px;
    font-weight: 600;
    padding-top: 6rem;
}

.section {
    /* padding: 5vw 3vw; */
}

.descript {}

.custom_btn {
    display: inline-block;
    vertical-align: middle;
    font-size: 2rem;
    color: #fff;
    background-color: #777;
    border: none;
    padding: .8rem 1.8rem .8rem 1.6rem;
    margin: 1.4rem;
    -webkit-transition: .3s;
    transition: .3s;
    box-shadow: 0 2px 6px rgb(0 0 0 / 10%);
    letter-spacing: 2px;
    text-align: center;
    border-radius: 10px;
    cursor: pointer;
}

.btn_link_more {
    outline: 0;
    font-size: 1.4rem;
    background-color: transparent;
    border: 1px solid #36485e;
    color: #36485e;
    margin-top: 1rem;
    position: relative;
}

.btn_link_more:hover {
    color: #fff;
    border: 1px solid #36485e;
    background-color: #36485e;
    text-decoration: none;
}

.btn_link_more::after {
    content: "";
    /* color: #36485e; */
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 4px 0 4px 7px;
    border-color: transparent transparent transparent #36485e;
    position: absolute;
    right: 7%;
    top: 42%;
    top: calc( 50% — 6px);
}

.features .descript,
.features .note {
    font-size: 1.2rem;
    color: #535353;
    font-family: 'Calibri', 'Arial';
    line-height: 1.75em;
    margin: 1rem 0;
}

.slick-dots li button {
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
}


/*******************sec01*****************/

.sec01 {
    background: #bcd3e2;
    padding: 13vw 2.5vw 2vw;
    background-image: url('../sec1_iw_pl070_02_bg.jpg');
    background-size: contain;
    background-repeat: no-repeat;
    /* background-position: bottom; */
}

.sec01 .bg {
    width: 100%;
}

.sec01 .sec01_area {
    position: relative;
    top: 0;
    width: 100%;
    align-items: center;
}

.sec01 .sec01_area .title {}

.sec01 .sec01_area .title span {
    color: #000;
    /* font-size: 2.2rem; */
    /* font-weight: 100; */
}

.sec01 .sec01_area .pro {
    width: 75%;
    padding-top: 7rem;
}

.sec01 .sec01_area .content {
    position: relative;
}

.sec01 .sec01_area .content::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgb(255 255 255 / 80%);
    filter: blur(20px);
    z-index: -1;
}

.sec01 .sec01_area .pro_area {
    padding: 0px 0vw 0vw 0vw;
    width: 41%;
}

.sec02 {
    position: relative;
    padding: 0vw 0 6vw;
    background-color: #e4e5e7;
}

.sec02 .box {
    padding: 0;
}

.sec02 .box_text {
    padding: 0;
    margin: 0 1rem;
}

.sec02 .title {
    margin-top: 1rem;
}

.sec02 .btn_box {
    margin: 0 auto;
}

.sec03 {
    background-image: url('../sec3_iw_pl070_00_bg.jpg');
    background-size: cover;
    padding: 13vw 4vw;
    position: relative;
}

.sec03 img {
    width: 100%;
}

.sec03 .case_box {
    width: 80%;
    margin: 0 auto;
}

.sec03 h4.title {}

.sec03 .descript {
    /* margin-bottom: 2rem; */
}

.sec03 .descript span {
    /* color: #6a99a3; */
    /* font-size: 1.5rem; */
    /* font-weight: 500; */
}

.sec03 .btn_area {
    padding: 3rem 0;
}

.sec03 .btn_area .btn_title {
    padding-bottom: 10px;
    font-weight: 600;
}

.sec03 .btn_area .col-4 {
    margin-top: 0;
    padding: 0;
}

.sec03 .btn_area .col-4 p {
    margin: -13px 0 3px 0;
}

.sec03 .btn_area .col-4 img {
    width: 85%;
    transition-duration: 0.5s;
}

.sec03 .demo_area .demo_item {
    display: none;
}

.sec03 .demo_area .demo_item.active {
    display: block;
}

.sec03 .demo_area .demo_item .des {
    color: black;
    margin-top: -40px;
    padding-bottom: 3px;
}

.sec03 .demo_area .fixed_des {
    color: black;
    font-size: 14px;
}


/*******************sec04*****************/

.sec04 {
    background: #bcd3e2;
    padding: 13vw 5vw;
    position: relative;
}

.sec04 .bg {
    display: none;
}

.sec04 .upper_area .title {
    color: #ffffff;
}

.sec04 .upper_area .descript {
    padding: 0;
    width: 100%;
    color: #fff;
}

.sec04 .upper_area .btn_area {
    position: relative;
    padding: 0;
}

.sec04 .upper_area {
    background: #3b6498;
    padding: 2rem 1rem 0px;
    border-radius: 1rem;
    /* margin: 2rem 0 0; */
    position: relative;
}

.sec04 .upper_area .btn_area .btn_item {
    width: fit-content;
    align-items: center;
    display: inline-flex;
    border: 2px solid #ffffff;
    border-radius: 24px;
    padding: 10px 16px;
    cursor: pointer;
    font-size: 1rem;
    line-height: 20px;
    color: #ffffff;
}

.sec04 .upper_area .btn_area .btn_item.active {
    background-color: #ffffff;
    color: #416497;
}

.sec04 .upper_area .btn_area .btn_item:hover {
    background-color: #ffffff;
    color: #416497;
}

.sec04 .upper_area .pro_area {
    padding: .5rem;
}

.sec04 .upper_area .pro_area .pro_item {
    display: none;
    position: relative;
}

.sec04 .upper_area .pro_area .pro_item.active {
    display: block;
}

.sec04 .upper_area .pro_area .pro_item img {
    width: 100%;
}

.sec04 .upper_area .btn_area .btn_item {
    display: block;
    width: 100%;
}

.sec04 .upper_area .btn_area .col-12 {
    padding: 0 10px 20px 10px;
}

.sec04 .note {
    margin: 0 auto 2rem;
    /* position: absolute; */
    /* bottom: 2%; */
    /* left: 9%; */
    background: #3579cf;
    color: #fff;
    padding: 0.2rem;
    border-radius: 0.5rem;
}


/*******************sec05*****************/

.sec05 {
    background: #bcd3e2;
    position: relative;
    padding: 0vw 4vw 6vw;
}

.sec05 .title {
    margin: 0rem 0 1rem;
}

.sec05 .descript {}

.sec05 .upper_area {
    position: relative;
    padding: 10px 0 7rem;
}

.sec05 .upper_area .thumbnail_area {
    position: absolute;
    z-index: 1;
    bottom: 5%;
    width: 100%;
}

.sec05 .upper_area .thumbnail_area .thumbnail_item {
    padding: 5px;
    transition: transform 0.3s;
    -webkit-filter: saturate(0.1);
    cursor: pointer;
    max-width: 33.333333% !important;
}

.sec05 .upper_area .thumbnail_area .thumbnail_item:hover {
    transform: scale(1.15) !important;
    z-index: 2;
    -webkit-filter: saturate(1);
}

.sec05 .upper_area .thumbnail_area .descript {
    padding: 4vw 0 0 2vw;
    text-align: left;
    font-size: 1.2rem;
    color: #36485e;
    transform: translateX(30px);
}

.sec05 .upper_area .bg {
    width: 100%;
    max-width: 100% !important;
}

.sec05 .upper_area .pro_area {
    position: absolute;
    right: 0;
    left: 0;
}

.sec05 .upper_area .pro_area .pro_item {
    float: right;
    width: 100%;
    display: none;
}

.sec05 .upper_area .pro_area .pro_item.active {
    display: block;
}

.sec05 .upper_area .descript {
    font-size: 1.2rem;
    color: #36485e;
    padding: 10vw 7vw;
}

.sec05 .upper_area .thumbnail_area .thumbnail_item#sec05_up_item2:hover {
    transform: scale(1.15) !important;
    z-index: 2;
}

.sec05 .col-lg-6 {
    padding: 0;
}

.sec05 .btn_box {
    margin: 0 auto;
}

.sec06{
    background: #f4f4f4;
    padding: 3rem 3.3rem 1rem;
}
.sec06 h6.sub-unit {
    color: #888888;
    font-family: 'noto-sans', 'Arial';
}
.sec06 .cable_box {
    background-color: #fff;
    padding: 1rem 2rem;
    margin: 2rem 0;
}
.sec06 .pin_box {
    text-align: left;
    font-size: 1.2rem;
    color: #535353;
    margin: 0.5rem 0 0;
}
.sec07 {
    position: relative;
    padding: 0vw 0 6vw;
}

.sec07 .box {
    padding: 0;
}

.sec07 .title {
    margin-top: 1rem;
}

.sec08 {
    background: #eaf6fc;
    padding: 5vw 2.5vw 2vw;
    background-image: url(../sec8_iw_pl070_01_bg.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: bottom;
    padding: 13vw 4vw;
}

.sec09 {
    background: #f5f5f5;
    padding: 13vw 4vw;
}

.sec09 .title {
    font-size: 31px;
}

.sec09 .text_top {
    margin-bottom: 0rem;
}

.sec09 .text_bottom {
    margin-top: 0rem;
}

@media (max-width: 992px) {
    .pc {
        display: none !important;
    }
}

@media (min-width: 992px) {
    .mobile {
        display: none !important;
    }
    .section {
        /* padding: 6vw 3vw; */
        position: relative;
    }
    /* .custom_btn {
        padding: .8rem 2rem .8rem 1.6rem;
    } */
    .btn_link_more::after {
        right: 12%;
        top: 42%;
    }
    .features .descript {
        width: 80%;
        margin: 2rem auto;
    }
    .features .note {
        font-size: 1.2rem;
        position: absolute;
    }
    .sec01 {
        background: #bcd3e2;
        padding: 5vw 2.5vw 2vw;
        background-image: url('../sec1_iw_pl070_02_bg.jpg');
        background-size: cover;
        /* background-size: contain; */
        background-repeat: no-repeat;
        background-position: bottom;
    }
    .sec01 .sec01_area {}
    .sec01 .sec01_area .pro_area {
        padding: 0px 0vw 0vw 0vw;
        width: 33%;
    }
    .sec02 {
        padding: 0vw 0 1vw;
        background-color: #e4e5e7;
    }
    .sec02 .btn_box {
        margin: 0 auto;
        position: absolute;
        right: 20%;
        bottom: 28%;
    }
    .sec02 .box_text {
        padding: 0;
        margin: 0 4rem;
        text-align: left;
        width: 100%;
    }
    .sec02 .btn_link_more {
        outline: 0;
        font-size: 1rem;
        background-color: #36485eba;
        border: 1px solid #ffffff;
        color: #ffffff;
        margin-top: 0rem;
        padding: 0.5rem 1.5rem 0.5rem 1rem;
    }
    .sec02 .btn_link_more:hover {
        color: #36485e;
        border: 1px solid #ffffff;
        background-color: #ffffff;
    }
    .sec02 .btn_link_more::after {
        right: 10%;
        top: 42%;
        border-color: transparent transparent transparent #ffffff;
    }
    .sec03 {
        padding: 6vw 4vw;
    }
    .sec03 .case_box {
        width: 66%;
        margin: 0 auto 8rem;
    }
    .sec03 .note {
        right: 10%;
        bottom: 4%;
        width: 47%;
        font-size: 1rem;
        text-align: left;
    }
    .sec04 {
        background: #bcd3e2;
        padding: 5vw 2.5vw 2vw;
    }
    .sec04 .bg {
        display: block;
        width: 80%;
    }
    .sec04 .upper_area .title {
        color: #ffffff;
        position: absolute;
        top: 9%;
        left: 5%;
    }
    .sec04 .upper_area .descript {
        padding: 0;
        width: 55%;
        color: #fff;
        position: absolute;
        top: 47%;
        left: 5%;
        text-align: left;
    }
    .sec04 .upper_area .btn_area {
        position: absolute;
        padding: 0;
        width: 40%;
        top: 25%;
        left: 4%;
        text-align: left;
    }
    .sec04 .upper_area .pro_area {
        position: absolute;
        /* width: 58%; */
        top: 2%;
        left: 43%;
        padding: 0;
    }
    .sec04 .note {
        margin: 0 auto 2rem;
        position: absolute;
        bottom: 0%;
        left: -67%;
        background: #3579cf;
        color: #fff;
        padding: 0.2rem 1rem;
        border-radius: 0.5rem;
    }
    .sec05 {
        /* background: #bcd3e2; */
        /* position: relative; */
        padding: 0vw 1.5vw 3vw;
    }
    .sec05 .col-lg-6 {
        padding: 0 15px 0;
    }
    .sec05 .action_box {
        position: absolute;
        right: 0;
        left: 0;
    }
    .sec05 .descript {
        width: 100%;
        text-align: left;
        margin: 2rem auto 1rem;
    }
    .sec05 .btn_box {
        margin: 1rem;
        position: absolute;
        right: 15%;
        bottom: 9%;
    }
    .sec05 .btn_link_more {
        font-size: 1rem;
        padding: 0.5rem 1.8rem 0.5rem 1rem;
    }
    .sec05 .upper_area .thumbnail_area {
        position: absolute;
        z-index: 1;
        bottom: 5%;
        right: -38%;
        width: 85%;
    }
    .sec05 .title {
        margin: 0rem 0 1rem;
        text-align: left;
        padding-left: 15px;
    }
    .sec05 .note {
        width: 100%;
        font-size: 1rem;
        text-align: left;
    }
    .sec06 {
        padding: 5vw 1.5vw 0vw;
    }
    .sec06 .info_area h6 {
        text-align: center;
        padding-left: 0;
        font-weight: 500;
        text-align: left;
        padding: 0 0 0 1rem !important;
    }
    .sec06 .text_top {}
    .sec07 {
        padding: 6vw 0vw;
    }
    .sec08 {
        padding: 7vw 1vw;
    }
    .sec08 .title {
        text-align: left;
        margin: 0 0 0 3.4rem;
    }
    .sec08 .case {
        position: absolute;
        bottom: 0%;
        right: 0%;
    }
    .sec08 .img_box {
        width: 88%;
    }
    .sec08 .img_box_a {
        margin: 0 0 1rem 4rem;
    }
    .sec08 .img_box_c {
        margin: 1rem 0 0 4rem;
    }
    .sec08 .img_box p {
        margin: 0 1rem 0;
    }
    .sec06 .text_bottom {
        margin: 3rem 0 1rem;
    }
    .sec08 .descript {
        text-align: left;
    }
    .sec09 {
        padding: 6vw 4vw;
    }
    .sec09 .title {
        font-size: 38px;
    }
    .sec09 .sec09_box {
        position: absolute;
        width: 70%;
        text-align: left;
        top: 3%;
    }
    .sec09 .descript {
        width: 86%;
        margin: 0rem;
        padding: 0;
    }
    .sec09 .text_top {
        margin-top: 1rem;
        bottom: 6%;
        right: 2%;
        width: 25%;
        text-align: left;
    }
    .sec09 .text_bottom {
        margin-top: 1rem;
        bottom: 2%;
        left: 2%;
        width: 39%;
        text-align: left;
    }
}

@media (min-width: 1300px) {
    .sec02 .btn_box {
        right: 17%;
        bottom: 25%;
    }
    .sec03 .note {
        width: 39%;
        bottom: 6%;
    }
    .sec04 .bg {
        display: block;
        width: 64%;
    }
    .sec04 .upper_area .title {
        color: #ffffff;
        position: absolute;
        top: 9%;
        left: 3%;
    }
    .sec04 .upper_area .descript {
        padding: 0;
        width: 50%;
        color: #fff;
        position: absolute;
        top: 44%;
        left: 3%;
        text-align: left;
    }
    .sec04 .upper_area .btn_area {
        position: absolute;
        padding: 0;
        width: 34%;
        top: 23%;
        left: 2%;
        text-align: left;
    }
    .sec04 .upper_area .pro_area {
        position: absolute;
        width: 50%;
        top: 0;
        left: 50%;
        padding: 0;
    }
    .sec04 .note {
        margin: 0 auto 2rem;
        position: absolute;
        bottom: 8%;
        left: -94%;
        background: #3579cf;
        color: #fff;
        padding: 0.2rem 1rem;
        border-radius: 0.5rem;
    }
    .sec05 .upper_area .thumbnail_area {
        position: absolute;
        z-index: 1;
        bottom: 5%;
        right: -34%;
        width: 74%;
    }
    .sec05 .btn_box {
        margin: 1rem;
        position: absolute;
        right: 18%;
        bottom: 10%;
    }
    .sec05 .title {
        margin: 2rem 0 1rem;
        text-align: left;
    }
    .sec05 .note {
        width: 100%;
        font-size: 1rem;
        text-align: left;
    }
    .sec08 .title {
        margin: 0 0 0 4.4rem;
    }
    .sec09 .sec09_box {
        position: absolute;
        width: 40%;
        text-align: left;
        top: 5%;
    }
    .sec09 .descript {
        width: 95%;
        margin: 0rem;
        padding: 0;
    }
    .sec09 .text_top {
        margin-top: 1rem;
        bottom: 23%;
        right: 4%;
        width: 26%;
        text-align: left;
    }
    .sec09 .text_bottom {
        margin-top: 1rem;
        bottom: 8%;
        left: 4%;
        width: 33%;
        text-align: left;
    }
}