@charset "utf-8";

/*품질보증정책*/
#container .subpage_top_title.index{position: relative;}
#container .subpage_top_title.index .bg{background: url(./img/bg.png) no-repeat bottom center / cover;position: absolute; height: 65%; bottom: 0; left: 0; width: 100%;}
.sub_container.index .box_bann{background: url(./img/bg_index.png) no-repeat center center / cover; border-radius: 8px; padding: 108px 0 108px 483px;}
.sub_container.index .box_bann img{width: 180px; height: auto; margin-bottom: 12px;}
.sub_container.index .box_bann .text1{font-size: 64px; line-height: 1; margin-bottom: 24px; font-weight: bold;}
.sub_container.index .box_bann .text2{font-size: 32px; line-height: 1.3;}
.sub_container.index .box_text .img_car{display: inline-block; margin: 160px auto 120px;}
.sub_container.index .box_text{text-align: center;}
.sub_container.index .box_text .text1{font-weight: bold; font-size: 80px; line-height: 1; margin-bottom: 56px;}
.sub_container.index .box_text .text1 span{color: #3AB6F3;}
.sub_container.index .box_text .text2{line-height: 1.5; word-break: keep-all;}
.sub_container.index .box_text .d-flex{display: flex; gap: 24px;justify-content: center; margin-top: 80px; margin-bottom: 160px;}
.sub_container.index .box_text .d-flex b{display: block; line-height: 1; margin-top: 24px; margin-bottom: 8px;}
.sub_container.index2{width: 100%; height: 1242px; background: url(./img/bg_index3.png) no-repeat center center / cover; padding-top: 160px; text-align: center; margin-bottom: 160px;}
.sub_container.index2 .text1{font-size: 80px; font-weight: bold; line-height: 1.3; margin-bottom: 56px;}
.sub_container.index3{text-align: center;}
.sub_container.index3 .title{font-weight: bold;font-size: 22px; line-height: 1; margin-bottom: 16px;}
.sub_container.index3 .title::before{content: '!'; font-weight: bold;width: 21px; height: 21px; background: black; color: white; margin-right: 8px; display: inline-block; border-radius: 50%;}
.sub_container.index3 .text{margin-bottom: 80px; word-break: keep-all;}
.sub_container.index3 .btns{display: flex; gap: 24px;justify-content: center;}
.sub_container.index3 .btns a{height: 80px; line-height: 80px; font-size: 22px; padding: 0 40px 0; text-align: left; display: inline-block; font-weight: bold; color: white; border-radius: 40px; width: 400px;}
.sub_container.index3 .btns a span{float: right;}
.sub_container.index3 .btns a:first-child{background: #3AB6F3;}
.sub_container.index3 .btns a:last-child{background : #8AD598}


/* 1600px 이하일때 */
@media (max-width: 1600px){
    .sub_container.index .box_bann{background-position: left center !important; background-size: 100%; background-color: #edeef4;padding: 56px 56px 56px 33%;}
}

/* 1400px 이하일때 */
@media (max-width: 1400px){
    .sub_container.index .box_bann .text1{font-size: 42px;}
    .sub_container.index .box_bann img{width: 140px;}
    .sub_container.index .box_text .img_car{width: 80%;}
    .sub_container.index .box_bann .text2{word-break: keep-all;}
    .sub_container.index .box_bann .text2{font-size: 24px;}
    .sub_container.index .box_text .text1{font-size: 56px;}
    .sub_container.index .box_text .d-flex{gap: 16px; width: 90%; margin: 80px auto 160px;}
    .sub_container.index .box_text .d-flex div img{width: 100%;}
    .sub_container .main_title{word-break: keep-all;}
    .sub_container.index2 .text1{font-size: 52px; word-break: keep-all; line-height: 1.2;}
}

/* 900px 이하일때 */
@media (max-width: 900px){
    .sub_container.index .box_text .img_car{width: 100%;}
    .sub_container.index .box_text .d-flex{width: 100%; margin-bottom: 100px;}
    .sub_container.index .box_text .d-flex div{font-size: 16px;}
    .sub_container.index .box_text .d-flex div b{font-size: 18px; margin-bottom: 0;}
    .sub_container.index .box_bann .text1{font-size: 32px;}
    .sub_container.index .box_bann .text2{font-size: 18px;}
    .sub_container.index .box_bann img{width: 120px;}
    .sub_container.index .box_text .text1{font-size: 44px; line-height: 1.1; margin-bottom: 24px; word-break: keep-all;}
    .sub_container.index2 .text1{font-size: 44px; margin-bottom: 24px;}
    .sub_container.index .box_text .img_car{margin: 120px auto 80px;}
    .sub_container.index2{padding-top: 100px; height: 820px;}
    .sub_container.index3 .btns a{font-size: 16px; height: 60px; line-height: 60px;}
    .sub_container.index3 .text{font-size: 16px;}
    .sub_container.index3 .title{font-size: 20px;}
    .sub_container.index .box_text .text2{font-size: 16px; line-height: 1.3;}
    #container .subpage_top_title.index .bg{height: 70%;}
}

/* 700px 이하일때 */
@media (max-width: 700px){
    .sub_container.index .box_bann{background: url(./img/bg_index_mo.png) no-repeat top -20px center #f2f3f5 !important; background-size: 300px auto !important; padding: 284px 56px 56px; text-align: center;}
    .sub_container.index .box_text .text1{font-size: 38px; margin-bottom: 16px;}
    .sub_container.index2{margin-bottom: 100px;}
    .sub_container.index3 .btns{gap: 16px;}
}

/* 500px 이하일때 */
@media (max-width: 500px){
    .sub_container.index .box_bann .text1{font-size: 28px; margin-bottom: 12px;}
    .sub_container.index .box_bann{font-size: 28px; margin-bottom: 12px;background-size:240px auto !important;padding: 224px 32px 40px;}
    .sub_container.index .box_text .img_car{margin-top: 100px; margin-bottom: 40px;}
    .sub_container.index2 .text1{font-size: 38px;}
    .sub_container.index2{height: 720px;}
    .sub_container.index3 .text{margin-bottom: 56px;}
    .sub_container.index3 .btns a{padding: 0 24px 0;}
    .sub_container.index .box_text .d-flex{flex-direction: column; gap: 32px;}
}

/* 400px 이하일때 */
@media (max-width: 400px){
    .sub_container.index3 .btns{gap: 8px;flex-direction: column; width: 100%;}
    .sub_container.index3 .btns a{width: 100%;}
    .sub_container.index2{background-position: center bottom !important; background-size: 140% !important; background-color: #a4c6f3; height: 640px;}
    .sub_container.index2 .text1{font-size: 32px;}
    .sub_container.index .box_text .text1{font-size: 32px;}
    .sub_container.index .box_bann{padding-left: 24px; padding-right: 24px;}
    .sub_container.index .box_bann .text1{font-size: 20px; margin-top: 8px;}
    .sub_container.index .box_text .d-flex div b{font-size: 16px;}
    .sub_container.index3 .text{margin-bottom: 32px;}
    .sub_container.index3 .text br{display: none;}
    #container .subpage_top_title.index .bg{height: 60%;}
}