/* ===================================================================
 공통
======================================================================*/
/* select 커스텀 */
select::-ms-expand { display: none;}
.select {-o-appearance: none; -webkit-appearance: none; -moz-appearance: none; appearance: none;}
.selectBox {position: relative; width: 120px; height: 48px; border: solid 1px #8b8b8b; background-color: #fff;}
.selectBox .select { width: 100%; height: inherit; background: transparent; border: 0 none; outline: 0 none; padding: 0 16px; position: relative; z-index: 3; color: #8b8b8b; letter-spacing: -0.4px;}
.selectBox .select option { background: #fff; color: #333; padding: 3px 0; font-size: 16px; }
.selectBox .icoArrow {position: absolute; top: -1px; right: 0; z-index: 1; width: 48px;  height: inherit; display: flex; justify-content: center; align-items: center;}
.selectBox .icoArrow i{font-size: 16px; color: #c7c7c7;}
/* page-nav */
.page-nav{display: flex; gap: 8px; justify-content: center; margin-top:40px;}
.page-nav li a{width: 32px; height: 32px; display: flex; justify-content: center; align-items: center; border: 1px solid #333; font-size: 14px; opacity: 0.3; transition: all 0.3s;}
.page-nav li.now a{opacity: 1; background-color: #4eacff; color: #fff; border: unset;}
.page-nav li:hover a{opacity: 1; background-color: #4eacff; color: #fff; border: unset;}
.page-nav li:hover a i{color: #fff;}
/* .section1 .wrap, .section2 .wrap, .section3 .wrap {width:1200px; margin:0 auto;} */
.wrap { width:1200px; margin:0 auto; }
th,td { padding:0 2px; }
.section2 .wrap, .section4 .wrap {width:800px; margin:0 auto;}
@media screen and (max-width: 1200px) { 
    .main-wrap, .wrap {width:100%; padding:0 10px;}
}

@keyframes rotate_image{ 100% { transform: rotate(360deg); } }
@keyframes rotate_image2{ 100% { transform: rotate(-360deg); } }

/* 서브탑 공통 */
.sub-top-tit { height: 280px; text-align: center; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 15px;  background-size: cover; background-position: center; background-repeat: no-repeat;}
.sub-top-tit h2 { font-size: 40px; color: #fff; position: relative; z-index: 1; letter-spacing: 4px;   font-family: 'S-CoreDream-5Medium';}
.sub-top-tit h2::after{position: absolute; width: calc(100% + 30px); height: 24px; opacity: 0.57; background-color: #ffb000; content: ''; bottom: 0; z-index: -1; left: 50%; transform: translateX(-50%);}
.sub-top-tit p { font-size: 16px; color: #fff; letter-spacing: -0.4px;}
.sub-top-map { height: 56px; border-bottom: 2px solid #e4e4e4; background-color: #fff;}
.sub-top-map> .col-group { height: 100%; align-items: flex-start; }
.sub-top-map .home-btn { width: 56px; height: 56px; background: #3b3f56; text-align: center; }
.sub-top-map .home-btn i { font-size: 32px; color: #fff; line-height: 56px; }
.sub-top-map .sub-menu-list { width: 320px; position: relative; }
.sub-top-map .sub-menu-list2 {width:405px;}
.sub-top-map .sub-menu-list li .show { height: 56px; line-height: 56px; padding: 0 32px; font-size: 17px; color: #707070; font-weight: bold; cursor: pointer; transition: .2s; border-right: 1px solid #C9C9C9; }
.sub-top-map .sub-menu-list li:hover .show { background: #E2F8FF; }
.sub-top-map .sub-menu-list li .show i { position: absolute; right: 32px; top: 18px; transition: .2s; }
.sub-top-map .sub-menu-list li.active .show i { transform: rotateX(180deg); }
.sub-top-map .sub-menu-select { position: absolute; width: 100%; z-index: 999; box-shadow: 3px 3px 10px #00000029; display: none; }
.sub-top-map .sub-menu-select li { height: 56px; background: #fff; cursor: pointer; border-bottom: 1px solid #f6f6f6; transition: .2s; }
.sub-top-map .sub-menu-select li a { font-size: 17px; padding: 0 32px; color: #707070; line-height: 56px; letter-spacing: -0.5px; width: 100%; height: 100%; display: block;}
.sub-top-map .sub-menu-select li:hover { background: #F5F5F5; }
.sub-title { padding-top: 40px; padding-bottom: 16px; align-items: baseline; justify-content: space-between; border-bottom: 2px solid #e4e4e4; }
.sub-title h2 { font-size: 30px; letter-spacing: -0.75px; position: relative; font-weight: bold;}
.sub-title h2::after { content: ""; display: block; position: absolute; bottom: -18px; width: 100%; height: 2px; background: #0064A2; }
.sub-title ul { gap: 8px; align-items: center; }
.sub-title ul li a { font-size: 16px; color: #ABABAB; }
.sub-title ul li:last-child a { font-weight: bold; }
.sub-title ul li i { font-size: 18px; color: #ababab; }
.sub-top-smtit{display: flex; flex-direction: column; align-items: center; text-align: center; justify-content: center; min-height: 259px; padding: 72px 0; background-size: cover; background-position: center; gap: 24px; margin-top: 32px}
.sub-top-smtit h3{font-size: 32px;   font-family: 'S-CoreDream-5Medium'; color: #fff;}
.sub-top-smtit p{font-size: 18px; line-height: 1.67; letter-spacing: -0.45px; color: #fff;}
h3.h3-st{text-align: center; font-size: 40px; letter-spacing: -1px; color: #0f102a;   font-family: 'S-CoreDream-5Medium'; position: relative;}
h3.h3-st::after{content: ""; width: 80px; height: 4px; position: absolute; background-color: #ffb000; bottom: -36px; left: 50%; transform: translateX(-50%);}

.ql-editor img {width:auto;}
@media screen and (max-width:768px) {
    .sub-top-tit { height: 104px; }
    .sub-top-tit h2 { font-size: 20px; }
    .sub-top-tit p { display: none; }
    .sub-top-map { height: 40px; border-bottom: 1px solid #e4e4e4; }
    .sub-top-map> .col-group{padding: unset;}
    .sub-top-map .home-btn { width: 40px; height: 40px; }
    .sub-top-map .home-btn i { font-size: 20px; line-height: 40px; }
    .sub-top-map .sub-menu-list { width: calc( 100% / 2 - 20px ); }
    .sub-top-map .sub-menu-list li .show.ft-sm{font-size: 12px;}
    .sub-top-map .sub-menu-list li .show.ft-sm2{font-size: 10px;}
    .sub-top-map .sub-menu-list li .show { height: 40px; line-height:40px; padding: 0 12px; font-size: 14px; }
    .sub-top-map .sub-menu-list li .show i { right: 8px; top: 13px;; }
    .sub-top-map .sub-menu-select li { height: 40px;}
    .sub-top-map .sub-menu-select li a { font-size: 14px; line-height: 40px;  padding: 0 12px;}
    .sub-top-map .sub-menu-select li a.ft-sm{font-size: 12px;}
    .sub-top-map .sub-menu-select li a.ft-sm2{font-size: 11px;}
    .sub-title { padding-top: 16px; padding-bottom: 8px; }
    .sub-title h2 { font-size: 20px; letter-spacing: -0.5px; }
    .sub-title h2::after { bottom: -10px; }
    .sub-title ul { display: none; }
    .sub-top-smtit{height: 158px; margin-top: 15px;}
    .sub-top-smtit h3{font-size: 20px; letter-spacing: -0.5px;}
    .sub-top-smtit p{font-size: 14px; letter-spacing: -0.35px; line-height: 1.57; font-weight: 300;}

    h3.h3-st{font-size: 20px; margin-bottom: 76px;}
    h3.h3-st::after{bottom: -22px; width: 48px;}

}
/* 개인정보 처리방침 */
.policy{padding: 25px 0 52px}
.policy .policy-top{border-top: 2px solid #333;}
.policy .policy-top h2{font-weight: 500; line-height: 2.88; color: #070303;}
.policy .policy-top p{font-size: 10px; font-weight: 500; color: #707070; line-height: 1.5; padding: 15px 0 20px; border-top: 1px solid #e4e4e4;}
.policy .policy-list{display: flex; flex-direction: column; gap: 40px; padding-top: 15px; border-top: 1px solid #e4e4e4; margin-bottom: 52px;}
.policy .policy-list h3{margin-bottom: 8px; font-size: 14px; font-weight: 500; color: #3b3f56;}
.policy .policy-list h4{color: #333;}
.policy .policy-list p{font-size: 10px; font-weight: 500; line-height: 1.5; color: #707070;}
.policy .policy-list p span{color: #333; font-weight: 500;}
.policy .btn-wrap{display: flex; justify-content: center;}
.policy .btn-wrap .up-btn{width: 30px; height: 30px; border-radius: 100%; border: solid 2px #3b3f56; background-color: #fff; display: flex; justify-content: center; align-items: center; outline: unset;}
.policy .btn-wrap .up-btn i{font-size: 26px; color: #3b3f56;}

.m-pops {display:flex; position:fixed; top:15%; left:6%; z-index:1000; }
.m-pop.type01 {width:500px; margin:10px; box-shadow:0px 3px 6px rgba(0,0,0,0.16);}
.m-pop.type01 img {display:block;}
.m-pop.type01 .m-pop-bottom {display:flex; align-items: center; justify-content: space-between; background-color:#555;}
.m-pop.type01 .m-pop-bottom * {color:#fff;}
.m-pop.type01 .m-pop-bottom .btn {padding:6px 20px; text-decoration: underline;}
.m-pop.type01 .m-pop-bottom .btn-close {padding:6px 20px; background-color:#333;}

@media screen and (max-width:1000px) {
    .m-pops {top:50%; left:50%; transform:translate(-50%, -50%);}
    .m-pop.type01 {margin:0; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%);}
}
@media screen and (max-width:500px) {
    .m-pops {width:100%;}
    .m-pop.type01 {width:100%; max-width:calc(100% - 40px);}
}
.ql-editor .ql-video {width:530px; height:300px; margin:0 auto;}
@media screen and (max-width:768px) {
    .ql-editor .ql-video {width:300px; height:170px;}
}

.sub-visual {height:350px; margin-bottom:50px; position:relative;}
.sub-visual .title { width:100%; padding:0 40px; word-break: keep-all; font-size:40px; font-family: "S-CoreDream-9Black"; text-align: center; line-height:50px; text-shadow: 0px 3px 6px rgba(0,0,0,0.2); position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); color:#fff;}
.align-center {text-align: center;}
.page-title.type01 {   margin-bottom:40px; font-family: "S-CoreDream-9Black"; font-size:28px; text-align: center;}
.page-title.type01 .sub {display:block; margin-top:10px; font-family: "S-CoreDream-5Medium"; font-size:22px; opacity:0.52;}

.contents-wrap {flex:auto; padding-bottom:80px;}
.m-table.type01 {width:100%; border-top:2px solid black;}
.m-table.type01 th {padding:20px 0; font-size:18px; font-weight:bold;}
.m-table.type01 td {font-size:16px; padding:20px; text-align: center;}
.m-table.type01 thead tr {border-bottom:1px solid black;}
.m-table.type01 tbody tr {border-bottom:1px solid #e1e1e1;}
.m-input-select.type01  { cursor:pointer; border-radius:0;  -webkit-appearance: none; -moz-appearance: none;  appearance: none; position:relative;}
.m-input-select.type01::-ms-expand { display: none; }

.m-input-select.type01 {position:relative;}
.m-input-select.type01 select {width:100%; height:50px; padding:0px 20px; padding-right:60px; border:1px solid #e1e1e1;  background-color:#fff;
    font-size:16px; cursor:pointer; border-radius:0;  -webkit-appearance: none;  -moz-appearance: none;  appearance: none; border-radius:5px;}
.m-input-select.type01 .fake {width:100%; height:50px; line-height:50px; padding:0px 20px; padding-right:60px; border:1px solid #e1e1e1;  background-color:#fff;
    cursor:pointer; border-radius:0;  -webkit-appearance: none;  -moz-appearance: none;  appearance: none; border-radius:5px;}
.m-input-select.type01:after {content:""; width:13px; height:8px; position:absolute; right:20px; top:50%;
    transform:translateY(-50%); background:url("../images/arrowDown-black.png") no-repeat; background-size:cover;}
.m-input-select.type01 select::-ms-expand { display: none; }
.m-input-select.type01 .count { width:20px; height:20px;position:absolute; top:-10px; right:-7px; font-size:12px; border-radius:100%; text-align: center; color:#fff; background-color:#14785D;}
@media screen and (max-width:1200px){
    .contents-wrap {width:100%;}
    .m-input-select.type01 select {height:50px;}
    .m-input-select.type01 .fake {height:50px; line-height:50px; font-size:16px;;}
}

.m-input-radio input {display:none;}
.m-input-radio label {cursor:pointer;}
.m-input-error {margin-top:4px; font-size:12px; color:red;}
.m-input-radios .m-input-radio {margin-right:10px;}
.m-input-radio.type01 {margin-top:7px;}
.m-input-radio.type01:first-child {margin-top:0;}
.m-input-radio.type01 label {display:block; padding:15px 0; padding-left:50px; position:relative; background-color:#f5f5f5; box-shadow:0px 1px 2px rgba(0,0,0,0.16); transition:background-color .2s;}
.m-input-radio.type01 label:hover {background-color:#E1E1E1;}
.m-input-radio.type01 label:before {content:""; width:14px; height:14px; position:absolute; left:14px; top:50%; transform:translateY(-50%); background:url("../images/icon_circle_gray.png") no-repeat;}
.m-input-radio.type01 input:checked + label:before {background:url("../img/icon_circle_active_gray.png") no-repeat;}
.m-input-radio.type01 input:checked + label {background-color:#E1E1E1;}
.m-input-radio.type01 .m-input-radio-title {display:inline-block;}
.m-input-radio.type01 .m-input-radio-title:first-child {width:140px; position:relative; top:2px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}
.m-input-radio.type01 .m-input-radio-title:nth-child(2) {width:68px; position:relative; top:-2px; text-align:center;}

.m-input-radio.type02 {display:inline-block;}
.m-input-radio.type02:first-child {margin-top:0; margin-left:0;}
.m-input-radio.type02 label { padding-left:40px; position:relative; font-size:18px;}
.m-input-radio.type02 label:before {content:""; width:28px; height:28px; position:absolute; left:0px; top:52%; transform:translateY(-50%); background:url("../images/icon_circle_gray.png") no-repeat;}
.m-input-radio.type02 input:checked + label:before {background:url("../img/icon_circle_active_gray.png") no-repeat;}

.m-input-checkbox input {display:none;}
.m-input-checkbox label {cursor:pointer;}
.m-input-checkboxes.type01 {display:flex; flex-wrap:wrap; margin:-8px;}
.m-input-checkboxes.type01 .m-input-checkbox {margin:8px;}
.m-input-checkboxes.type01 .m-input-checkbox.active label {border-color:#14785D; box-shadow:0px 3px 6px rgba(0,0,0,0.16); color:#14785D;}
.m-input-checkboxes.type01 .m-input-checkbox.active button {border-color:#14785D; box-shadow:0px 3px 6px rgba(0,0,0,0.16); color:#14785D;}
.m-input-checkboxes.type01 label {display:block; min-width:110px; padding:18px;  position:relative; border:1px solid #e1e1e1; text-align: center; color:#999; transition: all .3s; border-radius:5px;}
.m-input-checkboxes.type01 label:hover {border-color:#14785D; box-shadow:0px 3px 6px rgba(0,0,0,0.16); color:#14785D;}
.m-input-checkboxes.type01 button {display:block; min-width:110px; padding:18px;  position:relative; border:1px solid #e1e1e1; text-align: center; color:#999; transition: all .3s; border-radius:5px;}
.m-input-checkboxes.type01 button:hover {border-color:#14785D; box-shadow:0px 3px 6px rgba(0,0,0,0.16); color:#14785D;}
.m-input-checkboxes.type01 input:checked + label {border-color:#14785D; box-shadow:0px 3px 6px rgba(0,0,0,0.16); color:#14785D;}
.m-input-checkboxes.type01 img {margin-left:12px;}
.m-input-checkboxes.type01 .m-input-checkbox.text input { display:block; width:160px; padding:18px;  position:relative; border:1px solid #333; text-align: center; color:#999; transition: all .3s; border-radius:5px;}
.m-input-checkboxes.type01 .m-input-checkbox.text label {display:none;}

@media screen and (max-width:1200px){
    .m-input-checkboxes.type01 {justify-content:flex-start; overflow-x: auto; flex-wrap:nowrap; margin:0; margin-bottom:20px; margin-right:-20px;}
    .m-input-checkboxes.type01 button {padding:12px 18px;}
}

.m-input-checkboxes.type02 {padding:20px 25px; border:1px solid #e1e1e1; border-radius:5px;}
.m-input-checkboxes.type02 .fragment {display:flex; margin-bottom:20px;}
.m-input-checkboxes.type02 .fragment:last-child {margin-bottom:0;}
.m-input-checkboxes.type02 .m-input-checkbox { margin-left:40px; padding-left:30px; position:relative;}
.m-input-checkboxes.type02 .m-input-checkbox:last-child {margin-bottom:0;}
.m-input-checkboxes.type02 .m-input-checkbox label {font-size:16px;;}
.m-input-checkboxes.type02 .m-input-checkbox label:before {content:""; width:16px; height:16px; position:absolute; left:0; top:0px; border:1px solid #696868;}
.m-input-checkboxes.type02 .m-input-checkbox input:checked + label:before {width:16px; height:16px; background-color:#696868;}
.m-input-checkboxes.type02 .link {font-size:16px;; font-weight:500;}

.m-input-checkboxes.type03 { width:300px; min-width:100%; padding:20px; position:absolute; bottom:calc(100% + 20px); right:0; background-color:#fff; z-index:2; border:1px solid #e1e1e1; box-shadow:0px 3px 6px rgba(0,0,0,0.16);}
.m-input-checkboxes.type03 .m-input-checkbox {display:inline-block; position:relative;}
.m-input-checkboxes.type03 .m-input-checkbox label {display:inline-block; margin:10px 16px; padding-left:20px; font-size:16px;;}
.m-input-checkboxes.type03 .m-input-checkbox label:before {content:""; width:20px; height:20px; position:absolute; left:0; top:10px; background:url("../img/checkbox-inactive.png") no-repeat; background-size:100%;}
.m-input-checkboxes.type03 .m-input-checkbox input:checked + label:before {background:url("../img/checkbox-active.png") no-repeat; background-size:100%;}
.m-input-checkboxes.type03 .link {font-size:16px;; font-weight:500;}
.m-input-checkboxes.type03 .btn-close {position:absolute; top:10px; right:16px;}
.m-input-checkboxes.type03 .text {margin:10px 0; font-size:16px;; color:#777; text-align: center;}

@media screen and (max-width:768px){
    .m-input-checkboxes.type03 {min-width:auto; position:fixed; bottom:auto; top:50%; left:50%; right:auto; transform:translate(-50%, -50%);}
}

.bg-primary {background-color:#4eacff !important;}

.m-btn.type01 { padding:10px 20px; font-size:18px; background-color:#696868; color:#fff;}
.m-input-withBtn.type01 {display:flex;}
.m-input-withBtn.type01 .m-input {flex:auto;}
.m-input-withBtn.type01 .m-input-btn {display:flex; align-items:center; justify-content:center; margin-left:12px; font-size:18px; color:#fff; white-space: nowrap;}

.m-input-withBtn.type02 {display:flex;}
.m-input-withBtn.type02 .m-input input {flex:auto;}
.m-input-withBtn.type02 .m-input select {flex:auto;}
.m-input-withBtn.type02 .m-input-btn {margin-left:12px; padding:0 25px; white-space: nowrap; background-color:#333333; color:#fff; border-radius:3px;}

.mt-10 {margin-top:10px;}
.mt-20 {margin-top:20px;}
.mt-30 {margin-top:30px;}
.mt-40 {margin-top:40px;}
.mt-50 {margin-top:50px;}
.mt-60 {margin-top:60px;}

@media screen and (max-width:1200px){
    .m-input-withBtn.type02 .m-input-btn {width:auto; margin-left:4px; padding:0 10px;}
    .m-input-withBtn.type02 .m-input-text {flex:auto;}
}
@media screen and (max-width:1200px) {
    .page-title.type01 {display:none;}
    #main > .wrap {flex-wrap:wrap;}
    .sub-visual {height:200px;}
    .sub-visual .title {font-size:24px; line-height:30px;}
}
@media screen and (max-width:768px) {
    .m-table.type01 td {padding:20px 10px; font-size:14px; line-height:18px;}
    .m-table.type01 th {font-size:16px;}
}

.red {color:red !important;}
.bold {font-weight:bold;}

#main .section1 .banner { width:100%; height:700px; position:relative; background:url("../images/base-banner.png") center no-repeat; background-color:#3552c5;}
#main .section1 .banner .content { position:absolute; left:0; top:50%; transform:translateY(-50%);}
#main .section1 .banner .content .title { margin-bottom:30px; font-size:50px; color:#fff;}
#main .section1 .banner .content .title .point { color:#9AB1FF;}
#main .section1 .banner .content .body { font-size:24px; font-weight:500; color:rgba(255,255,255, 0.64);}
#main .section1 .wrap { height:100%; position:relative;}

@media screen and (max-width:1200px) {
    #main .section1 .banner .content { left:60px; }
    #main .section1 .banner .content .title { word-break: keep-all; line-height:80px; }
    #main .section1 .banner .content .title br { display:none; }
}
@media screen and (max-width:768px) {
    #main .section1 .banner { height:auto; background-size:100%; background-position:bottom right; }
    #main .section1 .banner .content { padding:80px 0; position:static; transform:none; }
    #main .section1 .banner .content .title { margin-bottom:20px; font-size:24px; line-height:34px; }
    #main .section1 .banner .content .body { font-size:16px; opacity:0.9; color:#fff; }
    #main .section1 .banner .content .body br { display:none; }
}

#main .section2 { width:100%; height:800px; position:relative; align-items: center; background:url("../images/base-section2.png") 50% center no-repeat;}
/* #main .section2 .content { position:absolute; left:0; top:50%; transform:translateY(-50%);} */
#main .section2 .wrap { display:flex; align-items: center; justify-content: flex-start; height:100%;}
#main .section2 .title { margin-bottom:24px; font-size:80px;}
#main .section2 .body { margin-bottom:24px; font-size:32px; font-weight:500;}
#main .section2 .body .point { font-weight:700;}
#main .section2 .comment:first-of-type { margin-top:0;}
#main .section2 .comment { margin-top:24px;  font-size:20px; line-height:30px; font-weight:500}
#main .section2 .comment .point { font-weight:700;}
@media screen and (max-width:1200px) {}
@media screen and (max-width:768px) {
    .section2 .wrap { width:100%; margin:0 auto;}
    #main .section2 { height:auto; padding:60px 10px 40px 0; background-size:130%; }
    #main .section2 .title { font-size:40px; font-weight:bold; }
    #main .section2 .body { font-size:20px; word-break: keep-all; }
    #main .section2 .comment { font-size:16px; word-break: keep-all; }
    #main .section2 .comment br { display:none; }
}

#main .section3 { padding:56px 0; background-color:#F5F5F5; letter-spacing:-2px; word-spacing:-1px;  }
#main .section3 .boxes { display:flex;}
#main .section3 .box-wrap { flex:1; position:relative;}
#main .section3 .box-wrap:first-of-type .mark:after { display:none;}
#main .section3 .box-wrap:last-of-type .mark:after { display:none;}
#main .section3 .box .step { margin-bottom:8px; font-size:20px; font-weight:500; color:#335CFF; text-align: center;}
#main .section3 .box .title { margin-bottom:24px; font-size:20px; font-weight:bold; text-align: center;}
#main .section3 .box .mark { display:flex; align-items: center; justify-content: center; width:80px; height:80px; margin:0 auto; margin-bottom:28px; position:relative; border-radius:100%; background-color:#335CFF;}
#main .section3 .box .mark:after { content:""; width:185%; height:3px; position:absolute; top:50%; left:100%; transform:translateY(-50%); background-color:#335CFF;}
#main .section3 .box .body { font-size:16px; text-align: center;}
#main .section3 .box .body .point { font-weight:600; color:#404040;}
@media screen and (max-width:1200px) {
    #main .section3 { padding:60px 0; }
    #main .section3 .boxes { flex-wrap:wrap; margin:-30px -20px; }
    #main .section3 .box-wrap { flex:auto; width:25%; padding:30px 20px; }
    #main .section3 .box .mark:after { display:none; }
}
@media screen and (max-width:768px) {
    #main .section3 .box-wrap { width:100%; }
}
#main .section4 { padding:60px 0; letter-spacing:-2px; word-spacing:-1px; }
#main .section4 .swiper-container { overflow:visible;}
#main .section4 .top { display:flex; align-items: flex-end; justify-content: space-between; margin-bottom:60px;}
#main .section4 .top .title { margin-bottom:24px; font-size:70px;}
#main .section4 .top .body { font-size:28px;}
#main .section4 .top .swiper-btns { display:flex;}
#main .section4 .top .swiper-btn { display:flex; align-items: center; justify-content: center; width:72px; height:72px; margin-left:24px; border-radius:100%; background-color:#dcc4c4;}
#main .section4 .top .swiper-btn i { font-size:32px;}
#main .section4 img { max-width:100%;}
#main .section4 .content { margin-top:32px; padding-right:60px; }
#main .section4 .content .title { margin-bottom:24px; font-size:32px; font-weight:500; color:#000000}
#main .section4 .content .body { font-size:18px; word-break: keep-all;}
@media screen and (max-width:768px) {
    .section4 .wrap { width:100%; margin:0 auto;}
    #main .section4 { margin-bottom:0; padding:40px 0; }
    #main .section4 .top { flex-wrap:wrap; justify-content: center; margin-bottom:20px; }
    #main .section4 .top .left { width:100%; margin-bottom:20px; text-align: center; }
    #main .section4 .top .title { margin-bottom:16px; font-size:40px; }
    #main .section4 .top .body { font-size:16px; }
    #main .section4 .top .swiper-btn { width:40px; height:40px; margin:0 10px; }
    #main .section4 .top .swiper-btn i { font-size:20px; }
    #main .section4 .content { margin:16px 10px; padding-right:30px; }
    #main .section4 .content .title { margin-bottom:12px; font-size:18px; font-weight:bold; line-height:24px; }
    #main .section4 .content .body { font-size:14px; }
}

#main .section5 { width:100%; margin-top:50px; align-items: center; }
#main .section5 .wrap { align-items: center; justify-content: space-between;}
#main .section5 .wrap > .title { flex:0 0 auto; font-size:32px; font-weight:500;}
#main .section5 .boxes { display:flex; flex-wrap:wrap; justify-content: center; align-items: center; margin:0 auto; }
#main .section5 .box-wrap { width:16%; padding:12px 4px;}
#main .section5 .box { display: block; width:100%; padding:20px 12px; font-weight:500; font-size:18px; border:1px solid #e1e1e1; text-align: center; transition: all .3s;}
#main .section5 .box:hover {   background-color:#3552c5; color:#fff;}
@media screen and (max-width:1200px) {
    #main .section5 .wrap { flex-wrap:wrap; }
    #main .section5 .wrap > .title { margin-bottom:40px; }
    #main .section5 .box-wrap { width:15%; }
}
@media screen and (max-width:768px) {
    #main .section5 .box-wrap { width:30%; flex-wrap:wrap; }
    #main .section5 .box { font-size:16px; }
    #main .section5 { margin-bottom:40px; }
}
@media screen and (max-width:530px) {
    #main .section5 .box-wrap { width:50%; flex-wrap:wrap; }
    #main .section5 .box { font-size:16px; }
    #main .section5 { margin-bottom:40px; }
}
.area-guide .banner2 { display:flex; justify-content: center; align-items: center; height:150px; padding:58px; margin-bottom:80px; background:url("../images/banner2-guide.png") no-repeat; background-size: cover; border-radius:20px;}
.area-guide .title { margin-bottom:48px; font-size:56px; line-height:66px; font-weight:bold; color:#fff; text-shadow: 0px 3px 6px rgba(0,0,0,0.16);}
.area-guide .banner { display:flex; align-items: center; height:440px; padding:58px; margin-bottom:80px; background:url("../images/banner-guide.png") no-repeat; background-size: cover; border-radius:24px;}
.area-guide .banner .title { margin-bottom:48px; font-size:56px; line-height:66px; font-weight:bold; color:#fff; text-shadow: 0px 3px 6px rgba(0,0,0,0.16);}
.area-guide .banner .body { font-size:20px; font-weight:500; color:#fff; text-shadow: 0px 3px 6px rgba(0,0,0,0.16);}
.area-guide img.guide1 { display:block; margin:0 auto; max-width:100%;}
.area-guide img.guide2 { display:block; margin:0 15px 0 0; max-width:515px; height:auto;}
.area-guide img.guide3 { display:block; margin:0 3px 0 0; height:auto; max-height:670px; }
.area-guide .m { display:none;}
@media screen and (max-width:768px) {
    .area-guide .banner { height:auto; padding:40px; margin-bottom:20px; text-align: center; }
    .area-guide .banner .title { margin-bottom:16px; font-size:24px; line-height:32px; word-break: keep-all; }
    .area-guide .banner .body { font-size:14px; }
    .area-guide .pc { display:none; }
    .area-guide .m { display:block; }
}