.banner-section {width:100%;position:relative;}
.banner-section-inside {width:100%;max-width: 1800px;margin:90px auto 0 auto;position:relative;}
.banner-header {}
.banner-header h1 {font-family: 'Bebas Neue', cursive;font-size:150px;line-height:150px;font-weight:400;color:#fff;position: absolute;z-index: 1;width: 100%;height: 100%;display: flex;justify-content: center;align-items: center;user-select: none;}

.layer1-section {width:100%;max-width: 1180px;margin:100px auto 100px auto;}
.layer1-header h2 {font-family: 'Bebas Neue', cursive;font-size:60px;line-height:60px;font-weight:400;text-align: center;}
.faq-section {width:100%;padding:60px 0 0 0;margin:0 auto;}

/* accordion */
ul {
    list-style: none;
    padding: 0;
}
ul .inner {
    margin:-20px 0 0 0;
    padding-bottom: 30px;
    overflow: hidden;
    display: none;
    font-size: 21px;
}
ul li a.toggle {
    display: block;
    color: #585d5f;
    transition: background 0.3s ease;
}
ul li a.toggle:hover {
    color: #0080be;
}
.question-text-2 {
    padding:50px 0 50px 0;
    line-height: 34px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    font-size: 30px;
    font-weight: 300;
}
.bordertop {border-top: 1px solid #e7e9ea;}

.question-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    width: 100%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    background-color: #fff;
    text-align: left;
    text-decoration: none;
}
.text-icon {color: #49555e;}
.last-border {width: 100%;height: 1px;background: #e7e9ea;}

.question {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
    padding-right: 40px;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
}
.w-block {
    display: block;
}
.w-inline-block {
    max-width: 100%;
    display: inline-block;
}
.w-clearfix:after,
.w-clearfix:before {
    content: " ";
    display: table;
    grid-column-start: 1;
    grid-row-start: 1;
    grid-column-end: 2;
    grid-row-end: 2;
}
.w-clearfix:after {
    clear: both;
}

.accordion__icon:after, .accordion__icon:before{
    display: block;
    position: absolute;
    right: 0;
    top: 50%;
    content: "";
    width: 18px;
    height: 2px;
    background-color: #585d5f;
    transform: translateY(-50%);
    pointer-events: none;
    transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
    will-change: transform;
    border-radius: 4px;
}

.accordion__icon:before {
    right: 8px;
    width: 2px;
    height: 17px;
    transition-delay: 50ms;
}

.toggle.active .accordion__icon:before {
    transform: translateY(-50%) rotate(-270deg);
}

.toggle.active .accordion__icon:before {
    transform: translateY(-50%) rotate(-270deg);
}

.toggle.active .accordion__icon:after {
    transform: translateY(-50%) rotate(-180deg);
    opacity: 0;
}

.toggle.active .accordion__icon:after {
    transform: translateY(-50%) rotate(-180deg);
    opacity: 0;
}

ul .inner a {color: #585d5f;text-decoration: underline;}
ul .inner a:hover {color: #585d5f;text-decoration: none;}


@media only screen and (min-width: 1190px) and (max-width: 1439px) {
    .question-container {width: 98%;line-height:60px;}
    .w-inline-block {max-width: 94%;display: inline-block;}
    ul .inner {width:95%;}
}
@media only screen and (min-width: 959px) and (max-width: 1189px) {
    .question-container {width: 95%;line-height:60px;}
    .question-text-2 {line-height: 22px;font-size: 20px;padding:20px 0 20px 0;}
    ul .inner {width:95%;font-size: 18px;line-height:22px;margin:20px 0 0 0;padding-bottom: 40px;}
    .w-inline-block {max-width: 94%;display: inline-block;}
}
@media only screen and (min-width: 768px) and (max-width: 958px) {
    .question-container {width: 95%;line-height:60px;}
    .question-text-2 {line-height: 22px;font-size: 18px;padding:20px 0 20px 0;}
    ul .inner {width:95%;font-size: 18px;line-height:22px;margin:20px 0 0 0;padding-bottom: 20px;}
    .w-inline-block {max-width: 94%;display: inline-block;}
}
@media only screen and (min-width: 480px) and (max-width: 767px) {
    .question-container {width: 95%;line-height:60px;}
    .question-text-2 {line-height: 22px;font-size: 18px;padding:20px 0 20px 0;}
    ul .inner {width:95%;font-size: 18px;line-height:22px;margin:20px 0 0 0;padding-bottom: 20px;}
    .w-inline-block {max-width: 96%;display: inline-block;}
}
@media only screen and (min-width: 320px) and (max-width: 479px) {
    .question-container {width: 95%;line-height:60px;}
    .question-text-2 {line-height: 22px;font-size: 18px;padding:20px 0 20px 0;}
    ul .inner {width:95%;font-size: 18px;line-height:22px;margin:20px 0 0 0;padding-bottom: 20px;}
    .w-inline-block {max-width: 96%;display: inline-block;}
}


/* ============================================================================
    responsive
============================================================================ */
@media only screen and (min-width: 1440px) and (max-width: 1799px){
    .banner-header h1 {font-size:120px;}
    .banner-header h1 {width:100%;font-size:120px;line-height:120px;}
}

@media only screen and (min-width: 1190px) and (max-width: 1439px){
    .banner-header h1 {width:100%;font-size:80px;line-height:80px;}

    .layer1-section {margin:70px auto 70px auto;}
    .layer1-header h2 {font-size:40px;line-height:42px;}
    .last-border {width: 95%;}
}

@media only screen and (min-width: 959px) and (max-width: 1189px){
    .banner-header h1 {width:100%;font-size:60px;line-height:60px;}

    .layer1-section {width:95%;max-width: 1180px;margin:70px auto 70px auto;}
    .layer1-header h2 {font-size:40px;line-height:42px;}
    .last-border {width: 95%;}
}

@media only screen and (min-width: 768px) and (max-width: 958px){
    .banner-section-inside {width:100%;max-width: 1800px;}
    .banner-header h1 {width:100%;font-size:60px;line-height:60px;}

    .layer1-section {width:95%;max-width: 1180px;margin:50px auto 50px auto;}
    .layer1-header h2 {font-size:36px;line-height:38px;}
    .last-border {width: 95%;}
}

@media only screen and (min-width: 480px) and (max-width: 767px){
    .banner-section-inside {width:100%;max-width: 1800px;margin:60px auto 0 auto;}
    .banner-header h1 {width:100%;font-size:36px;line-height:36px;}

    .layer1-section {width:95%;max-width: 1180px;margin:20px auto 50px auto;}
    .layer1-header h2 {font-size:36px;line-height:38px;}
    .last-border {width: 95%;}
}

@media only screen and (min-width: 320px) and (max-width: 479px){
    .banner-section-inside {width:100%;max-width: 1800px;margin:60px auto 0 auto;}
    .banner-header h1 {width:100%;font-size:36px;line-height:36px;}

    .layer1-section {width:95%;max-width: 1180px;margin:20px auto 50px auto;}
    .layer1-header h2 {font-size:36px;line-height:38px;}
    .last-border {width: 95%;}
}
