/* s : sec1 */
.sec1 { position:relative; padding:0; }
.sec1 article { width:100%; }
.sec1 .logo_wrap { display: flex; height:80px; gap:0 30px; align-items: center; background:#fff; box-shadow:0 2px 4px #0001; }
.sec1 .logo_wrap .logo {
    width:137px; height:28px;
    padding:0 40px; 
    z-index: 99;
}
.sec1 .logo_wrap ul { width:1450px; height:100%; line-height:80px; }
.sec1 .logo_wrap ul li { text-align:center; }
.sec1 .logo_wrap ul li a { display:inline-block; height:100%; font-size:1rem; font-weight:900; padding:0 25px; position:relative; }
.sec1 .logo_wrap ul li a::after { content:""; width:100%; height:2px; position:absolute; left:0; bottom:0; background:transparent; }
.sec1 .logo_wrap ul li a.on::after { background:#000; }
/* e : sec1 */
/* s : sec2 */
.sec2 { height:217px; display: flex; align-items:center; }
.sec2 article {
    display: flex;
    align-items: center;
    justify-content: space-around;
}
.sec2 h2 { font-size:56px; line-height: 64px; } 
.sec2 .img_wrap { width:35%; }
/* .sec2 .img_wrap img { transform: translateY(5px); } */
/* e : sec2 */
/* s : sec3 */
.sec3 .content_wrap {
    display:grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 0 15px;
}
.sec3 .content-slide p { font-size:16px; font-weight:600; color:#111; }
.sec3 .content-slide h2 { 
    font-size:24px;
    /* font-family: 'youandiNewHB'!important; */
    font-weight:bold;
    padding:10px 0;
    position: relative;
    z-index: 99;
    color:#000;
    /* animation: textEffect 1s infinite linear; */
}
.sec3 .content-slide  {
    padding:20px 0;
    background:#fff;
    border-radius:10px;
    display: flex;
    flex-flow: column;
    justify-content: center;
    align-items: center;
    box-shadow:0 0 10px #ddd5;
    margin-bottom:20px; 
}
.sec3 .content-slide img { 
    width:109px; height:auto !important;
    padding:12px 0;  
    margin:0 auto;      
}
.sec3 .content-slide span { 
    display:flex;
    flex-flow: nowrap;
    justify-content: center;
    align-items:center;
    margin:10px auto 20px; 
    height:22px;
    line-height: 22px;
    padding:0 20px;
    color:#0070F0; 
    font-size:16px;
    font-weight: 900;
    letter-spacing: 0;
}
.sec3 .content-slide span i {
    display: inline-block;
    width:38.4px; height:38.4px;
    background: url("/card/best_1/best_1_gift(2).png") center center/contain no-repeat; 
}
.sec3 .content-slide ul { 
    display :flex;
    flex-flow:column;
    justify-content: flex-start;
    width:85%; 
    height:250px;
    margin:0 auto 15px; 
}
/* .sec3 .content-slide:nth-child(1) ul { height:210px; }  */
.sec3 .content-slide ul li {
    display: flex;
    justify-content: space-between;
    padding:15px 0;
    border-bottom:1px solid #eee;
}
.sec3 .content-slide ul .none,
.sec3 .content-slide ul li:last-child { border:none; }
.sec3 .content-slide ul li p { font-size:16px; font-weight:400; display: flex; justify-content: center; align-items: center; }
.sec3 .content-slide ul li p b { font-size:14px; letter-spacing: 0; }
.sec3 .content-slide ul li p:nth-child(1) { text-align: left; }
.sec3 .content-slide ul li p:nth-child(2) { text-align: right; font-weight: 900; }
.sec3 .apply_wrap {
    width:85%;
    display:grid;
    grid-template-columns: 1fr 1fr;
    gap:0 10px;
    text-align:center;
    z-index:9;
}
.sec3 .content-slide a { 
    display:inline-block;
    width:100%; height:45px;
    line-height:45px;
    border-radius:5px;
    font-size:16px;
    font-weight: 600;
    color:#fff !important;
    position: relative;
    z-index: 99999;
}
.sec3 .content-slide .go_card_view { background:#eee; color:#000 !important; }
.sec3 .content-slide .go_card_apply { background:#000; }
.sec3 .content-slide em {
    display: block;
    font-size:12px;
    color:#1119;
    margin-top:15px;
    height: 30px;
}
/* e : sec3 */
/* e : sec4 */
.sec4 {
    background:#f5f5f5;
    color:#222;
    border-top:1px solid #0002;
    padding:60px 0;
}
.sec4 article { width:1200px; }
.sec4 strong { display:block; font-size:20px; font-weight:bold; padding-bottom:10px; }
.sec4 p { padding-left:17px; letter-spacing:-0.5px; font-size:18px; line-height:2; position:relative; }
.sec4 p::after { 
    content:"·";
    width:100%; height:100%;
    position: absolute;
    left:0; top:0;
    font-size:1rem;
    font-weight:600;
}
.sec4 .indent { text-indent: -30px; }

.sec4 .contentdetail{padding-top:1rem; padding-bottom:1rem;}
.sec4 .contentdetail h6{ display:block; font-size:1rem;line-height:1.8; font-weight:bold;}
.sec4 .contentdetail p { padding-left:1rem; letter-spacing:-0.5px; 
    font-size:0.9rem; line-height:1.8; position:relative;}
.sec4 .contentdetail ul li{ padding-left:1rem; letter-spacing:-0.5px;margin-left:1rem;
    font-size:0.9rem; line-height:1.6; position:relative;
}
.sec4 .contentdetail ul li::after { 
    content:"-";
    width:100%; height:100%;
    position: absolute;
    left:0; top:0;
    font-size:0.9rem;
    font-weight:400;
}

/* e : sec4 */
.notice-btm {text-align: right;padding:0 1rem 1rem 0;font-size:14px !important; line-height:1 !important; color:#0009; opacity:0.65;}
.notice-btm::after {display: none;}

@media screen and (min-width:750px) and (max-width:1199px){ 
    .sec1 .logo { width:120px; margin:15px 0; }
    .mo { display: none; }
    article { width:100% !important; }
    .sec1 { padding:0; }
    .sec1 .logo_wrap { height:auto; flex-flow: column; }
    .sec1 .logo_wrap .logo { width:auto; height:20px; margin:20px 0 0; }
    .sec1 .logo_wrap ul { width:60%; line-height: 2; margin:20px auto; }
    .sec1 .logo_wrap ul li { display:inline-block; }
    /* .sec1 .logo_wrap ul li { display: grid; grid-template-columns: 0.8fr 0.8fr 0.8fr 1fr; padding:0; gap:10px 0; } */
    /* .sec1 .logo_wrap ul li a:nth-child(5) { grid-column: 1/3; }
    .sec1 .logo_wrap ul li a:nth-child(6) { grid-column: 3/5; } */
    .sec1 .logo_wrap ul li a { 
        font-size:0.9rem;
        padding:0 10px; 
        text-align:center; 
        margin:3px;
        border-radius:100px;
        border:1px solid #0005;
        opacity: 0.48;
    }
    .sec1 .logo_wrap ul li a.on { color:#fff !important; z-index: 1; opacity: 1; border:1px solid #000; }
    .sec1 .logo_wrap ul li a::after {
        height:100%;
        border-radius:100px;
        z-index: -1;
    }
    .sec2 { height: auto; padding:30px 0 0; }
    .sec2 article { flex-flow: column; }
    .sec2 h2 { font-size:28px; }
    .sec2 .img_wrap img { display:block; width:80%; margin:0 auto; }
    .sec3 { padding:0 0 30px; }
    .sec3 .content_wrap {
        grid-template-columns: 1fr;
        gap: 0 15px;
    }  
    .sec3 .content-slide { width:90%; margin:10px auto; border:none; box-shadow:0 0 10px #eee; }
    .sec3 .content-slide ul { height:auto; }
    .sec3 ul li .card_img { width:64px; height:102px; }
    .sec3 ul li i { width:15px; height:15px; }
    .sec3 ul li p { font-size:20px; padding:0 0 10px; }
    .sec3 ul li p b { font-size:14px; letter-spacing: 0; }
    .sec3 ul li em { font-size:14px; }
    .sec3 ul li a { gap:0 15px; }
    .sec4 article { width:95% !important; margin:0 auto; }
    .sec4 p { padding-left:7px; }
    /* .sec4 p::after { top:-9px; } */

}
@media all and (max-width:749px) {
    body,html { overflow-x:hidden; letter-spacing: -2px; }
    article { width:100% !important; }
    .sec { padding:10px 0; }
    .mo { display: none; }
    article { width:100% !important; }
    .sec1 { padding:0; }
    .sec1 .logo_wrap { height:auto; flex-flow: column; }
    .sec1 .logo_wrap .logo { width:auto; height:20px; margin:20px 0 0; }
    .sec1 .logo_wrap ul { width:100%; line-height: 2; margin:20px 0; }
    .sec1 .logo_wrap ul li { display:inline-block; }
    /* .sec1 .logo_wrap ul li { display: grid; grid-template-columns: 0.8fr 0.8fr 0.8fr 1fr; padding:0; gap:10px 0; } */
    /* .sec1 .logo_wrap ul li a:nth-child(5) { grid-column: 1/3; }
    .sec1 .logo_wrap ul li a:nth-child(6) { grid-column: 3/5; } */
    .sec1 .logo_wrap ul li a { 
        font-size:0.9rem;
        padding:0 10px; 
        text-align:center; 
        margin:3px;
        border-radius:100px;
        border:1px solid #0005;
        opacity: 0.48;
    }
    .sec1 .logo_wrap ul li a.on { color:#fff !important; z-index: 1; opacity: 1; border:1px solid #000; }
    .sec1 .logo_wrap ul li a::after {
        height:100%;
        border-radius:100px;
        z-index: -1;
    }
    .sec2 { height: auto; padding:30px 0 0; }
    .sec2 article { flex-flow: column; }
    .sec2 h2 { font-size:28px; }
    .sec2 .img_wrap img { display:block; width:80%; margin:0 auto -30px; }
    .sec3 { padding:0 0 30px; }
    .sec3 .content_wrap {
        grid-template-columns: 1fr;
        gap: 0 15px;
    }      
    .sec3 .content-slide { width:90%; margin:10px auto; border:none; box-shadow:0 0 10px #eee; }
    .sec3 .content-slide ul { height:auto; }
    .sec3 .content-slide ul li { padding:5px 0 10px; }
    .sec3 ul li .card_img { width:64px; height:102px; }
    .sec3 ul li i { width:15px; height:15px; }
    .sec3 ul li p { font-size:20px; padding:0 0 10px; }
    .sec3 ul li p b { font-size:14px; letter-spacing: 0; }
    .sec3 ul li em { font-size:14px; }
    .sec3 .apply_wrap { margin-top:10px; }
    .sec3 ul li a { gap:0 15px; }
    .sec4 article { width:95% !important; margin:0 auto; }
    .sec4 p { padding-left:7px; }
    /* .sec4 p::after { top:-9px; } */
}
@media all and (max-width:600px) {
    * { letter-spacing: -0.5px; }
    .mo { display: none; }
    article { width:100% !important; }
    .sec1 { padding:0; }
    .sec1 .logo_wrap { height:auto; flex-flow: column; }
    .sec1 .logo_wrap .logo { width:auto; height:20px; margin:20px 0 0; }
    .sec1 .logo_wrap ul { width:100%; line-height: 2; margin:20px 0; }
    .sec1 .logo_wrap ul li { display:inline-block; }
    /* .sec1 .logo_wrap ul li { display: grid; grid-template-columns: 0.8fr 0.8fr 0.8fr 1fr; padding:0; gap:10px 0; } */
    /* .sec1 .logo_wrap ul li a:nth-child(5) { grid-column: 1/3; }
    .sec1 .logo_wrap ul li a:nth-child(6) { grid-column: 3/5; } */
    .sec1 .logo_wrap ul li a { 
        font-size:0.9rem;
        padding:0 10px; 
        text-align:center; 
        margin:3px;
        border-radius:100px;
        border:1px solid #0005;
        opacity: 0.48;
    }
    .sec1 .logo_wrap ul li a.on { color:#fff !important; z-index: 1; opacity: 1; border:1px solid #000; }
    .sec1 .logo_wrap ul li a::after {
        height:100%;
        border-radius:100px;
        z-index: -1;
    }
    .sec2 { height: auto; padding:30px 0 0; }
    .sec2 article { flex-flow: column; }
    .sec2 h2 { font-size:28px; width:100%; line-height: 36px; text-align: center; }
    .sec2 .img_wrap { width:100%; margin:0 auto; transform: scale(0.9); }
    .sec2 .img_wrap img { display:block; width:100%; margin:0 auto; }
    .sec3 { padding:0 0 30px; }
    .sec3 .content_wrap {
        grid-template-columns: 1fr;
        gap: 0 15px;
    }
    .sec3 .content-slide h2 { font-size:22px; font-weight:900; }
    .sec3 ul { width:90%; margin:0 auto; grid-template-columns: 1fr; gap:12px; }
    .sec3 ul li .card_img { width:64px; height:102px; border-radius:3px; box-shadow: none; }
    .sec3 ul li i { width:15px; height:15px; }
    .sec3 ul li p { font-size:20px; padding:0; line-height:26px; }
    .sec3 ul li p b { font-size:14px; letter-spacing: 0; }
    .sec3 ul li em { font-size:14px; }
    .sec3 ul li a { gap:0 15px; }
    .sec4 article { width:95% !important; margin:0 auto; }
    .sec4 strong { font-size:1rem; font-weight:bold; padding: 15px 0; }
    .sec4 p { font-size:0.7rem;padding-left:0.7rem; }
    .sec4 p::after {  font-size:0.7rem; }

    .sec4 .contentdetail h6{ font-size:0.7rem;}
    .sec4 .contentdetail p { font-size:0.7rem;padding-left:0.7rem;}
    .sec4 .contentdetail ul li{ font-size:0.7rem;padding-left:0.7rem;}
    .sec4 .contentdetail ul li::after { font-size:0.7rem;}

    .notice-btm-wrap { padding-top:15px; }
    .notice-btm {font-size:12px !important; line-height:0.5 !important; }
}
@media all and (max-width:350px) {
    .sec1 .motion_txt h2 { max-width:320px; height:250px; transform: translateY(-25px) !important; }
    .sec2 .tab_box ul li a .icon {
        width:45px; height:35px;
    }
    .notice-btm-wrap { padding-top:15px; }
    .notice-btm {font-size:12px !important; line-height:0.5 !important; }

}