@import url('https://fonts.googleapis.com/css2?family=Zen+Maru+Gothic&display=swap');

html {
    font-family: "Zen Maru Gothic", serif;
    font-style: normal;
    margin: 0;
    padding: 0;
}
* {
    box-sizing: border-box;
    text-decoration: none;
    margin: 0;
    padding: 0;
}
body {
    width: 100%;
    margin: 0;
    padding: 0;
    scroll-behavior: smooth;
    transition: all 1ms ease 0s;
    background-color: #fff;
    background-image: url(../assets/common/bg-img.jpg);
    background-size: 100%;
    background-position: center;
    background-repeat: repeat;
    color: #333;
    font-family: "Zen Maru Gothic", serif;
    font-style: normal;
}
/* section {
    position: relative;
    z-index: 1 !important;
} */
*, :before, ::after {
    background-repeat: no-repeat;
    box-sizing: inherit;
}
div {
    margin: 0px;
    padding: 0px;
}
ul {
    list-style-type: none;
}
ol {
    margin-left: 40px;
}
a {
    text-decoration: none;
    color: inherit;
}
img {
    width: 100%;
    vertical-align: top;
}

/* OVERFLOW */
/* .overflow {
    overflow-x: hidden;
} */
::selection {
    background-color: rgb(171, 89, 7);
    color: #fefefe;
}

/* LAYOUT */
.section, .w-1000, .w-1100, .w-1100, .w-1040, .w-1200, .w-1260, .w-1400, .w-1520, .w-1555, .w-1600 {
    margin: 0 auto;
    width: 100%;
}

.section {
    max-width: 1920px;
}
.w-1000 {
    max-width: 1000px;
}
.w-1100 {
    max-width: 1100px;
}
.w-1040 {
    max-width: 1040px;
}
.w-1200 {
    max-width: 1200px;
}
.w-1260 {
    max-width: 1260px;
}
.w-1400 {
    max-width: 1400px;
}
.w-1520 {
    max-width: 1520px;
}
.w-1555 {
    max-width: 1555px;
}
.w-1600 {
    max-width: 1600px;
}

/* DISPLAY */
.display {
    display: flex;
    align-items: center;
}
.df {
    display: flex;
}
.ai-e {
    align-items: end;
}
.m-0a {
    margin: 0 auto;
}
.jc-c {
    justify-content: center;
}
.jc-sa {
    justify-content: space-around;
}
.jc-sb {
    justify-content: space-between;
}
.jc-e {
    justify-content: end;
}
.jc-s {
    justify-content: start;
}
.fd-col {
    flex-direction: column;
}
.ta-c {
    text-align: center;
}
.ta-s {
    text-align: start;
}
.ta-e {
    text-align: end;
}
.reverse {
    flex-direction: row-reverse;
}
.relative {
    position: relative;
}
.absolute {
    position: absolute;
}

/* FONTS */
.light {
    color: #fff;
}
.orange {
    color: #EB5607;
}

.f-12 {
    font-size: clamp(12px, 0.5vw, 14px);
}
.f-16, .f-16m, .f-16b {
    font-size: clamp(14px, 0.83vw, 16px);
}
.f-24, .f-24m, .f-24b {
    font-size: clamp(18px, 1.25vw, 24px);
}
.f-32b {
    font-size: clamp(22px, 1.67vw, 32px);
}
.f-36, .f-36b {
    font-size: clamp(24px, 1.8vw, 36px);
}

.f-12, .f-16, .f-24, .f-36 {
    font-weight: 400;
}
.f-16m, .f-24m {
    font-weight: 500;
}
.f-16b, .f-24b, .f-32b, .f-36b {
    font-weight: 700;
}

.ls-10 {
    letter-spacing: 0.1em;
}
.ls-20 {
    letter-spacing: 0.2em;
}

.lh-27 {
    line-height: 27px;
}

/* --------------------------------------------------- PAGE PROPERTIES --------------------------------------------------- */

/* HEADER */
header {
    width: 100%;
    position: sticky;
    top: 0;
    z-index: 1000;
}
.header__content {
    padding-top: 30px; 
    margin: 0 200px; 
}

.logo {
    max-width: 285px;
    max-height: 95px;
}

.header__layout {
    padding: 20px 50px;
    background-color: #fff;
    margin: 0 auto;
    border-radius: 50px;
}

