/* 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:20.4px; height:17.4px;
     margin:0 5px 4px;
     background: url("/card/best_1/best_1_gift(3).png") center center/contain no-repeat; 
 }
 .sec3 .content-slide ul { 
     display :flex;
     flex-flow:column;
     justify-content: flex-start;
     width:85%; 
     height:310px;
     margin:0 auto 15px; 
 }  
 .sec3 .content-slide:nth-child(4) ul ,
 .sec3 .content-slide:nth-child(5) ul { /* height:360px; */ padding-top: 52px; } 
 .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;
 }
 /* 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; }
     .sec2 .img_wrap { width:100%; margin:-80px auto -50px; 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; }

 }