.header__nav {
    z-index: 999;
}
.nav__layout {
    gap: 100px;
    margin-right: 150px;
}
.nav__layout li {
    border-bottom: 1px solid transparent;
    transition: border-bottom 0.3s ease;
}
.nav__layout li:hover {
    border-bottom: 1px solid #333;
    transition: border-bottom 0.3s ease;
}

/* BURGER MENU */
.burger-menu {
    display: flex;
    cursor: pointer;
    justify-content: center;
    align-items: center;
    padding: 5px;
    position: absolute; 
    right: 0; 
    z-index: 999; 
}
.burger-icon {
    cursor: pointer;
    display: flex;
    flex-direction: column;
    width: 30px;
    height: 20px;
    justify-content: space-between;
    position: relative;
    align-items: center;
}
.bar {
    width: 25px;
    height: 3px;
    background-color: #333;
    transition: transform 0.4s ease-in-out;
}
.bar-01.active {
    transform-origin: 0% 0%;
    transform: rotate(45deg);
    background-color: #fff;
}
.bar-02.active {
    transform: scaleY(0);
    background-color: #fff;
}
.bar-03.active {
    transform-origin: 0% 100%;
    transform: rotate(-45deg);
    background-color: #fff;
}
.show-nav .burger-menu .bar-01 {
    transform: rotate(45deg);
}
.show-nav .burger-menu .bar-02 {
    transform: scaleY(0);
}
.show-nav .burger-menu .bar-03 {
    transform: rotate(-45deg);
}

/* BURGER MENU NAV */
.nav-r__content {
    display: none;
    background-color: #FFBFBF;
    border-radius: 50px;
    max-width: 610px;
    /* max-height: 808px; */
    /* max-height: 74.81vh; */
    max-height: 815px;
    padding: 80px 0;
    gap: 40px;
}
.nav-r__content .nav__layout {
    max-width: 396px;
    width: 100%;
    gap: 40px;
    margin: 0 auto;
}
.nav-r__content .nav__layout li {
    width: fit-content;
}
.nav-r__content .nav__layout li:hover {
    border-bottom: 1px solid #fff;
    transition: border-bottom 0.3s ease;
}

.nav-r__content.show-nav {
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    display: flex;
    height: fit-content;
    overflow-y: auto;
    scroll-behavior: smooth;
    z-index: 998;
}

.nav-r__content.show-nav::-webkit-scrollbar {
    width: 8px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.nav-r__content.show-nav::-webkit-scrollbar-track {
    background: transparent; 
    border-radius: 10px;
}

.nav-r__content.show-nav::-webkit-scrollbar-thumb {
    background-color: #cc8a8a; 
    border-radius: 10px;
    border: 2px solid transparent; 
    background-clip: content-box;
}

.nav-r__content.show-nav::-webkit-scrollbar-thumb:hover {
    background-color: #a06f6f;
}

.nav-r__content.show-nav {
    scrollbar-width: thin;
    scrollbar-color: #cc8a8a transparent;
}

/* OPACITY FILTER */    
.logo__link, .faq__list .item .question i, .faq__list .item .answer i,
.blog__link, .f-socials a, .f-nav__layout1 li, .f-nav__layout2 li, .f-nav__layout3 li,
.page-numbers.arrow, .checkbox-label a, .sitemap__links li a {
    transition: filter 0.3s ease, opacity 0.3s ease;
}
.logo__link:hover, .faq__list .item .question i:hover, .faq__list .item .answer i:hover,
.blog__link:hover, .f-socials a:hover, .f-nav__layout1 li:hover, .f-nav__layout2 li:hover, .f-nav__layout3 li:hover,
.page-numbers.arrow:hover, .checkbox-label a:hover, .sitemap__links li a:hover {
    filter: brightness(1);
    opacity: 0.7;
}

/* --------------------------------------------------- MV PROPERTIES --------------------------------------------------- */

.mv {
    background-image: url(../assets/common/mv-bg.png);
    background-position: bottom;
    background-size: 100% 487px;
    background-repeat: no-repeat;
    position: relative;
    z-index: -1;
}
.mv__content {
    max-width: 1920px;
    width: 100%;
    height: 785px;
    margin: 0 auto;
    z-index: -1;
}
.dc-mv {
    max-width: 41px;
    max-height: 45px;
    left: 325px;
    bottom: 573px;
}
.mv__text {
    max-width: 448px;
    left: 85px;
    bottom: 229px;
    gap: 100px;
}
.mv__slider {
    max-width: 1350px;
    width: 100%;
    right: 0;
    bottom: 40px;
}

/* --------------------------------------------------- SECTION PROPERTIES --------------------------------------------------- */

/* SLIDER */
.sec_slider {
    width: 100%;
}
.sec_slider .sec-slider .slick-slide:nth-child(odd) {
    padding-top: 8px;
}

.sec-slider .slick-slide {
    width: 500px !important;
    margin-right: 30px !important;
}
.sec-slider .slick-slide img {
    max-width: 500px;
    max-height: 500px;
}
.sec-slider .slick-slide:nth-child(odd) {
    margin-bottom: 140px;
}
.sec-slider .slick-slide:nth-child(even) {
    margin-top: 140px;
}

.sec-dc1, .sec-dc2, .sec-dc3, .sec-dc4 {
    width: 62px;
    height: 55px;
    z-index: 1;
    top: -8px;
}
.sec-dc1 {
    content: url(../assets/common/bg05.png);
}
.sec-dc2 {
    content: url(../assets/common/bg06.png);
}
.sec-dc3 {
    content: url(../assets/common/bg07.png);
}
.sec-dc4 {
    content: url(../assets/common/bg09.png);
}

/* WRAPPER */
.page-wrapper {
    padding: 100px 0;
    gap: 100px;
}

/* BUTTONS */
.btn-more i, .btn-list i, .btn-save i, .btn-edit i, .btn-submit i, .btn-index i {
    font-size: clamp(12px, 0.5vw, 14px);
}
.btn-phone i, .btn-mail i {
    font-size: clamp(18px, 1.25vw, 24px);
}

.btn-contact, .btn-more, .btn-phone, .btn-mail, .btn-list,
.btn-save, .btn-edit, .btn-submit, .btn-index {
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
    transition: background-color 0.3s ease, color 0.3s ease;
}
.btn-contact, .btn-more, .btn-phone, .btn-mail, .btn-list,
.btn-save, .btn-edit, .btn-index {
    background-color: #F49C00;
    border: 1px solid #F49C00;
}
.btn-more.white {
    background-color: #fff;
    color: #F49C00;
    box-shadow: none;
}
.btn-submit {
    background-color: #EB5607;
    border: 1px solid #EB5607;
}

.btn-contact, .btn-more, .btn-list {
    width: fit-content;
}

.btn-phone, .btn-mail, .btn-save, .btn-edit, .btn-submit, .btn-index {
    border-radius: 20px;
}
.btn-contact, .btn-list {
    border-radius: 50px;
}

.btn-contact {
    padding: 10px 50px;
}
.btn-more {
    padding: 5px 30px;
    gap: 10px;
    border-radius: 15px;
}
.btn-phone, .btn-mail {
    width: 400px;
    height: 45px;
    gap: 15px;
}
.btn-list {
    padding: 10px 40px;
    gap: 30px;
}
.btn-save, .btn-edit, .btn-submit, .btn-index {
    font-family: "Zen Maru Gothic", serif;
    width: 270px;
    height: 46px;
    gap: 20px;
}

.btn-contact:hover, .btn-more:hover, .btn-phone:hover, .btn-mail:hover, .btn-list:hover,
.btn-save:hover, .btn-edit:hover, .btn-index:hover {
    background-color: #fff;
    color: #F49C00;
}
.btn-more.white:hover {
    background-color: #F49C00;
    color: #fff;
}
.btn-submit:hover {
    background-color: #fff;
    color: #EB5607;
}

/* TEXT */
.sec-head {
    gap: 10px;
}
.sec-head, .sec-p {
    margin: 10px;
}

/* FOOTER */
.footer__content {
    gap: 100px;
    padding-bottom: 60px;
}

.sec-footer {
    gap: 40px;
}
.sec-footer__content {
    padding-bottom: 20px;
    border-bottom: 0.5px solid #F49C00;
}
.sec-footer__layout {
    margin: 0 200px;
}
.f-logo img {
    max-width: 284px;
}
.f-socials {
    gap: 30px;
}
.f-socials a i {
    font-size: clamp(18px, 1.25vw, 24px);
    color: #F49C00;
}
.f-nav nav {
    gap: 100px;
}
.f-nav__layout1, .f-nav__layout2, .f-nav__layout3 {
    width: fit-content;
    gap: 20px;
}

/* CONTACT */
.sec-contact__footer {
    gap: 50px;
}
.sec-contact__footer .text {
    gap: 20px;
}
.sec-contact__footer .buttons {
    gap: 40px;
    flex-wrap: wrap;
}

/* DECOR */
.dc-tops1-1, .dc-abouts1-3 {
    max-width: 72px;
    max-height: 71px;
}
.dc-tops1-2, .dc-tops2-3, .dc-abouts1-1, .dc-service-2 {
    max-width: 58px;
    max-height: 64px;
}
.dc-tops1-3, .dc-tops2-2, .dc-abouts1-2 {
    max-width: 70px;
    max-height: 62px;
}
.dc-tops2-1, .dc-service-1 {
    max-width: 89px;
    max-height: 89px;
}
.dc-tops3-1, .dc-flow-1, .dc-flow-3, .dc-flow-5 {
    max-width: 117px;
    max-height: 104px;
}
/* ===== */
.dc-tops1-1 {
    left: -25px;
    bottom: -37px;
}
.dc-tops1-2 {
    top: 0;
    right: 190px;
}
.dc-tops1-3 {
    right: 355px;
    bottom: 44px;
}
.dc-tops2-1 {
    left: 47.5px;
    bottom: 268.75px;
}
.dc-tops2-2 {
    top: 534px;
    left: 644.5px;
}
.dc-tops2-3 {
    bottom: -64px;
    right: 0;
}
.dc-tops3-1 {
    top: 0;
    left: -82.5px;
}
/* ===== */
.dc-abouts1-1 {
    top: 0;
    right: 190px;
}
.dc-abouts1-2 {
    top: 447px;
    right: 371px;
}
.dc-abouts1-3 {
    top: 537px;
    left: -25px;
}
/* ===== */
.dc-service-1 {
    left: -43px;
    bottom: -36px;
}
.dc-service-2 {
    right: 24px;
    bottom: -31px;
}
/* ===== */
.dc-flow-1 {
    top: 0;
    left: -83px;
}
.dc-flow-2 {
    max-width: 122.95px;
    max-height: 247.95px;
    left: -21.05px;
    bottom: -180px;
    z-index: 2;
}
.dc-flow-3 {
    top: 0;
    right: -35px;
}
.dc-flow-4 {
    max-width: 125.86px;
    max-height: 254.95px;
    right: -26.14px;
    bottom: -180px;
    z-index: 2;
}
.dc-flow-5 {
    top: 0;
    left: -51.14px;
}

/* --------------------------------------------------- INDEX PROPERTIES --------------------------------------------------- */

.index-sec01__layout .img img, .index-sec03__layout .img img {
    max-width: 700px;
    max-height: 580px;
}
.index-sec01__layout .desc, .index-sec03__layout .desc {
    gap: 20px;
}
.index-sec01__layout, .index-sec03__layout {
    gap: 50px;
}

/* SEC01 */
.index-sec01__layout .desc {
    max-width: 830px;
}

/* SEC02 */
.index-sec02__layout .desc {
    top: 162px;
    left: 0;
    gap: 35px;
}
.index-sec02__layout .img img.stack {
    max-width: 1169px;
    max-height: 1210px;
    right: 0;
    z-index: -1;
}
.index-sec02__layout .desc {
    max-width: 670px;
}

/* SEC03 */
.index-sec03__content {
    padding: 100px 60px;
    background-color: #FFBFBF;
    border-radius: 50px;
}
.index-sec03__layout .desc {
    max-width: 685px;
}

/* SEC04 */
.index-sec04__layout {
    gap: 100px;
}

/* SEC05 */
.index-sec05__layout {
    gap: 50px;
}

/* --------------------------------------------------- ABOUT PROPERTIES --------------------------------------------------- */

/* SEC01 */
.about-sec01__layout {
    gap: 50px;
}
.about-sec01__layout .img img {
    max-width: 1000px;
    max-height: 600px;
    margin: 0 auto;
}

/* SEC02 */
.about-sec02__layout {
    gap: 50px;
}
.about-sec02__layout .map {
    width: 770px;
    height: 820px;
}
.about-sec02__layout .map iframe {
    width: 100%;
    height: 100%;
}
.about-sec02__layout .info {
    max-width: 760px;
    gap: 30px;
}
.about-sec02__layout .info table {
    max-width: 540px;
    width: 100%;
    border-collapse: separate; 
    border-spacing: 0; 
}
.about-sec02__layout .info table tr {
    padding-bottom: 30px;
    gap: 20px;
}
.about-sec02__layout .info table tr.last {
    padding-bottom: 0;
}
.about-sec02__layout .info table tr th {
    width: 200px;
}
.sublist li::before {
    content: "- ";
}

/* --------------------------------------------------- SERVICE PROPERTIES --------------------------------------------------- */

.service__layout, .service__layout .item {
    gap: 50px;
}
.service__layout .item .img {
    max-width: 950px;
    max-height: 600px;
}
.service__layout .item .desc {
    max-width: 600px;
    gap: 35px;
}

/* --------------------------------------------------- FLOW PROPERTIES --------------------------------------------------- */

.flow__layout {
    gap: 100px;
}
.flow__process {
    width: 100%;
    border-radius: 50px;
}
.flow__process.first {
    background-color: #FFBFBF;
}
.flow__process.second {
    background-color: #F49C00;
    z-index: -1;
}
.flow__process.third {
    background-color: #FFF173;
    z-index: -2;
}

.flow__process .container {
    max-width: 1400px;
    margin: 0 auto;
    gap: 50px;
    padding: 100px 50px;
}
.flow__process .container .head {
    width: 100%;
    gap: 15px;
}
.flow__process .container .head .num {
    width: 60px;
    height: 60px;
    border: 1px solid #EB5607;
    background-color: #fff;
    border-radius: 50%;
}
.flow__process .container .text {
    max-width: 1348px;
    width: 100%;
}
.flow__process .container .img img {
    max-width: 1000px;
    max-height: 600px;
}

/* --------------------------------------------------- FAQ PROPERTIES --------------------------------------------------- */

.faq__layout {
    gap: 100px;
}

.faq__head .sec-head {
    padding: 50px 0;
    background-color: #EB5607;
    margin: 0 !important;
}
.faq__list {
    max-width: 1073px;
    width: 100%;
    margin: 0 auto;
}

.faq__list .item .question, .faq__list .item .answer {
    padding: 30px 0;
    width: 100%;
    border-bottom: 0.5px solid #EB5607;
}
.faq__list .item .question, .faq__list .item .answer .text {
    gap: 100px;
}
.faq__list .item .question i, .faq__list .item .answer i {
    color: #EB5607;
    font-size: clamp(18px, 1.25vw, 24px);
}

.faq__list .item .question p {
    max-width: 823px;
    width: 100%;
}
.faq__list .item .answer {
    display: none;
    gap: 50px;
}
.faq__list .item .answer p {
    max-width: 814px;
    width: 100%;
}
.faq__list .item .answer h6 {
    margin-left: 70px;
}

/* --------------------------------------------------- BLOG PROPERTIES --------------------------------------------------- */

.blog__content {
    gap: 100px;
}

/* LIST */
.blog__list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 50px 30px;
}
.blog__link {
    gap: 30px;
}
.blog__link img {
    max-width: 400px;
    max-height: 400px;
    object-fit: cover;
    border-radius: 20px;
}
.blog__link .desc {
    gap: 10px;
}

/* PAGINATION */
.pagination {
    /* margin: 20px auto; */
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 2vw;
}
.page-numbers {
    display: inline-block;
    margin: 0 10px;
    text-decoration: none;
    border: 1px solid transparent;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    padding: 0;
    cursor: pointer;
    color: #F49C00;
    transition: background-color 0.3s, border 0.3s ease;
    font-size: clamp(14px, 0.83vw, 16px);
    font-family: "Zen Maru Gothic", serif;
}

.page-numbers:not(.arrow):hover, 
.page-numbers:not(.arrow).current {
    background-color: #F49C00;
    color: #fff;
}

/* DETAIL */
.detail__layout {
    gap: 30px;
}
.detail__layout img {
    width: 100%;
    height: auto;
}
.detail__layout .desc {
    gap: 10px;
}

/* --------------------------------------------------- CONTACT PROPERTIES --------------------------------------------------- */

.form__btn1, .form__btn2 {
    padding-top: 100px;
}
.form__btn2 {
    gap: 100px;
}

.form__layout {
    gap: 30px;
}

/* FORM */
.form__information.first {
    border-top: 0.5px solid rgba(206, 182, 107, 0.20);
}
.form__information {
    border-bottom: 0.5px solid rgba(206, 182, 107, 0.20);
    padding: 30px 0 ;
}
.form__information .df.fd-col {
    gap: 5px;
}
.form__information p {
    /* max-width: 760px; */
    max-width: 700px;
    overflow-wrap: break-word;
    white-space: normal;
}
.form__important {
    margin-right: 30px;
    background-color: #BF0000;
    width: fit-content;
    height: fit-content;
    padding: 5px 10px;
}
.form__head {
    width: 312px;
}
input[type="text"], input[type="email"], .textarea {
    padding: 10px;
    font-size: clamp(12px, 0.83vw, 16px);
    font-family: "Zen Maru Gothic", serif;
    border: 1px solid #F49C00;
}
input[type="text"], input[type="email"], .radio-container {
    width: 400px;
}
.checkbox-container {
    flex-wrap: wrap;
}
.textarea {
    width: 700px;
    height: 130px;
    padding: 10px;
    resize: none;
    overflow: auto;
    flex-wrap: wrap !important;
}
.radio-container, .checkbox-container {
    gap: 20px;
    padding: 10px;
}
input[type="radio"] { 
    margin-right: 10px;
}
.checkbox-label a {
    text-decoration: underline;
    color: #BF0000;
}

/* FINISH & 404 */
.end__content {
    gap: 100px;
}
.end__text {
    gap: 50px;
}

/* --------------------------------------------------- SITEMAP PROPERTIES --------------------------------------------------- */

.sitemap__links, .sitemap__links li a {
    gap: 30px;
}
.sitemap__links, .sitemap__links li a p {
    max-width: 320px;
    width: 100%;
}

/* --------------------------------------------------- POLICY PROPERTIES --------------------------------------------------- */

.policy__content, .policy__list {
    gap: 30px;
}
.policy__article {
    gap: 20px;
}

/* --------------------------------------------------- RESPONSIVE PROPERTIES --------------------------------------------------- */

/* MV CUT */
@media screen and (max-width: 1900px) {

    .mv {
        height: auto;
        display: flex;
        align-items: center;
        padding-top: 10vh;
    }
    .mv__content {
        margin: auto auto 0 auto;
        height: auto;
    }
    .mv__layout {
        flex-direction: column;
        gap: 60px;
    }
    .mv__text, .mv__slider {
        position: relative;
        bottom: 0;
    }
    .mv__text {
        left: 0;
        gap: 6vh;
        text-align: center;
    }
    .mv__slider {
        right: 0;
    }
    
}

/* LARGE SCREEN */
@media screen and (max-width: 1600px) {

    /* HEADER */
    .header__content {
        margin: 0 3vw;
    }

    /* NAV */
    .nav-r__content {
        max-height: 85vh;
    }
    .nav-r__content .nav__layout {
        margin: 10vh auto 0 auto;
        /* padding-top: 8vw; */
        width: 80%;
    }
    .nav__layout {
        gap: 5vw;
        margin-right: 10vw;
    }

    .nav-r__content {
        left: 3vw !important;
    }

    /* ========== SECTION ========== */
    /* FOOTER */
    .sec-footer__layout {
        margin: 0 auto;
        width: 90%;
    }

    /* TITLE */
    .sp-title {
        width: 90%;
        margin: 0 auto;
    }

    /* LAYOUT */
    .index-sec01__content, .index-sec02__content, .index-sec03, .index-sec05__content,
    .about-sec01__content, .about-sec02__content, .service__content, .flow__content,
    .blog__content, .form__content, .end__content, .sitemap__content, .policy__content {
        width: 90%;
    }

    /* ========== MV ========== */
    .mv {
        background-size: 100% 50vh;
    }
    .mv__text {
        max-width: 90%;
        margin: 0 auto;
    }

    /* ========== DECOR ========== */
    .dc-tops1-3 {
        right: 14vw;
        bottom: -5vh;
    }
    .dc-tops2-1 {
        bottom: 34vh;
    }
    .dc-tops2-2 {
        top: 66vh;
        left: 24vw;
    }
    .dc-tops3-1 {
        left: -3vw;
    }
    .dc-abouts1-1 {
        right: 9vw;
    } 
    .dc-flow-1 {
        left: -60px;
    }

    /* ========== INDEX ========== */
    /* SEC02 */
    .index-sec02__layout .desc {
        top: 15vh;
        width: 40vw;
    }
    .index-sec02__layout .img img.stack {
        width: 65vw;
    }
    
    /* ========== ABOUT ========== */
    .about-sec01__layout .img img {
        width: 80%;
    }
    .about-sec02__layout .map {
        max-width: 770px;
        width: 45vw;
        max-height: 820px;
        height: 85vh;
    }

    /* ========== SERVICE ========== */
    .service__layout .item .img {
        width: 50vw;
    }

    /* ========== FORM ========== */
    .textarea {
        max-width: 700px;
        width: 48vw;
    }

}

/* MEDIUM SCREEN */
@media screen and (max-width: 1025px) {

    /* ========== SECTION ========== */
    /* SLIDER */
    .sec-slider .slick-slide {
        width: 40vw !important;
    }

    /* FOOTER */
    .f-nav nav {
        gap: 30px;
    }

    /* ========== DECOR ========== */
    .dc-mv, .dc-tops2-1, .dc-tops2-2  {
        display: none;
    }
    .dc-abouts1-1 {
        right: 6vw;
    }
    .dc-abouts1-3 {
        top: 47vh;
        left: 5vw;
    }
    .dc-abouts1-2 {
        right: 10vw;
        top: 40vw;
    }

    /* ========== INDEX ========== */
    /* SEC02 */
    .index-sec02__layout .desc {
        top: 7vh;
    }

    /* SEC03 */
    .index-sec03__content {
        padding: 60px;
    }

    /* ========== FAQ ========== */
    .faq__list {
        width: 90%;
    }

}

.r__logo {
    display: none;
}

/* TABLET SCREEN */
@media screen and (max-width: 790px) {

    /* HEADER */
    .header__content {
        margin: 0;
        padding-top: 0;
    }
    .logo {
        width: 25vw;
    }

    .r__logo {
        display: flex;
        position: absolute;
        z-index: 1;
        top: 20px;
        left: 50px;
    }

    /* NAV */
    .nav .nav01, .nav .nav02, .nav .nav03 {
        display: none;
    }
    .nav-r__content {
        max-width: 100%;
        top: 0 !important;
        left: 0 !important;
        border-radius: 0;
        max-height: 100vh;
    }
    .nav-r__content.show-nav {
        position: fixed;
    }
    .nav-r__content .nav__layout {
        max-width: 100%;
        width: 100%;
        text-align: center;
        align-items: center;
        padding-top: 5vh;
        gap: 30px;
    }
    
    /* FONTS */
    .lh-27 {
        line-height: 24px;
    }

    /* ========== MV ========== */
    .mv {
        background-size: 100% 35vh;
    }
    .mv__text {
        gap: 30px;
    }

    /* ========== SECTION ========== */
    /* WRAPPER */
    .page-wrapper {
        padding: 80px 0;
        gap: 60px;
    }

    /* GAPS */
    .index-sec01__layout, .index-sec03__layout, .index-sec04__layout,
    .faq__list .item .question, .faq__list .item .answer .text,
    .faq__list .item .answer, .blog__list, .index-sec05__layout,
    .sec-contact__footer, .sec-contact__footer .buttons, .footer__content,
    .about-sec01__layout, .about-sec02__layout, .service__layout, .service__layout .item,
    .flow__process .container, .flow__layout, .faq__layout,
    .blog__content, .form__btn2, .end__content, .end__text {
        gap: 30px;
    }

    /* FOOTER */
    .footer__content {
        padding-bottom: 30px;
    }
    .f-nav__layout1, .f-nav__layout2 {
        display: none;
    }
    .sec-footer__layout {
        flex-direction: column;
        gap: 30px;
    }
    .f-nav__layout3 {
        align-items: center;
        text-align: center;
    }

    /* ========== DECOR ========== */
    .dc-tops1-2, .dc-tops1-1, .dc-tops1-3, .dc-tops2-3, .dc-tops3-1,
    .dc-abouts1-1, .dc-abouts1-3, .dc-abouts1-2, .dc-service-1,
    .dc-service-2, .dc-flow-1, .dc-flow-3, .dc-flow-5, .dc-flow-2, .dc-flow-4 {
        display: none;
    }

    /* ========== INDEX ========== */
    .index-sec01__layout .img img, .index-sec03__layout .img img {
        width: 80%;
    }
    .index-sec01__layout .img, .index-sec01__btn, .index-sec03__layout .img,
    .index-sec03__btn {
        display: flex;
        justify-content: center;
    }
    
    /* SEC01 */
    .index-sec01__layout {
        flex-direction: column;
    }

    /* SEC02 */
    .index-sec02__layout .img img.stack {
        width: 60vw;
        padding-top: 15vh;
    }
    .index-sec02__layout .desc {
        top: 0;
    }

    /* SEC03 */
    .index-sec03 {
        width: 100%;
    }
    .index-sec03__content {
        padding: 30px 0;
    }
    .index-sec03__layout {
        flex-direction: column;
        width: 90%;
        margin: 0 auto;
    }

    /* ========== ABOUT ========== */
    .about-sec02__layout {
        flex-direction: column;
    }
    .about-sec02__layout .map {
        width: 100%;
        height: 65vh;
    }
    .about-sec02__layout .info {
        width: 100%;
    }

    /* ========== SERVICE ========== */
    .service__layout .item {
        flex-direction: column;
    }
    .service__layout .item .img {
        width: 80%;
    }
    .service__layout .item .desc {
        gap: 20px;
    }

    /* ========== FLOW ========== */
    .flow__process .container {
        padding: 30px;
    }
    .flow__process .container .head .num {
        width: 40px;
        height: 40px;
    }

    /* ========== FAQ ========== */
    .faq__list .item .answer h6 {
        margin-left: 6vw;
    }

    /* ========== BLOG ========== */
    /* LIST */
    .blog__list {
        grid-template-columns: repeat(1, 1fr);
    }
    .blog__item {
        display: flex;
        justify-content: center;
    }
    .blog__link {
        gap: 20px;
    }

    /* ========== FORM ========== */
    .form__btn1, .form__btn2 {
        padding-top: 30px;
    }
    .form__btn2 {
        flex-wrap: wrap;
    }
    /* .textarea {
        width: 400px;
    } */

    .form__information {
        flex-direction: column;
        gap: 20px;
    }
    input[type="text"], input[type="email"], .radio-container, .checkbox-container {
        width: auto;
    }
    .textarea {
        width: -webkit-fill-available;
    }
    .form__head {
        max-width: 312px;
        width: fit-content;
        gap: 20px;
    }
    
}

/* MOBILE */
@media screen and (max-width: 500px) {

    /* HEADER */
    .header__layout {
        padding: 20px;
    }
    .r__logo {
        left: 20px;
    }
    .logo {
        width: 30vw;
    }

    /* ========== SECTION ========== */

    /* SLIDER */
    .sec-slider .slick-slide {
        width: 70vw !important;
    }

    /* FOOTER */
    .sec-contact__footer .buttons {
        flex-direction: column;
        width: 90%;
        margin: 0 auto;
    }

    /* BUTTONS */
    .btn-phone, .btn-mail {
        max-width: 400px;
        width: 88vw;
    }

    /* ========== MV ========== */
    /* .mv__text {
        width: 90%;
        margin: 0 auto;
    } */

    /* ========== INDEX ========== */
    .index-sec01__layout .img img, .index-sec03__layout .img img {
        width: 100%;
    }
    .index-sec02__layout, .index-sec02__layout .desc {
        gap: 30px;
    }

    /* SEC02 */
    .index-sec02__layout {
        flex-direction: column-reverse;
    }
    .index-sec02__layout .desc {
        position: relative;
        width: 100%;
    }
    .index-sec02__layout .img img.stack {
        width: 100%;
        padding-top: 0;
    }

    /* SEC03 */
    .index-sec03__content {
        padding: 30px 0;
    }

    /* ========== ABOUT ========== */
    .about-sec01__layout .img img {
        width: 100%;
    }
    .about-sec02__layout .info table tr {
        flex-direction: column;
        gap: 10px;
    }
    .about-sec02__layout .info table tr th {
        width: 100%;
    }
    .about-sec02__layout .info table tr td {
        margin-left: 7vw;
    }

    /* ========== SERVICE ========== */
    .service__layout .item .img {
        width: 100%;
    }

    /* ========== FLOW ========== */
    .flow__content {
        width: 100%;
    }
    .flow__process .container {
        padding: 50px 0;
        width: 90%;
        margin: 0 auto;
    }

}