@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable.min.css");
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

:root{
    --point-color: #f26930;
    --light-point-color: #fff5ef;
    --point-opa-color: #f269302e;
    --dark-color: #000;
    --light-color: #fff;
    --light-gray-color: #efefef;
    --gray-color: #575757;
    --gradient-color: linear-gradient(178deg, #ffecd2 0%, #fcb69f 100%);
    --red-color: #b50000;
    --read-only-color: #bbbbbb;
}
html {scroll-behavior:smooth;}
html, body{font-family: "Poppins", "Pretendard Variable", sans-serif;word-break: keep-all;overflow-x: hidden;}


.inner{max-width: 1200px;margin: 0 auto;width: 100%;}
.block{display: block;}
.mo_br{display: none;}
.s_inner{max-width: 450px;width: 100%;margin: 0 auto;}
.line{border: 1px solid #000;}
.mt50{margin-top: 50px;}
.withdrawal{position: absolute;bottom: 50px;right: 65px;color: #565656;}

@media screen and (max-width: 1200px) {
    html{font-size: 14px;}
    .inner{width: calc(100% - 18px);}
    .mo_br{display: block;}
    .withdrawal{bottom: 20px;right: 20px;}
}

header{position: fixed;width: 100%;background: #000;color: #fff;box-sizing: border-box;border-bottom: 1px solid #F0F0F0;z-index: 9998;transition: transform 0.3s ease-in-out;}
header.w{color: #000;border-bottom: none;background: transparent;}
header .top_sec{display: flex;flex-direction: row;justify-content: space-between;flex-wrap: wrap; line-height: 35px;font-size: 14px;}
header .top_sec .ip{font-size: 16px;line-height: 30px;}
header .top_sec ul{display: flex;}
header .top_sec ul li a{display: block; padding: 0 8px;line-height: 30px;}
header .main_sec{line-height: 60px;display: flex;flex-direction: row;justify-content: space-between;}
header .main_sec .logo a{height: 60px;display: flex;flex-direction: column;justify-content: center;}
header .main_sec .logo img{width: 190px;}
header .main_sec nav .top{display: none;flex-direction: row;justify-content: flex-end;width: calc(100% - 18px);margin: 0 auto;}
header .main_sec nav .top .close_btn{width: 30px;height: 45px; background: transparent;}
header .main_sec nav .top .close_btn img{width: 100%;filter: invert(1);}
header .main_sec nav .ul1{display: flex;height: 100%;}
header .main_sec nav .ul1 li{position: relative;}
header .main_sec nav .ul1 li.mo{display: none;}
header .main_sec nav .ul1 li .a1{display: block;padding: 0 25px;font-weight: 700;transition: all .5s ease-in-out;line-height: 60px;}
header .main_sec nav .ul1 li .a1.on{}
header .main_sec nav .ul2{display: none; position: absolute;top: 60px;left: 0;z-index: 1;width: 100%;}
header .main_sec nav .ul2.on{display: block;}
header .main_sec nav .ul2 li a{display: block; line-height: 20px;font-weight: 300;font-size: 14px;padding: 6px 8px;text-align: center;}
header .main_sec .menu_btn{display: none;}
header .main_sec .menu_btn button{background: transparent;width: 30px;}
header .main_sec .menu_btn img{width: 100%; filter: invert(1);}
header.w .main_sec .menu_btn img{filter: invert(0);}
header .ul2Bg{display: none; position: absolute;width: 100%;height: 150px;background-color: #000;top: 90px;left: 0;border-top: 2px solid #fff;}
header .fix_btn{position: fixed;top: 70vh;width: 50px;height: 50px; right: 8px;background: #fff;border-radius: 50%;box-shadow: 6px 7px 8px rgba(0,0,0,0.2);padding: 6px;display: flex;flex-direction: row;transition: all 0.3s ease-in-out;cursor: pointer;}
header .fix_btn.on{width: auto;border-radius: 20px;}
header .fix_btn .img_wrap{width: 38px;height: 38px;margin: 0 auto;  background: transparent;display: flex;flex-direction: column;justify-content: center; align-self: center;transition: all 0.3s ease-in-out;border-radius: 50%;padding: 4px;}
header .fix_btn.on .img_wrap{background: #000;}
header .fix_btn.on .img_wrap img{filter: invert(1);} 
header .fix_btn p{display: none;align-self: center;margin-left: 6px;transition: all 0.3s ease-in-out;color: #000;}
header .fix_btn.on p{display: block;}

header .kakao{position: fixed;top: calc(70vh + 60px);width: 50px;height: 50px; right: 8px;background: #fff;border-radius: 50%;box-shadow: 6px 7px 8px rgba(0,0,0,0.2);padding: 6px;display: flex;flex-direction: row;transition: all 0.3s ease-in-out;cursor: pointer;background: #ffe600;}
header .kakao a{width: 38px;height: 38px;margin: 0 auto;  background: transparent;display: flex;flex-direction: column;justify-content: center; align-self: center;transition: all 0.3s ease-in-out;border-radius: 50%;padding: 4px;}


footer{padding-top: 50px;background: #F5F7FA; font-size: 14px;color: #666;}
footer .top_sec{display: flex;flex-direction: row;justify-content: space-between;flex-wrap: wrap;margin-bottom: 30px;padding-top: 50px;}
footer .top_sec img{width: initial;}
footer .top_sec ul {display: flex;margin-top: 20px;right: 5px;}
footer .top_sec ul li{margin-left: 10px;}
footer .top_sec ul li a{display: block; color: #111;}
footer .copy_sec{border-top: 1px solid #aaa;margin-top: 50px;padding: 20px 0;text-align: center;color: #aaa;}
footer{transition: all 0.3s ease-in-out;}
footer.on{margin-bottom: 219px;}

@media screen and (max-width:1200px) {
    header .top_sec{display: none;}
    header .main_sec{line-height: 45px;}
    header .main_sec .logo a{height: 45px;}
    header .main_sec .logo img{height: 30px;width: auto;}
    header .main_sec nav{position: fixed;width: 100vw;height: 100vh;top:0;left: 0;background: #000;color: #fff;z-index: 9999;display: none;}
    header .main_sec nav .top.on{display: flex;}
    header .main_sec nav .ul1{display: block;height: calc(100vh - 45px);overflow-y: scroll;}
    header .main_sec nav .ul2{display: flex;flex-direction: row;justify-content: flex-start;flex-wrap: wrap; position: static;padding: 0 9px;}
    header .main_sec nav .ul1 li .a1{line-height: 45px;}
    header .main_sec nav .ul1 li.mo{display: block;}
    header .main_sec nav .ul1 li.ip{text-align: right;padding: 0 9px;}
    header .main_sec nav .ul1 li.mo .ul2{justify-content: flex-end;}
    header .main_sec .menu_btn{display: block;}
    header .main_sec .menu_btn button{height: 45px;}
    footer{padding-top: 30px;}
    footer .top_sec{padding-top: 0;display: block;}
    footer .top_sec img{margin: 0 auto;max-width: 120px;}
    footer .top_sec ul{margin: 20px auto 0;justify-content: center;}
    footer .info_sec{text-align: center;font-size: 13px;}
    
}

@media screen and (max-width:600px) {
    header .top_sec ul{justify-content: flex-end;}
    /* header .fix_btn{display: none;} */
    
}




main{font-size: 16px;} 
main .sec1{padding-bottom: 20px;background-image: linear-gradient(to bottom, #ffecd2 0%, #eef1f5 100%);padding-top: 150px;}
main .sec1 ul{display: flex;flex-direction: row;justify-content: center;}
main .sec1 ul li{width: 23%;margin: 0 15px;}
main .sec1 ul li a{display: block; padding: 20px 40px;background: #fff;border-radius: 6px; box-shadow: 2px 2px 20px 0 rgba(26,26,26,0.10);box-sizing: border-box;transition: all 0.3s ease-in-out;}

main .sec1 ul li .txt h3{position: relative;}
main .sec1 ul li .txt h3 span{position: absolute;top: -50px;left: 50%;transform: translateX(-50%);width: 100%;padding: 8px;text-align: center;border-radius: 4px;color: #fff;background: #000;font-weight: 700; font-size: 20px;transition: all 0.3s ease-in-out;line-height: 26px;}
main .sec1 ul li .txt h4{font-weight: 700;margin: 10px 0 40px;position: relative;min-height: 108px;display: flex;flex-direction: column;justify-content: center;font-size: 24px;}
main .sec1 ul li .txt h4:after{position: absolute;content: '';width: 20px;height: 4px;background: #f26930;left: 0;bottom: -22px;}
main .sec1 ul li .txt p{min-height: 85px;font-size: 14px;}
main .sec1 ul li img{margin: 6px 0 6px auto;width: 55px;}
main .sec1 ul li .price{padding: 10px 12px;border-radius: 4px;background: #000;color: #fff;font-weight: bold;text-align: center;transition: all 0.3s ease-in-out;}
main .sec1 ul li a:hover{background: #f26930; color: #fff;}
main .sec1 ul li a:hover .txt h4:after{background: #fff;}
main .sec1 ul li a:hover img{filter: invert(1);}
main .sec2{background: #eef1f5;padding: 25px 0;}
main .sec2 ul{display: flex;flex-direction: row;justify-content: center;}
main .sec2 ul li{width: 120px;margin: 0 5px;}
main .sec2 ul li a{padding: 10px;height: 90px;display: flex;flex-direction: column;justify-content: center;border-radius: 4px;transition: all 0.3s ease-in-out;box-sizing: border-box;background: #fff;box-shadow: 2px 2px 20px 0 rgba(26,26,26,0.09);}
main .sec2 ul li a img{width: 25px;height: 25px;object-fit: contain;margin: 0 auto 8px;transition: all 0.3s ease-in-out;}
main .sec2 ul li a h4{font-size: 14px;text-align: center;line-height: 1.2;letter-spacing: -0.5px;font-weight: 500;transition: all 0.3s ease-in-out;}
main .sec2 ul li a:hover{background: #000;}
main .sec2 ul li a:hover h4{color: #fff;}
main .sec2 ul li a:hover img{filter: invert(1);}
main .sec2 ul li:last-child a:hover img{filter: invert(0);}

main .sec3{margin-top:50px}
main .sec3 .sec3Swiper{border-radius: 20px;box-shadow: 0 6px 15px rgba(36, 37, 38, 0.25)}
main .sec3 .sec3Swiper .swiper-button-next:after, main .sec3 .sec3Swiper .swiper-button-prev:after, main .sec3 .sec3Swiper .swiper-button-next:after{font-size: 22px;}
main .sec3 ul li{border-radius: 20px;padding: 30px 70px;height: 300px;}
main .sec3 ul .list{display: flex;flex-direction: row;justify-content: space-between;}
main .sec3 ul .list .content{align-self: center;}
main .sec3 ul .list .content h3{font-weight: 700;font-size: 36px;margin-bottom: 4px;}
main .sec3 ul .list .content p{font-size: 18px;margin-bottom: 40px;}
main .sec3 ul .list .content a{width: 200px; text-align: center;display: block;background: #000;color: #fff;border-radius: 8px;line-height: 40px;transition: all 0.3s ease-in-out;}
main .sec3 ul .list1{background-image: linear-gradient(to top, #accbee 0%, #e7f0fd 100%);}
main .sec3 ul .list3{background-image: linear-gradient(135deg, #fdfcfb 0%, #e2d1c3 100%);}
main .sec3 ul .list2{background-image: linear-gradient(to top, #fddb92 0%, #d1fdff 100%);}

main .sec_wrap{margin-bottom: 50px;}
main .sec_wrap .inner{display: flex;flex-direction: row;justify-content: space-between;flex-wrap: wrap;}
main .sec_wrap .sec{width: 48%;}
main .sec_wrap .sec h4{font-weight: 600;font-size: 20px;padding-left: 6px;border-left: 4px solid #f26930;margin-bottom: 12px;display: flex;flex-direction: row;justify-content: space-between; }
main .sec_wrap .sec h4 a{font-size: 0.7em;font-weight: 300;color: #333;text-decoration: underline;align-self: flex-end;}
main .sec_wrap .sec ul li a{padding: 20px;border-top: 1px solid #efefef;border-bottom: 1px solid #efefef;display: block;transition: all 0.3s ease-in-out;overflow: hidden;}
main .sec_wrap .sec ul li a:hover{background: #efefef;}

@media screen and (max-width:1200px) {
    main{font-size: 14px;}
    main .sec1{overflow-x: scroll;padding-top: 110px;}
    main .sec1 ul{min-width: 800px;}
    main .sec1 ul li{max-width: 276px;width: 100%;}
    main .sec1 ul li a{padding: 20px;}
    main .sec1 ul li .txt h3 span{font-size: 20px;}
    main .sec1 ul li .txt h4{font-size: 20px;margin: 10px auto 25px;}
    main .sec1 ul li .txt h4:after{bottom: -8px;}
    main .sec2{overflow-x: scroll;}
    main .sec2 ul{flex-wrap: nowrap;min-width: 953px;}
    main .sec2 ul li{margin: 10px 5px;}
    main .sec_wrap .sec{width: 100%;}
    main .sec_wrap .sec h4{font-size: 16px;}
    main .sec_wrap .sec ul li a{padding: 12px;}
    main .sec_wrap .sec5{margin-top: 30px;}

    main .sec3 ul li{height: auto;padding: 20px;}
    main .sec3 ul .list{flex-direction: column;justify-content: center;}
    main .sec3 ul .list img{order: 1;max-width: 220px;width: 100%;margin: 10px auto;}
    main .sec3 ul .list .content{order: 2;}
    main .sec3 ul .list .content h3{text-align: center;font-size: 20px;}
    main .sec3 ul .list .content p{font-size: inherit;text-align: center;}
    main .sec3 ul .list .content a{margin: 0 auto 25px;}
}
/* login */
.login{min-height: 80vh;padding-top: 110px;display: flex;flex-direction: column;justify-content: center;background: #F5F7FA;}
.login .sec1 h2{text-align: center;font-weight: bold;font-size: 60px;margin-bottom: 30px;}
.login .sec2 .wrap{border-radius: 30px;padding: 50px;box-shadow: 8px 16px 32px rgba(0,0,0,.08);}
.login .sec2 .input_ul li{margin-bottom: 5px;}
.login .sec2 .input_ul li input{width: 100%;border-radius: 12px;line-height: 45px;padding: 0 20px;}
.login .sec2 .input_ul li input:focus{outline: none;}
.login .sec2 .btn_ul{display: flex;flex-direction: row;justify-content: space-between;margin-top: 10px}
.login .sec2 .btn_ul li a, .login .sec2 .btn_ul li button{display: block;padding: 0 18px;background: #000; color: #fff;border-radius: 8px;height: 35px;line-height: 35px;cursor: pointer;}

@media screen and (max-width:1200px) {
    .login{padding-top: 60px;}
    .login .sec1 h2{font-size: 34px;margin-bottom: 15px;}
    .login .sec2 .wrap{padding: 25px;}
    .login .sec2 .btn_ul{justify-content: center;flex-wrap: wrap;}
    .login .sec2 .btn_ul li{margin: 6px;width: calc(50% - 15px);}
    .login .sec2 .btn_ul li a, .login .sec2 .btn_ul li button{width: 100%;text-align: center;}
    .login .sec2 .btn_ul li:last-child{width: 1000%;}
}

/* join */
.join{min-height: 80vh;background: #F5F7FA;display: flex;flex-direction: column;justify-content: center;}
.join .sec1{padding: 50px 0;}
.join .sec1 img{margin: 0 auto;max-width: 100%;}
.join .sec2{margin-bottom: 50px;}
.join .sec2 .wrap{border-radius: 30px;padding: 25px;box-shadow: 8px 16px 32px rgba(0,0,0,.08)}
.join .sec2 .wrap ul li{display: flex;flex-direction: row;justify-content: space-between;margin: 17px 0;}
.join .sec2 .wrap ul li .check{position: relative;cursor: pointer;}
.join .sec2 .wrap ul li .check label{display: flex;cursor: pointer;padding: 8px 0;}
.join .sec2 .wrap ul li .check .img_wrap{width: 22px; height: 22px;box-sizing: border-box;border: 1px solid #f26930;border-radius: 50%;display: flex;flex-direction: column;justify-content: center;margin-right: 6px;transition: all 0.3s ease-in-out;}
.join .sec2 .wrap ul li .check .img_wrap img{width: 50%;margin: 0 auto;filter: invert(46%) sepia(23%) saturate(6145%) hue-rotate(346deg) brightness(100%) contrast(89%);transition: all 0.3s ease-in-out;}
.join .sec2 .wrap ul li .check.on .img_wrap{background: #000;border: 1px solid #000;}
.join .sec2 .wrap ul li .check.on .img_wrap img{filter: invert(1);}
.join .sec2 .wrap ul li .check input{position: absolute;left: -9999px;opacity: 0;visibility: hidden;}
.join .sec2 .wrap ul li .check p{line-height: 22px;}
.join .sec2 .wrap ul li .check p span{font-weight: bold;}
.join .sec2 .wrap ul li button{border: 1px solid #000;border-radius: 6px;padding: 0 8px;font-size: 13px;height: 26px;margin: auto 0;transition: all 0.3s ease-in-out;cursor: pointer;}
.join .sec2 .wrap ul li button:hover{background: #000;color: #fff;}
.join .sec2 .wrap .btn{display: flex;flex-direction: row;justify-content: space-between;}
.join .sec2 .wrap .btn a{width: 48%;line-height: 45px;text-align: center;border-radius: 8px;transition: all 0.3s ease-in-out;}
.join .sec2 .wrap .btn a:first-child{background: #efefef;}
.join .sec2 .wrap .btn a:last-child{box-sizing: border-box;border: 1px solid #000;}
.join .sec2 .wrap .btn a:last-child:hover{border: 1px solid #000;background: #000;color: #fff;}
.join .sec3{position: fixed;top: 0;left: 0;width: 100vw;height: 100vh;background: #00000099;overflow: hidden;z-index: 9999;display: none;}
.join .sec3.on{display: block;}
.join .sec3 .s_inner{display: flex;flex-direction: column;justify-content: center;height: 100%;}
.join .sec3 .wrap{background: #fff;padding: 25px;border-radius: 24px;position: relative;}
.join .sec3 .wrap button{width: 30px;position: absolute;top: 15px;right: 15px;background: transparent;cursor: pointer;}
.join .sec3 .wrap textarea{overflow-y: auto;resize: none;margin-top: 10px;width: 100%;height: 70vh;display: none;}
.join .sec4 .wrap{border-radius: 30px;padding: 25px;box-shadow: 8px 16px 32px rgba(0,0,0,.08);font-size: 14px;}
.join .sec4 h2{font-weight: bold;border-left: 4px solid #f26930;padding-left: 4px;}
.join .sec4 nav{margin-bottom: 15px;}
.join .sec4 nav ul{display: flex;flex-direction: row;justify-content: space-between;margin: 0 auto;width: 85%;}
.join .sec4 nav ul li{width: 48%;line-height: 40px;border-radius: 6px;text-align: center;background: #ddd;cursor: pointer;}
.join .sec4 nav ul li.on{background: #000;color: #fff;}
.join .sec4 dl dd{margin-bottom: 10px;}
.join .sec4 dl dd .input_wrap{position: relative;}
.join .sec4 dl dd .input_wrap input, .join .sec4 dl dd .input_wrap select{padding: 4px 22px 4px 4px;border: 1px solid #bbb;width: 100%;background: transparent;transition: all 0.3s ease-in-out}
.join .sec4 dl dd .input_wrap input:focus{border: 1px solid #0056cc;outline: none;}
.join .sec4 dl dd .input_wrap input.readonly{cursor: initial;border: 1px solid #bbb;background: #ddd;}
.join .sec4 dl dd .input_wrap input.readonly:focus{border: 1px solid #bbb;}
.join .sec4 dl dd .input_wrap span, .join .sec4 dl dd .input_wrap button{position: absolute;top: 50%;right: 5px;transform: translateY(-50%);z-index: 1;display: none;background: transparent;}
.join .sec4 dl dd .input_wrap span img, .join .sec4 dl dd .input_wrap button img{width: 13px;filter: invert(23%) sepia(33%) saturate(5614%) hue-rotate(206deg) brightness(97%) contrast(105%);}
.join .sec4 dl dd .msgBox{font-size: 11px;margin-top: 4px;color: #ff223c;display: none;}
.join .sec4 dl dd.error .input_wrap input{border: 1px solid #ff223c;}
.join .sec4 dl dd.error .input_wrap input:focus{border: 1px solid #ff223c;}
.join .sec4 dl dd.error .input_wrap span, .join .sec4 dl dd.error .input_wrap button{cursor: pointer;}
.join .sec4 dl dd.error .input_wrap span img, .join .sec4 dl dd.error .input_wrap button img{filter: invert(38%) sepia(97%) saturate(6211%) hue-rotate(341deg) brightness(102%) contrast(100%);}
.join .sec4 dl dd.error .msgBox{display: block;}
.join .sec4 dl dd.num .input_wrap{display: flex;flex-direction: row;justify-content: space-between;}
.join .sec4 dl dd.num .input_wrap input{width: 30%;}
.join .sec4 dl dd.num .input_wrap em{line-height: 30px;}
.join .sec4 dl dd.addr .addr_num{display: flex;flex-direction: row;justify-content: flex-start;margin-bottom: 10px;}
.join .sec4 dl dd.addr .addr_num input, .join .sec4 dl dd.addr .addr_num a{width: 30%;}
.join .sec4 dl dd.addr .addr_num a{display: block;margin-left: 15px;background: #000;color: #fff;text-align: center;line-height: 30px;font-weight: 700;border-radius: 4px;}
.join .sec4 dl dd.addr .addr_txt input:first-child{margin-bottom: 4px;}
.join .sec4 .btn{display: flex;flex-direction: row;justify-content: space-between;}
.join .sec4 .btn a{width: 48%;line-height: 45px;text-align: center;border-radius: 8px;transition: all 0.3s ease-in-out;}
.join .sec4 .btn a:first-child{background: #efefef;}
.join .sec4 .btn a:last-child{box-sizing: border-box;border: 1px solid #000;}
.join .sec4 .btn a:last-child:hover{border: 1px solid #000;background: #000;color: #fff;}

.join .sec4 .biz_area{display: none;transition: all 0.3s ease-in-out;}
.join .sec4 .biz_area.on{display: block;}
.join .sec6{text-align: center;padding-top: 100px;}
.join .sec6 h2{font-size: 18px;font-weight: bold;margin: 30px auto;}
.join .sec6 h2 span{font-size: 1.6em;}
.join .sec6 .btn{margin: 30px auto;display: flex;flex-direction: row;justify-content: center;}
.join .sec6 .btn a{width: 150px;line-height: 40px;background: #f26930;color: #fff;border-radius: 8px;margin: 0 15px;}

/* find_user */
.find_user .sec_wrap .inner{display: flex;flex-direction: row;justify-content: space-between;}
.find_user .sec_wrap .sec{width: 48%;padding: 30px;box-shadow: 7px 8px 9px rgba(0,0,0,0.2);border-radius: 20px;display: flex;flex-direction: column;justify-content: space-between;}
.find_user .sec_wrap .sec h3{font-weight: 600;font-size: 24px;margin-bottom: 10px;}
.find_user .sec dl{display: flex;flex-direction: row;justify-content: flex-start;flex-wrap: wrap;margin-bottom: 20px;}
.find_user .sec dl dt{background: #fff5ef;border: 1px solid #efefef;padding: 12px;font-weight: 600;text-align: center;width: 25%;}
.find_user .sec dl dd{border: 1px solid #efefef;padding: 12px;display: flex;flex-direction: column;justify-content: center;width: 75%;}
.find_user .sec dl dd.ment{width: 100%;}
.find_user .sec dl dd input{line-height: 35px;background: #efefef;padding: 0 12px;}
.find_user .sec .btn button{font-size: inherit;cursor: pointer;text-align: center;border-radius: 4px;transition: all 0.3s ease-in-out;display: block;width: 200px;background: #000;color: #fff;line-height: 35px;margin: 0 auto;}
.find_user .sec .btn button:hover{background: #f26930;}
.find_user .sec4{position: fixed;width: 100vw;height: 100vh;background: #00000099;flex-direction: column;justify-content: center;top: 0;left: 0;z-index: 9999;display: none;}
.find_user .sec4.on{display: flex;}
.find_user .sec4 .wrap{background: #fff;border-radius: 30px;padding: 30px;margin: 0 auto;max-width: 550px;width: 100%;}
.find_user .sec4 .wrap .top{display: flex;flex-direction: row;justify-content:flex-end;margin-bottom: 9px;}
.find_user .sec4 .wrap .top button{ width: 30px;background: transparent;cursor: pointer;}
.find_user .sec4 .wrap .top button img{width: 100%;}
.find_user .sec4 .wrap p{margin: 20px 0;text-align: center;}
.find_user .sec4 .wrap p span{font-weight: 600;font-size: 1.4em;}

@media screen and (max-width:1200px) {
    .find_user .sec_wrap .inner{flex-wrap: wrap;}
    .find_user .sec_wrap .sec{width: 100%;padding: 15px;margin-bottom: 30px;border-radius: 10px;}
    .find_user .sec_wrap .sec h3{font-size: 18px;}
    .find_user .sec dl dt{padding: 8px;display: flex;flex-direction: column;justify-content: center;}
    .find_user .sec dl dd{padding: 8px;}
}

/*subp*/
.subp{min-height: 100vh;padding-top: 90px;margin-bottom: 50px;}
.gray_box{padding: 30px;background: #efefef;}

.subp .sec .list_nav{margin: 20px auto;}
.subp .sec .list_nav ul{display: flex;flex-direction: row;justify-content: center;}
.subp .sec .list_nav ul li{margin: 0 4px;}
.subp .sec .list_nav ul li a{box-sizing: border-box; height: 35px; width: 35px;border-radius: 6px;border: 1px solid #efefef;display: block;line-height: 35px;text-align: center;transition: all 0.3s ease-in-out;}
.subp .sec .list_nav ul li a img{width: 10px;height: 35px;object-fit: contain;display: block;margin: auto;transition: all 0.3s ease-in-out;}
.subp .sec .list_nav ul li a:hover{background: #000;color: #fff;}
.subp .sec .list_nav ul li a:hover img{filter: invert(1);}
.subp .sec .list_nav ul li.active a{background: #000;color: #fff;}
.subp .sec1 h1{font-size: 36px;font-weight: 800;text-align: center;margin: 80px auto 110px;position: relative;}
.subp .sec1 h1:after{position: absolute;width: 3px;height: 60px;background: #f26930;content: '';bottom: -115px;left: 50%;transform: translateY(-50%);}

@media screen and (max-width:1200px) {
    .subp{padding-top: 60px;}
    .subp .sec1 h1{font-size: 18px;margin: 50px auto;}
    .subp .sec1 h1:after{width: 30px;height: 4px;bottom: -30px;transform: translateX(-50%);}
}

.subtop h1{font-size: 36px;font-weight: 800;text-align: center;margin: 80px auto 110px;position: relative;}
.subtop h1:after{position: absolute;width: 3px;height: 60px;background: #f26930;}

.provision{margin-bottom: 50px;}

.product{margin-bottom: 50px;}
.product .sec h3{font-size: 24px;font-weight: 700;text-align: center;}
.product .sec table{width: 100%;border-collapse: collapse;}
.product .sec table caption{text-align: right;margin-bottom: 10px;}
.product .sec table th{padding: 12px 6px;border-top: 4px solid #f26930;border-bottom: 2px solid #000;}
.product .sec table td{padding: 12px 6px;border-bottom: 1px solid #000;text-align: center;}

.product .sec1 h2{font-size: 36px;font-weight: 800;text-align: center;margin: 80px auto 0;}
.product .sec1 h5{text-align: center;font-weight: 600;margin-bottom: 100px;position: relative;}
.product .sec1 h5:after{position: absolute;width: 3px;height: 60px;background: #f26930;content: '';bottom: -115px;left: 50%;transform: translateY(-50%);}
.product .sec1 .gradient_font{text-align: center;font-weight: 800;font-size: 36px;}
.product .sec1 .link{display: flex;flex-direction: row;justify-content: center;flex-wrap: wrap;text-align: center;font-weight: 600;margin: 50px auto;}
.product .sec1 .link li{width: 240px;margin: 0 10px;}
.product .sec1 .link li a{display: block;line-height: 40px;border-radius: 4px;background: #000;color: #fff;box-shadow: 0 6px 15px rgba(36, 37, 38, 0.25);transition: all 0.3s ease-in-out;}
.product .sec1 .link li a:hover{background: #f26930;}
.product .sec2{background: #000;color: #fff; padding: 50px 0;margin-top: 50px;text-align: center;}
.product .sec2 ul{display: flex;flex-direction: row;justify-content: flex-start;flex-wrap: wrap;max-width: 850px;margin: 0 auto;}
.product .sec2 ul li{width: 30%;margin: 20px 1.5%;padding: 20px;border: 1px solid #575757;border-radius: 15px;}
.product .sec2 ul li p{margin-top: 6px;font-weight: 600;}
.product .sec2 ul li .img_wrap{border-radius: 100%;margin: 0 auto;width: 150px;height: 150px;background: #fff;display: flex;flex-direction: column;justify-content: center;}
.product .sec2 ul li .img_wrap img{width: 50%;height: 50%;object-fit: contain;margin: auto;}
.product .sec2 ul li h5{font-weight: 700;text-align: center;margin-top: 10px;}
.product .sec3{background: #efefef;padding: 50px 0;}
.product .sec3 h3{margin-bottom:  30px;}
.product .sec3 .link{margin: 30px 0;}
.product .sec3 .link a{width: 240px;line-height: 40px;border-radius: 4px;background: #000;text-align: center;display: block;margin: 0 auto;box-sizing: border-box;border: 1px solid #000;transition: all 0.3s ease-in-out;font-weight: 700;color: #fff;}
.product .sec3 .link a:hover{background: #f26930;border: 1px solid #f26930;}
.product .sec3 p{font-weight: 600;background: #fff;max-width: 700px;width: 95%;margin: 0 auto;padding: 30px;border-radius: 15px;line-height: 2;}
.product .sec3 p u{font-size: 1.2em;color: #f26930;font-weight: 800;text-decoration: none;}
.product .sec4 h3, .product .sec5 h3, .product .sec6 h3{margin: 100px auto 30px;}
.product .sec6 .gray_box b{font-size: 1.2em;font-weight: 600;}

@media screen and (max-width:1200px) {
    .product .sec1 h2{font-size: 28px;margin: 60px auto 0;}
    .product .sec1 .gradient_font{font-size: 24px;}
    .product .sec1 .link li{margin: 10px;}
    .product .sec2 ul{justify-content: center;}
    .product .sec2 ul li{width:45%}
    .product .sec2 ul li .img_wrap{width:90px;height:90px}
    .product .sec3 .link a{width: 100%;max-width: 240px;}
    .product .sec3 p{padding: 20px;}
    .product .sec table th{padding: 4px;}
    .product .sec table td{padding: 4px;}
    .product .sec .table_wrap{overflow-x: scroll;}
    .product .sec .table_wrap table{min-width: 430px;}
}

/*vpn*/
.vpn .sec1 .gradient_font span:nth-child(1){background-image: linear-gradient(-20deg, #fc6076 0%, #f26930 100%);-webkit-text-fill-color: transparent;background-clip: text;-webkit-background-clip: text;}
.vpn .sec1 .gradient_font span:nth-child(2){background-image: linear-gradient(-20deg, #151fa5 0%, #fc6076 100%);-webkit-text-fill-color: transparent;background-clip: text;-webkit-background-clip: text;}
.vpn .sec1 .gradient_font span:nth-child(3){color: #000;}

/*proxy*/
.proxy .sec1 .gradient_font span:nth-child(1){background-image: linear-gradient(-20deg, #fc6076 0%, #f26930 100%);-webkit-text-fill-color: transparent;background-clip: text;-webkit-background-clip: text;}
.proxy .sec1 .gradient_font span:nth-child(2){color: #000;}
.proxy .sec1 .gradient_font span:nth-child(3){background-image: linear-gradient(-20deg, #151fa5 0%, #fc6076 100%);-webkit-text-fill-color: transparent;background-clip: text;-webkit-background-clip: text;}
.proxy .sec7 h3{margin: 50px auto 30px;}
.proxy .sec7 ul{display: flex;flex-direction: row;justify-content: center;flex-wrap: wrap;}
.proxy .sec7 ul li{margin: 0 50px;}
.proxy .sec7 ul li a{display: block;}
.proxy .sec7 ul li:first-child a{cursor: default;}
.proxy .sec7 ul li .img_wrap{width: 100px;height: 100px;border-radius: 12px;box-shadow: 0 6px 15px rgba(36, 37, 38, 0.1);overflow: hidden;display: flex;flex-direction: column;justify-content: center;margin: 0 auto;}
.proxy .sec7 ul li .img_wrap{background: #000;}
.proxy .sec7 ul li .img_wrap img{filter: invert(1);}
.proxy .sec7 ul li:nth-child(2) .img_wrap{background: #ffe600;}
.proxy .sec7 ul li:nth-child(2) .img_wrap img{filter: none;}
.proxy .sec7 ul li .img_wrap img{width: 50%;height: 50%;object-fit: contain;object-position: center;margin: auto;}
.proxy .sec7 ul li p{font-weight: 600;text-align: center;margin-top: 20px;}

.program .sec h4{padding-left: 12px;border-left: 4px solid #f26930;font-weight: 600;margin: 100px 0 8px;font-size: 18px;}
.program .sec1 nav ul{display: flex;flex-direction: row;justify-content: space-around;}
.program .sec1 nav ul li{width: 24%;}
.program .sec1 nav ul li a{display: flex;flex-direction: row;justify-content: center; background: #efefef;padding: 12px;border-radius: 8px;}
.program .sec1 nav ul li .img_wrap{width: 24px;height: 24px;object-fit: contain;margin-right: 6px;align-self: center;}
.program .sec1 nav ul li:nth-child(1) .img_wrap img{filter: invert(48%) sepia(73%) saturate(1835%) hue-rotate(168deg) brightness(101%) contrast(107%);}
.program .sec1 nav ul li:nth-child(2) .img_wrap img, .program .sec1 nav ul li:nth-child(3) .img_wrap img{filter: invert(77%) sepia(50%) saturate(3225%) hue-rotate(31deg) brightness(98%) contrast(101%);}
.program .sec1 nav ul li.on a{background: #000;color: #fff;}
.program .sec1 nav ul li:nth-child(1).on .img_wrap img, .program .sec1 nav ul li:nth-child(2).on .img_wrap img, .program .sec1 nav ul li:nth-child(3).on .img_wrap img, .program .sec1 nav ul li:nth-child(4).on .img_wrap img{filter: invert(1)}

.program .sec2{margin-top: 50px;}
.program .sec2 h3{font-weight: 600;text-align: center;font-size: 24px;}
.program .sec2 iframe{max-width: 560px;width: 100%;margin: 30px auto;}
.program .sec2 .down a{max-width: 240px;width: 100%;line-height: 40px;border-radius: 8px;text-align: center;display: block;margin: 30px auto;background: #000;color: #fff;transition: all 0.3s ease-in-out;}
.program .sec2 .down a:hover{background: #f26930;}
.program .sec2 .contact{margin-top: 20px;}
/* .program .sec2 .contact .img_wrap{width: 100px;height: 100px;border-radius: 15px;box-shadow: 0 6px 15px rgba(36, 37, 38, 0.1);overflow: hidden;display: flex;flex-direction: column;justify-content: center;margin: 0 auto;background: #000;}
.program .sec2 .contact .img_wrap img{width: 50%;height: 50%;object-fit: contain;object-position: center;margin: auto;filter: invert(1);}
.program .sec2 .contact p{font-weight: 600;text-align: center;margin-top: 20px;}
.program .sec7 h3{margin: 50px auto 30px;} */
.program .sec2 .contact ul{display: flex;flex-direction: row;justify-content: center;flex-wrap: wrap;}
.program .sec2 .contact ul li{margin: 0 50px;}
.program .sec2 .contact ul li a{display: block;}
.program .sec2 .contact ul li:first-child a{cursor: inherit;}
.program .sec2 .contact ul li .img_wrap{width: 100px;height: 100px;border-radius: 12px;box-shadow: 0 6px 15px rgba(36, 37, 38, 0.1);overflow: hidden;display: flex;flex-direction: column;justify-content: center;margin: 0 auto;}
.program .sec2 .contact ul li .img_wrap{background: #000;}
.program .sec2 .contact ul li .img_wrap img{filter: invert(1);}
.program .sec2 .contact ul li:nth-child(2) .img_wrap{background: #ffe600;}
.program .sec2 .contact ul li:nth-child(2) .img_wrap img{filter: none;}
.program .sec2 .contact ul li .img_wrap img{width: 50%;height: 50%;object-fit: contain;object-position: center;margin: auto;}
.program .sec2 .contact ul li p{font-weight: 600;text-align: center;margin-top: 20px;}

.program .sec3 ul{display: flex;flex-direction: row;justify-content: flex-start;flex-wrap: wrap;}
.program .sec3 ul li{margin: 10px 0.5% 50px;padding: 20px;border: 1px solid #575757;box-sizing: border-box;border-radius: 8px;width: 19%;}
.program .sec3 ul li h6{width: 100%; max-width: 280px;height: 40px;line-height: 40px;text-align: center;background: #000;border-radius: 8px;color: #fff;margin: 0 auto;}
.program .sec3 ul li figure{margin: 15px 0;}
.program .sec3 ul li figure img{max-width: 300px; width: 100%; height: auto;object-fit: contain;object-position: top;}
.program .sec3 ul li figure figcaption{width: auto;margin-left: 10px;}
.program .sec3 ul li figure figcaption h4{margin: 0;margin-bottom: 10px;}
.program .sec3 figure figcaption ol{list-style: disc;padding-left: 20px;}
.program .sec3 ul li figure figcaption ol li img{display: initial;width: initial;}

.program .sec3 ul li.block{display: block;}
.program .sec3 ul li.block img{width: 100%;max-width: 270px;margin: 0 auto;}
.program .sec3 ul li .block figcaption{width: 100%;max-width: 100%;margin-left: 0;margin-top: 15px;}
.program .sec3 ul .swiper-slide .block figcaption p{padding: 15px;background: #000;color: #fff;border-radius: 6px;max-width: 280px;margin: 0 auto;}
.program .sec3 ul .swiper-slide .block.center figcaption{text-align: center;}
/* .program .sec3 .swiper-pagination{top: 0;bottom: auto;left: 50%;transform: translateX(-50%);}
.program .sec3 ul .swiper-slide{margin: 50px 0;padding: 20px;border: 1px solid #575757;box-sizing: border-box;border-radius: 8px;}
.program .sec3 ul .swiper-slide h6{width: 100%; max-width: 280px;height: 40px;line-height: 40px;text-align: center;background: #000;border-radius: 8px;color: #fff;margin: 0 auto;}
.program .sec3 ul .swiper-slide figure{display: flex;flex-direction: row;justify-content: flex-start;margin: 15px 0;}
.program .sec3 ul .swiper-slide figure img{max-width: 300px; width: 50%; height: auto;object-fit: contain;object-position: top;}
.program .sec3 ul .swiper-slide figure figcaption{width: auto;margin-left: 10px;}
.program .sec3 ul .swiper-slide figure figcaption h4{margin: 0;margin-bottom: 10px;}
.program .sec3 figure figcaption ol{list-style: disc;padding-left: 20px;}
.program .sec3 ul .swiper-slide figure figcaption ol li img{display: initial;width: initial;}

.program .sec3 ul .swiper-slide .block{display: block;}
.program .sec3 ul .swiper-slide .block img{width: 100%;max-width: 270px;margin: 0 auto;}
.program .sec3 ul .swiper-slide .block figcaption{width: 100%;max-width: 100%;margin-left: 0;margin-top: 15px;}
.program .sec3 ul .swiper-slide .block figcaption p{padding: 15px;background: #000;color: #fff;border-radius: 6px;max-width: 280px;margin: 0 auto;}
.program .sec3 ul .swiper-slide .block.center figcaption{text-align: center;} */
.program .sec4 ul{display: flex;flex-direction: row;justify-content: space-around;flex-wrap: wrap;margin-bottom: 20px;}
.program .sec4 ul > li{width: 32%;}
.program .sec4 .wid19ul{justify-content: flex-start;margin-bottom: 20px;}
.program .sec4 ul .wid19{width: 24%;margin: 1% 0.5%;}
.program .sec4 ul .wid30{width: 31%;margin: 1% 1%;}
.program .sec4 ul > li{margin: 10px 0 50px;padding: 20px;border: 1px solid #575757;box-sizing: border-box;border-radius: 8px;}
.program .sec4 ul > li h6{width: 100%; max-width: 280px;height: 40px;line-height: 40px;text-align: center;background: #000;border-radius: 8px;color: #fff;margin: 0 auto;}
.program .sec4 ul > li figure{margin: 15px 0;}
.program .sec4 ul > li figure img{max-width: 100%; height: auto;object-fit: contain;object-position: top;margin:0 auto 15px }
.program .sec4 ul > li figure figcaption{width: auto;margin-left: 10px;}
.program .sec4 ul > li figure figcaption h4{margin: 0 0 8px}
.program .sec4 figure figcaption ol{list-style: decimal;padding-left: 20px;}
.program .sec4 ul figure figcaption ol li img{display: initial;width: initial;}
/* .program .sec4 .vpnPc li h6{margin-left:0;max-width: 300px;} */

@media screen and (max-width:1200px) {
    .program .sec1 nav ul{flex-wrap: wrap;}
    .program .sec1 nav ul li{width: 48%;margin-bottom: 8px;}
    .program .sec1 nav ul li a{padding: 8px;}
    .program .sec1 nav ul li .img_wrap{width: 14px;height: 14px;}

    .program .sec2 .contact ul li{width: 30%;margin: 10px 1%;}
    .program .sec2 .contact ul li .img_wrap{width: 80px;height: 80px;}

    .program .sec3 ul li{width: 49%;padding: 8px;margin: 10px 0.5%;}

    .program .sec4 ul > li{width: 95%;margin: 20px 0;padding: 8px;}
    .program .sec4 ul > li figure img{}
    .program .sec4 ul > li figure{display: block;}
    .program .sec4 .wid19ul{justify-content: flex-start;}
    .program .sec4 ul .wid19{width: 100%;margin: 1% 0;}
    .program .sec4 ul .wid30{width: 100%;margin: 1% 0;}

    .proxy .sec7 ul{justify-content: flex-start;}
    .proxy .sec7 ul li{margin: 10px 0;width: 33%;}
    .proxy .sec7 ul li .img_wrap{width: 80px;height: 80px;}
}

/* notice */
.notice.list .sec2 table{width: 100%;border-collapse: collapse;}
.notice.list .sec2 table th, .notice.list .sec2 table td{padding: 14px;text-align: center;}
.notice.list .sec2 table th{border-top: 2px solid #000;border-bottom: 1px solid #000;}
.notice.list .sec2 table td{border-top: 1px solid #ddd;border-bottom: 1px solid #ddd;}
.notice.list .sec2 table tfoot tr{border-bottom: 2px solid #000;}
.notice.list .sec2 table .strong{background:#efefef;}
.notice.list .sec2 table .subj{text-align: left;}

.notice.list .sec2 .search{margin: 30px auto;max-width: 400px;width: 100%;display: flex;flex-direction: row;justify-content: center;}
.notice.list .sec2 .search input{width: calc(100% - 35px);box-sizing: border-box;border: 1px solid #efefef;transition: all 0.3s ease-in-out;border-top-left-radius: 6px;border-bottom-left-radius: 6px;padding: 8px 12px;}
.notice.list .sec2 .search input:focus{border: 1px solid #f26930;}
.notice.list .sec2 .search button{width: 45px;height: 45px;line-height: 35px;cursor: pointer;transition: all 0.3s ease-in-out;border-top-right-radius: 6px;border-bottom-right-radius: 6px;}
.notice.list .sec2 .search button img{height: 45px ;width: 15px;object-fit: contain;margin: 0 auto;transition: all 0.3s ease-in-out;}
.notice.list .sec2 .search button:hover{background: #000;}
.notice.list .sec2 .search button:hover img{filter: invert(1);}

.notice.view .sec2 .view_info{padding: 15px;border-top: 2px solid #000;border-bottom: 1px solid #000; display: flex;flex-direction: row;justify-content: space-between;flex-wrap: wrap;}
.notice.view .sec2 .view_info h2{font-weight: 600;font-size: 18px;}
.notice.view .sec2 .view_info .time{align-self: center;}
.notice.view .sec2 .view_content{padding: 30px 15px;}
.notice.view .sec2 .view_content #editor-wrapper{display: block;}
.notice.view .sec2 .view_bot{margin: 30px 0;display: flex;flex-direction: row;justify-content: flex-end;}
.notice.view .sec2 .view_bot a{height: 35px;line-height: 35px;padding: 0 15px;border-radius: 6px;background: #efefef;text-align: center;transition: all 0.3s ease-in-out;}
.notice.view .sec2 .view_bot a:hover{background: #000;color: #fff;}

.qna.view .sec2 .write_btn{display: flex;flex-direction: row;justify-content: flex-end;flex-wrap: wrap;}
.qna.view .sec2 .write_btn a{padding: 0 12px;border: 1px solid #f26930; box-sizing: border-box;color: #f26930;text-align: center;height: 40px;line-height: 40px;font-weight: 600;transition: all 0.3s ease-in-out;}
.qna.view .sec2 .write_btn a:hover{background:#f26930;color: #fff;}
.qna.view .sec2 .content_wrap{border-top: 2px solid #000;}
.qna.view .sec2 .content_wrap li{border-bottom: 1px solid #575757;box-sizing: border-box;}
.qna.view .sec2 .content{margin: 30px 0;}
.qna.view .sec2 .content .list{padding: 20px;box-sizing: border-box;border-bottom: 1px solid #efefef;}
.qna.view .sec2 .content .list dl{display: flex;flex-direction: row;justify-content: flex-start;}
.qna.view .sec2 .content .list dl dd{width: 10%;text-align: center;color: #575757;height: 30px;line-height: 30px;}
.qna.view .sec2 .content .list dl .subj{width: 57%;text-align: left;font-weight: 600;color: #000;cursor: pointer;}
.qna.view .sec2 .content .list dl dd strong{font-weight: 600;color: #000;}
.qna.view .sec2 .content .list dl dd button{cursor: pointer;}
.qna.view .sec2 .content .list dl .more{width: 8%;}
.qna.view .sec2 .content .list dl .more button{background: transparent;transition: all 0.3s ease-in-out;}
.qna.view .sec2 .content .list dl .more button img{width: 20px; height: 30px;object-fit: contain;  filter: invert(32%) sepia(1%) saturate(2432%) hue-rotate(336deg) brightness(97%) contrast(84%);transform: rotate(-180deg);transition: all 0.3s ease;}
.qna.view .sec2 .content .list dl .more button.rotated img{transform: rotate(0deg);}
.qna.view .sec2 .content .list dl .btn{width: 15%;}
.qna.view .sec2 .content .list dl .btn button{height: 30px;padding: 0 8px;border-radius: 6px;background: #efefef;margin: 0 3px;transition: all 0.3s ease-in-out;}
.qna.view .sec2 .content .list dl .btn button:hover{background: #000;color: #fff;}
.qna.view .sec2 .content .view{display: none;}
.qna.view .sec2 .content .view .qa{display: flex;flex-direction: row;justify-content: flex-start;flex-wrap: wrap;padding: 20px;}
.qna.view .sec2 .content .view .qa .circle{width: 10%;}
.qna.view .sec2 .content .view .qa .circle span{width: 30px;height: 30px;border-radius: 50%;text-align: center;display: block;margin: 0 auto;box-sizing: border-box;line-height: 30px;}
.qna.view .sec2 .content .view .qa .txt{width: 90%;}
.qna.view .sec2 .content .view .qa .txt.wid80{width: 80%;}
.qna.view .sec2 .content .view .q{border-bottom: 1px solid #fff5ef;}
.qna.view .sec2 .content .view .a .date{text-align: center;color: #575757;}
.qna.view .sec2 .content .view .q .circle span{color: #f26930;border: 1px solid #f26930;}
.qna.view .sec2 .content .view .a .circle span{background: #f26930;color: #fff;}
.qna.view .sec2 .search{margin: 30px auto;max-width: 400px;width: 100%;display: flex;flex-direction: row;justify-content: center;}
.qna.view .sec2 .search input{width: calc(100% - 35px);box-sizing: border-box;border: 1px solid #efefef;transition: all 0.3s ease-in-out;border-top-left-radius: 6px;border-bottom-left-radius: 6px;padding: 8px 12px;}
.qna.view .sec2 .search input:focus{border: 1px solid #f26930;}
.qna.view .sec2 .search button{width: 45px;height: 45px;line-height: 45px;cursor: pointer;transition: all 0.3s ease-in-out;border-top-right-radius: 6px;border-bottom-right-radius: 6px;}
.qna.view .sec2 .search button img{height: 45px ;width: 15px;object-fit: contain;margin: 0 auto;transition: all 0.3s ease-in-out;}
.qna.view .sec2 .search button:hover{background: #000;}
.qna.view .sec2 .search button:hover img{filter: invert(1);}

.qna.view .sec2 .no_content{padding: 20px;text-align: center;}

.qna.write .sec2 .inner{border-top: 2px solid #000;}
.qna.write .sec2 dl{padding: 20px 0;display: flex;flex-direction: row;justify-content: flex-start;flex-wrap: wrap;border-bottom: 1px solid #efefef;}
.qna.write .sec2 dl dt{width: 15%;text-align: center;padding: 0 20px;font-weight: 600;line-height: 35px;}
.qna.write .sec2 dl dd{width: 85%;padding: 0 20px;}
.qna.write .sec2 dl dd input{width: 100%;height: 35px;border: 1px solid #efefef;padding: 0 15px;line-height: 35px;font-family: "Poppins", "Pretendard Variable", sans-serif;font-size: inherit;}
.qna.write .sec2 dl dd input.readonly{background: #efefef;}
.qna.write .sec2 dl dd textarea{width: 100%;padding: 15px;line-height: 1.4;border: 1px solid #efefef;}
.qna.write .sec2 .btn{display: flex;flex-direction: row;justify-content: center;margin: 30px auto;}
.qna.write .sec2 .btn a{width: 45%;max-width: 240px;margin: 0 2.5%;text-align: center;height: 40px;line-height: 40px;border-radius: 6px;background: #efefef;}
.qna.write .sec2 .btn a:last-child{background: #000;color: #fff;}

@media screen and (max-width:1200px) {
    .qna.view .sec2 .content{overflow-x: scroll;}
    .qna.view .sec2 .content_wrap{min-width: 850px;}
}


/*faq*/
.faq{margin-bottom: 50px;}
.faq .sec1 ul li{border-top: 1px solid #efefef;border-bottom: 1px solid #efefef;}
.faq .sec1 ul li:hover{background: #efefef;}
.faq .sec1 ul li .tit{display: flex;flex-direction: row;justify-content: flex-start;padding: 30px;cursor: pointer;}
.faq .sec1 ul li .tit .circle{width: 30px;height: 30px;line-height: 30px;box-sizing: border-box;border: 1px solid #f26930;border-radius: 50%;text-align: center;color: #f26930;margin-right: 12px;}
.faq .sec1 ul li h3{font-weight: 600;line-height: 30px;}

.faq .sec1 ul li .text{display: none;position: fixed;z-index: 999999;background: #00000099;top: 0;left: 0;width: 100vw;height: 100vh;flex-direction: column;justify-content: center;}
.faq .sec1 ul li .text.on{display: flex;}
.faq .sec1 ul li .text .inner{height: 90%;max-height: 880px;margin: auto;background: #fff;padding: 30px;border-radius: 20px;}

.faq .sec1 ul li .text .top .circle{width: 30px;height: 30px;line-height: 30px;box-sizing: border-box;border: 1px solid #f26930;border-radius: 50%;text-align: center;color: #f26930;margin-right: 12px;}
.faq .sec1 ul li .text .top .title{display: flex;flex-direction: row;justify-content: space-between;margin-bottom: 20px;}
.faq .sec1 ul li .text .top .title .wrap{display: flex;flex-direction: row;}
.faq .sec1 ul li .text .top button{width: 30px;background: transparent;cursor: pointer;}
.faq .sec1 ul li .text .top button img{width: 100%;}
.faq .sec1 ul li .text .content{padding: 30px;height: calc(100% - 60px)!important;overflow-y: scroll;display: block;}
.faq .sec1 ul li .text .content .editor-content{all:unset;display:revert}
.faq .sec1 ul li .text .content .editor-content img{max-width:100%; height:auto;}

@media screen and (max-width:1200px) {
    .faq .sec1 ul li h3{line-height: inherit;margin-top: 6px;}
    .faq .sec1 ul li .tit{display: block;padding: 20px;}
    .faq .sec1 ul li .tit .circle{width: 24px;height: 24px;line-height: 24px;}
    .faq .sec1 ul li .text .inner{padding: 20px;height: 95%;}
    .faq .sec1 ul li .text .top .title{margin-bottom: 8px;}
    .faq .sec1 ul li .text .top .title .wrap{display: block;}
    .faq .sec1 ul li .text .top button{align-self: flex-start;}
    .faq .sec1 ul li .text .top .circle{width: 24px;height: 24px;line-height: 24px;}
    .faq .sec1 ul li .text .content{padding: 20px;height: calc(100% - 96px)!important;display: block;}
}


/* mypage */
.mypage .mypage_wrap .inner{border-top: 2px solid #000;padding-top: 30px;position: relative;}
.mypage .aside{width: 240px;position: absolute;top: 30px;left: 0;}
.mypage .aside ul li a{display: block;border-bottom: 1px solid #efefef;padding: 12px;transition: all 0.3s ease-in-out;}
.mypage .aside ul li a:hover{background: #f26930;color: #fff;}
.mypage .aside ul li.on a{background: #f26930; color: #fff;}
.mypage .mypage_wrap .l_inner{width: calc(100% - 270px);margin: 0 0 50px auto;}
.mypage .mypage_wrap .sec h2{font-weight: 600;font-size: 24px;margin-bottom: 5px;}
.mypage nav{margin-bottom: 30px;}
.mypage nav ul{display: flex;flex-direction: row;justify-content: flex-start;}
.mypage nav ul li{margin-right: 8px;}
.mypage nav ul li a{height: 45px;line-height: 45px;padding: 0 25px;text-align: center;display: block;border: 1px solid #575757;border-radius: 4px;}
.mypage nav ul li.active a, .mypage nav ul li a:hover{background: #000;color: #fff;border: 1px solid #000;}

.mypage .sec .dl_p{text-align: left;margin: 10px 0;}
.mypage .sec .dl_p span{font-weight: 600;}
.mypage .sec .dl_p a{padding: 3px; text-align: center;border-radius: 4px;background: #efefef;transition: all 0.3s ease-in-out;}
.mypage .sec .dl_p a:hover{background: #000;color: #fff;}
.mypage .sec dl{display: flex;flex-direction: row;justify-content: flex-start;flex-wrap: wrap;}
.mypage .sec dl dt{background: #fff5ef;border: 1px solid #efefef;padding: 12px;font-weight: 600;text-align: center;}
.mypage .sec dl dd{border: 1px solid #efefef;padding: 12px;display: flex;flex-direction: column;justify-content: center;}
.mypage .sec dl dd button{font-size: inherit;cursor: pointer;text-align: center;border-radius: 4px;transition: all 0.3s ease-in-out;}
.mypage .sec dl dd button:hover{background: #000;color: #fff;}
.mypage .sec dl dt input[type="checkbox"]{width: 16px;height: 16px;margin: 0 auto;cursor: pointer;}
.mypage .sec dl dd input[type="checkbox"]{width: 16px;height: 16px;margin: 0 auto;cursor: pointer}

/*myin*/
.mypage .myin .sec .tit_wrap{display: flex;flex-direction: row;justify-content: space-between;flex-wrap: wrap;}
.mypage .myin .sec .tit_wrap a{color: #575757;text-decoration: underline;font-weight: 200;align-self: flex-end;transition: all 0.3s ease-in-out;}
.mypage .myin .sec .tit_wrap a:hover{color: #000;}
.mypage .myin .sec3 ul{display: flex;flex-direction: row;justify-content: center;flex-wrap: wrap;}
.mypage .myin .sec3 ul li{padding: 0 30px;text-align: center;height: 50px;line-height: 50px;border-radius: 4px;margin: 10px;background: #000;color: #fff;font-weight: 600;}
.mypage .myin .sec4 ul{display: flex;flex-direction: row;justify-content: space-around;flex-wrap: wrap;}
.mypage .myin .sec4 ul li{width: 45%;text-align: center;}
.mypage .myin .sec4 ul li h5{font-weight: 600;font-size: 1.2em;}
.mypage .myin .sec4 ul li .txt_wrap{margin: 15px auto;width: 200px;height: 200px;border-radius: 50%;box-shadow: 0 6px 15px rgba(36, 37, 38, 0.25);display: flex;flex-direction: column;justify-content: center;}
.mypage .myin .sec4 ul li .txt_wrap p span{font-size: 5em;font-weight: 600;color: #f26930;}

/* 사용중인서비스  */
.mypage .status .sec2 #ipchg_cnt_deduct{color: #b50000;}
.mypage .status .sec2 dl .dd_wrap{width: 100%;display: flex;flex-direction: row;justify-content: flex-start;flex-wrap: wrap;}
.mypage .status .sec2 dl .item1{width: 13%;}
.mypage .status .sec2 dl .item2{width: 15%;}
.mypage .status .sec2 dl .item3{width: 17%;}
.mypage .status .sec2 dl .item4{width: 16%;}
.mypage .status .sec2 dl .item5{width: 8%;}
.mypage .status .sec2 dl .item6{width: 31%;}
.mypage .status .sec2 dl dd{text-align: center;}
.mypage .status .sec2 dl dt.item1{display: flex;flex-direction: row;justify-content: center;position: relative;cursor: pointer;transition: all 0.3s ease-in-out;}
.mypage .status .sec2 dl dt.item1 img{width: 15px;margin-left: 3px;transition: all 0.3s ease-in-out;}
.mypage .status .sec2 dl dt.item1:hover{background: #000;color: #fff;}
.mypage .status .sec2 dl dt.item1:hover img{filter: invert(1);}
.mypage .status .sec2 dl dt.item1 ul{position: absolute;top: 40px;right: 0;width: 85%;background: #fff;border-radius: 8px;box-shadow: 3px 4px 4px rgba(0,0,0,0.2);padding: 6px 0; display: none;overflow: hidden;color: #000;}
.mypage .status .sec2 dl dt.item1 ul.on{display: block;}
.mypage .status .sec2 dl dt.item1 ul li{height: 26px;line-height: 26px;padding: 0 6px;cursor: pointer;font-weight: 300;font-size: 0.85em;transition: all 0.3s ease-in-out;}
.mypage .status .sec2 dl dt.item1 ul li:hover{background: #efefef;}
.mypage .status .sec2 dl dd.item3{flex-direction: row;justify-content: space-around;}
.mypage .status .sec2 dl dd.item3 button{align-self: center;height: 35px;line-height: 35px;}
.mypage .status .sec2 .btn{margin-top: 30px;}
.mypage .status .sec2 .btn button{max-width: 240px;border-radius: 6px;height: 40px;line-height: 40px;background: #000;color: #fff;text-align: center;margin: 0 auto;display: block;width: 100%;cursor: pointer;font-size: inherit;font-weight: 600;}
.mypage .status .sec2 dl dd.item6 .input_wrap{display: flex;flex-direction: row;justify-content: space-between;}
.mypage .status .sec2 dl dd.item6 .input_wrap input{width: calc(100% - 45px);padding: 5px 7px;background: #efefef;height: 35px;line-height: 35px;border-radius: 4px;}
.mypage .status .sec3 dl .item1{width: 20%;}
.mypage .status .sec3 dl .item2{width: 40%;}
.mypage .status .sec3 dl .item3{width: 40%;}
.mypage .status .sec3 dl dd{text-align: center;}

/* account */
.mypage .account .sec2 .modal{position: fixed;width: 100vw;height: 100vh;top: 0;left: 50%;transform: translateX(-50%);background: #00000099;z-index: 99999;display: flex;flex-direction: column;justify-content: center;display: none;}
.mypage .account .sec2 .modal .inner{background: #fff;border-radius: 30px;height: 90%;padding: 50px;position: relative;}
.mypage .account .sec2 .modal .top{display: flex;flex-direction: row;justify-content: flex-end;}
.mypage .account .sec2 .modal .top .close_btn{width: 30px;background: transparent;cursor: pointer;}
.mypage .account .sec2 .edit_btn{margin-top: 30px;}
.mypage .account .sec2 .edit_btn button{max-width: 240px;border-radius: 6px;height: 40px;line-height: 40px;background: #000;color: #fff;text-align: center;margin: 0 auto;display: block;width: 100%;cursor: pointer;font-size: inherit;font-weight: 600;}
.mypage .account .sec2 .modal .content{height: calc(100% - 26px);overflow-y: scroll;}
.mypage .account .sec2 .modal dl dt{width: 30%;display: flex;flex-direction: column;justify-content: center;}
.mypage .account .sec2 .modal dl dd{width: 70%;}
.mypage .account .sec2 .modal dl dd input{font-size: inherit;background: #efefef;height: 30px;line-height: 30px;padding: 0 8px;}
.mypage .account .sec2 .modal dl dd .password_btn{width: fit-content;padding: 0 20px;}
.mypage .account .sec2 .modal dl .password{width: 100%;display: none;}
.mypage .account .sec2 .modal dl .password_wrap{display: flex; flex-direction: row;justify-content: flex-start;flex-wrap: wrap;}
.mypage .account .sec2 .modal dl .password .btn{width: 100%;flex-direction: row;justify-content: center;}
.mypage .account .sec2 .modal dl .password .btn button{width: fit-content;padding: 0 12px;}
.mypage .account .sec2 .modal dl .password .btn button:nth-child(1){background: #f26930;color: #fff;margin-right: 6px;}
.mypage .account .sec2 .modal dl dd .input_wrap{display: flex;flex-direction: row;justify-content: space-between;}
.mypage .account .sec2 .modal dl dd .input_wrap input{width: 30%;}
.mypage .account .sec2 .modal dl dd .input_wrap span{line-height: 30px;}
.mypage .account .sec2 .modal dl .addr{flex-direction: row;justify-content: flex-start;flex-wrap: wrap;}
.mypage .account .sec2 .modal dl .addr .zipcode{width: 200px;}
.mypage .account .sec2 .modal dl .addr .zipcode_btn{width: 200px;background: #000;color: #fff;border-radius: 6px;text-align: center;transition: all 0.3s ease-in-out;margin-bottom: 6px;margin-left: 6px;line-height: 30px;}
.mypage .account .sec2 .modal dl .addr input{margin-bottom: 6px;width: 100%;}
.mypage .account .sec2 .modify_btn{margin-top: 30px;}
.mypage .account .sec2 .modify_btn button{max-width: 240px;border-radius: 6px;height: 40px;line-height: 40px;background: #000;color: #fff;text-align: center;margin: 0 auto;display: block;width: 100%;cursor: pointer;font-size: inherit;font-weight: 600;}
.mypage .account .sec3 .top_btn{display: flex;flex-direction: row;justify-content: flex-end;margin-bottom: 20px;}
.mypage .account .sec3 .top_btn button{line-height: 35px;height: 35px;padding: 0 16px;font-size: inherit;background: #000;color: #fff;font-weight: 600;border-radius: 4px;cursor: pointer;transition: all 0.3s ease-in-out;}
.mypage .account .sec3 .top_btn button:hover{background: #f26930;}
.mypage .account .sec3 .dl_wrap dl dd{text-align: center;}
.mypage .account .sec3 .pop{position: fixed;top: 0;left: 0;width: 100vw;height: 100vh;background: #00000099;display: flex;flex-direction: column;justify-content: center;z-index: 9999;}
.mypage .account .sec3 .pop .inner{background: #fff;border-radius: 30px;height: 90%;padding: 50px;}
.mypage .account .sec3 .pop .top{display: flex;flex-direction: row;justify-content: space-between}
.mypage .account .sec3 .pop dl dt{display: flex;flex-direction: column;justify-content: center;}
.mypage .account .sec3 .pop dl dd input{background: #efefef;padding: 0 12px;line-height: 35px;border-radius: 4px;}
.mypage .account .sec3 .pop dl dd span{line-height: 35px;}
.mypage .account .sec3 .pop dl dd p{font-size: 0.85em;}
.mypage .account .sec3 .pop dl dd.num{display: flex;flex-direction: row;justify-content: space-between;}
.mypage .account .sec3 .pop dl dd.num input{width: 30%;}
.mypage .account .sec3 .pop dl dd .password_chg_btn{padding: 0 20px;width: fit-content;background: #000;color: #fff;}
.mypage .account .sec3 .pop dl .password_chg{display: none;}
.mypage .account .sec3 .pop dl .password_chg .password_chg_wrap{flex-direction: row;justify-content: flex-start;flex-wrap: wrap;display: flex;}
.mypage .account .sec3 .pop dl .password_chg .btn{flex-direction: row;justify-content: center;}
.mypage .account .sec3 .pop dl .password_chg .btn button:last-child{background: #f26930;color: #fff;margin-left: 6px;}
.mypage .account .sec3 .pop dl .password_chg .btn button:last-child:hover{background: #000;}
.mypage .account .sec3 .pop .btn_wrap{margin-top: 30px; display: flex;flex-direction: row;justify-content: center;}
.mypage .account .sec3 .pop .btn_wrap button{line-height: 35px;padding: 0 24px;font-size: inherit;border-radius: 4px;cursor: pointer;}
.mypage .account .sec3 .pop .btn_wrap button:last-child{background: #000;color: #fff;margin-left: 6px;}
.mypage .account .sec3 .pop .btn_wrap button:last-child:hover{background: #f26930;}

/* 결제내역 */
.mypage .history .sec2 ul li{border-bottom: 1px solid #000;box-sizing: border-box;}
.mypage .history .sec2 ul li .content{padding: 12px;box-sizing: border-box;border-bottom: 1px solid #efefef;display: flex;flex-direction: row;justify-content: space-between;flex-wrap: wrap;cursor: pointer;}

.mypage .history .sec2 ul li .content .left{display: flex;flex-direction: row;justify-content: flex-start;}
.mypage .history .sec2 ul li .content .left .item{display: flex;flex-direction: row;justify-content: flex-start;margin-left: 15px;border-left: 1px solid #575757;padding-left: 15px;}
.mypage .history .sec2 ul li .content .left .item:first-child{margin-left: 0;padding-left: 0;border-left: none;}
.mypage .history .sec2 ul li .content .left .item h6{margin-right: 8px;}
.mypage .history .sec2 ul li .content .left h5{font-weight: 600;font-size: 1.2em;}
.mypage .history .sec2 ul li .content .left h5.red{color: #b50000}
.mypage .history .sec2 ul li .content .left h5 span{font-size: 0.7em;}
.mypage .history .sec2 ul li .content .left button{background: #000;padding: 0;cursor: pointer;border-radius: 5px;padding: 0 4px;color: #fff;}
.mypage .history .sec2 ul li .content .right button{background: transparent;font-size: inherit;cursor: pointer;display: flex;}
.mypage .history .sec2 ul li .content .right button img{width: 14px;align-self: center;transform: rotate(-180deg);transition: all 0.3s ease-in-out;}
.mypage .history .sec2 ul li .content .right button img.on{transform: rotate(0deg);}
.mypage .history .sec2 ul li .content .right h5{font-weight: 600;font-size: 1.2em;}

.mypage .history .sec2 ul li .content1{padding: 12px;background: #fff5ef;}
.mypage .history .sec2 ul li .content2 .receipt_btn{height: 25px;padding: 0 4px;background: #efefef;border-radius: 4px;text-align: center;line-height: 25px;font-size: 0.95em;display: block;transition: all 0.3s ease-in-out;}
.mypage .history .sec2 ul li .content2 .receipt_btn:hover{background: #000;color: #fff;}
.mypage .history .sec2 ul li dl.content {display: none;}
.mypage .history .sec2 ul li dl.content dt{background: #efefef;}
.mypage .history .sec2 ul li dl .item{width: 15%;text-align: center;}
.mypage .history .sec2 ul li dl .item1{width: 5%;}
.mypage .history .sec2 ul li dl .item3{width: 20%;}
.mypage .history .sec2 ul li dl dd.item5, .mypage .history .sec2 ul li dl dd.item6{text-align: right;}
.mypage .history .sec2 .list_nav{margin: 20px auto;}
.mypage .history .sec2 .list_nav{margin: 20px auto;}
.mypage .history .sec2 .list_nav ol{display: flex;flex-direction: row;justify-content: center;}
.mypage .history .sec2 .list_nav ol li{margin: 0 4px;}
.mypage .history .sec2 .list_nav ol li a{box-sizing: border-box; height: 35px; width: 35px;border-radius: 6px;border: 1px solid #efefef;display: block;line-height: 35px;text-align: center;transition: all 0.3s ease-in-out;}
.mypage .history .sec2 .list_nav ol li a img{width: 10px;height: 35px;object-fit: contain;display: block;margin: auto;transition: all 0.3s ease-in-out;}
.mypage .history .sec2 .list_nav ol li a:hover{background: #000;color: #fff;}
.mypage .history .sec2 .list_nav ol li a:hover img{filter: invert(1);}
.mypage .history .sec2 .list_nav ol li a.active{background: #000;color: #fff;}

.mypage .history .vbank_area{position: fixed;top: 50%;left: 50%;transform: translate(-50%, -50%);display: none;}
.mypage .history .vbank_area.on{display: block;}
.mypage .history .vbank_area .s_inner{position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%); padding: 20px;border-radius: 15px;background: #fff;box-shadow: 8px 9px 9px rgba(0,0,0,0.2);width: 100vw;}
.mypage .history .vbank_area .s_inner dl dt{width: 30%;word-break: keep-all;white-space: nowrap;}
.mypage .history .vbank_area .s_inner dl dd{width: 70%;word-break: keep-all;white-space: nowrap;}
.mypage .history .vbank_area .s_inner .top{display: flex;justify-content: flex-end;}
.mypage .history .vbank_area .s_inner .top button{background: transparent;width: 30px;margin-bottom: 4px;cursor: pointer;}
.mypage .history .vbank_area .s_inner .vbank_wrap{max-width: 450px ;}

.mypage .payment .sec h3{text-align: center;font-weight: 600;position: relative;margin-bottom: 45px;font-size: 24px;}
.mypage .payment .sec h3:after{    position: absolute;width: 3px;height: 30px;background: #f26930;content: '';bottom: -50px;left: 50%;transform: translateY(-50%);}
.mypage .payment .sec .won{text-align: right;font-weight: 600;font-size: 18px;margin: 15px 0;}
.mypage .payment .sec .won span{font-size: 1.6em;}
.mypage .payment .sec .surtax{text-align: right;}
.mypage .payment .payment_vpn .sec2 dl dd{text-align: center;}
.mypage .payment .payment_vpn .sec2 dl .dd_wrap{width: 100%;display: flex;flex-direction: row;justify-content: flex-start;flex-wrap: wrap;}
.mypage .payment .payment_vpn .sec2 dl .item1{width: 6%;}
.mypage .payment .payment_vpn .sec2 dl .item2{width: 14%;}
.mypage .payment .payment_vpn .sec2 dl .item3{width: 14%;}
.mypage .payment .payment_vpn .sec2 dl .item4{width: 14%;}
.mypage .payment .payment_vpn .sec2 dl .item5{width: 14%;}
.mypage .payment .payment_vpn .sec2 dl .item6{width: 13%;}
.mypage .payment .payment_vpn .sec2 dl .item7{width: 12%;}
.mypage .payment .payment_vpn .sec2 dl .item8{width: 13%;}
.mypage .payment .payment_vpn .sec2 dl .item9{width: 100%;}
.mypage .payment .payment_vpn .sec2 dl dd.item6{word-break: break-all;}
.mypage .payment .payment_vpn .sec2 dl dd.item7 select{border: 1px solid #000;padding: 4px;border-radius: 4px;font-size: inherit;cursor: pointer;}
.mypage .payment .payment_vpn .sec2 dl dt.item2{display: flex;flex-direction: row;justify-content: center;position: relative;cursor: pointer;transition: all 0.3s ease-in-out;}
.mypage .payment .payment_vpn .sec2 dl dt.item2 img{width: 15px;margin-left: 3px;transition: all 0.3s ease-in-out;}
.mypage .payment .payment_vpn .sec2 dl dt.item2:hover{background: #000;color: #fff;}
.mypage .payment .payment_vpn .sec2 dl dt.item2:hover img{filter: invert(1);}
.mypage .payment .payment_vpn .sec2 dl dt.item2 ul{position: absolute;top: 40px;right: 0;width: 85%;background: #fff;border-radius: 8px;box-shadow: 3px 4px 4px rgba(0,0,0,0.2);padding: 6px 0; display: none;overflow: hidden;color: #000;}
.mypage .payment .payment_vpn .sec2 dl dt.item2 ul.on{display: block;}
.mypage .payment .payment_vpn .sec2 dl dt.item2 ul li{height: 26px;line-height: 26px;padding: 0 6px;cursor: pointer;font-weight: 300;font-size: 0.85em;transition: all 0.3s ease-in-out;}
.mypage .payment .payment_vpn .sec2 dl dt.item2 ul li:hover{background: #efefef;}
.mypage .payment .payment_vpn .sec3 .caption{display: flex;flex-direction: row;justify-content: space-between;flex-wrap: wrap;}
.mypage .payment .payment_vpn .sec3 .caption p{align-self: flex-end;}
.mypage .payment .payment_vpn .sec3 .select_wrap{display: flex;flex-direction: row;margin-bottom: 6px;}
.mypage .payment .payment_vpn .sec3 .select_wrap .select{margin-right: 6px;}
.mypage .payment .payment_vpn .sec3 .select_wrap .select h6{font-weight: 600;}
.mypage .payment .payment_vpn .sec3 .select_wrap .select select{border: 1px solid #000;border-radius: 3px;padding: 0 24px;line-height: 35px;height: 35px;box-sizing: border-box;cursor: pointer;font-size: inherit;}
.mypage .payment .payment_vpn .sec3 .select_wrap .btn{margin-top: 25px;display: flex;flex-direction: row;}
.mypage .payment .payment_vpn .sec3 .select_wrap .btn button{line-height: 35px;height: 35px;padding: 0 24px;border-radius: 4px ;background: #000;color: #fff;font-weight: 600;cursor: pointer;transition: all 0.3s ease-in-out;margin-right: 6px;}
.mypage .payment .payment_vpn .sec3 .select_wrap .btn button:hover{background: #f26930;}
.mypage .payment .payment_vpn .sec3 dl .item1{width: 6%;}
.mypage .payment .payment_vpn .sec3 dl .item2{width: 15%;}
.mypage .payment .payment_vpn .sec3 dl .item3{width: 15%;}
.mypage .payment .payment_vpn .sec3 dl .item4{width: 13%;}
.mypage .payment .payment_vpn .sec3 dl .item5{width: 17%;}
.mypage .payment .payment_vpn .sec3 dl .item6{width: 17%;}
.mypage .payment .payment_vpn .sec3 dl .item7{width: 17%;}
.mypage .payment .payment_vpn .sec3 dl .item8{width: 100%;}
.mypage .payment .payment_vpn .sec3 dl .dd_wrap{width: 100%;display: flex;flex-direction: row;justify-content: flex-start;flex-wrap: wrap;}
.mypage .payment .payment_vpn .sec3 dl dd{text-align: center;}
.mypage .payment .payment_vpn .sec3 dl dd.item6 select{border: 1px solid #000;padding: 4px;border-radius: 4px;font-size: inherit;cursor: pointer;}


.mypage .payment .payment_proxy .sec2 dl .item1{width: 6%;}
.mypage .payment .payment_proxy .sec2 dl .item2{width: 14%;}
.mypage .payment .payment_proxy .sec2 dl .item3{width: 20%;}
.mypage .payment .payment_proxy .sec2 dl .item4{width: 20%;}
.mypage .payment .payment_proxy .sec2 dl .item5{width: 20%;}
.mypage .payment .payment_proxy .sec2 dl .item6{width: 20%;}
.mypage .payment .payment_proxy .sec2 dl .dl_wrap{width: 100%;display: flex;flex-direction: row;justify-content: flex-start;flex-wrap: wrap;}
.mypage .payment .payment_proxy .sec2 dl dd{text-align: center;}
.mypage .payment .payment_proxy .sec2 dl dd.item4{color: #b50000;font-weight: 600;}
.mypage .payment .payment_proxy .sec2 dl dd.item5 select{border: 1px solid #000;padding: 4px;border-radius: 4px;font-size: inherit;cursor: pointer;}
.mypage .payment .payment_proxy .sec3 dl dt, .mypage .payment .payment_proxy .sec3 dl dd{width: 25%;}
.mypage .payment .payment_proxy .sec3 dl .last{display: flex;flex-direction: column;justify-content: center;}
.mypage .payment .payment_proxy .sec3 dl dd.last{font-size: 1.6em;font-weight: 600;color: #b50000}
.mypage .payment .payment_proxy .sec3 .btn{margin-top: 30px;}
.mypage .payment .payment_proxy .sec3 .btn button{max-width: 240px;border-radius: 6px;height: 40px;line-height: 40px;background: #000;color: #fff;text-align: center;margin: 0 auto;display: block;width: 100%;cursor: pointer;font-size: inherit;font-weight: 600;}
.mypage .payment .payment_proxy .sec3 .btn button:hover{background: #f26930;}
.mypage .payment .chg_vpn .quantity-control{margin-top: 8px;display: flex;flex-direction: row;justify-content: center;}
.mypage .payment .chg_vpn .quantity-input{background: #efefef;text-align: center;padding: 0 6px;border-radius: 4px;line-height: 30px; height: 30px;margin: 0 6px;font-size: inherit;max-width: 110px;}
.mypage .payment .chg_vpn .sec2 button{height: 30px;line-height: 30px;font-size: inherit;padding: 0 8px;}
.mypage .payment .chg_vpn .sec2 button:hover{background: #000;}
.mypage .payment .chg_vpn .sec2 dl dt{display: flex;flex-direction: column;justify-content: center;}
.mypage .payment .chg_vpn .sec2 dl dt, .mypage .payment .chg_vpn .sec2 dl dd{width: 50%;}
.mypage .payment .chg_vpn .sec2 dl dd{text-align: center;}
.mypage .payment .chg_vpn .sec3 dl dt, .mypage .payment .chg_vpn .sec3 dl dd{width: 25%;}
.mypage .payment .chg_vpn .sec3 dl .last{display: flex;flex-direction: column;justify-content: center;}

.mypage .payment .paysec{position: fixed;left: 0;bottom:-162px; width: 100%;background: #fff;box-sizing: border-box;border-top: 4px solid #f26930;transition: all 0.5s ease-in-out;min-height:219px}
.mypage .payment .paysec.on{bottom: 0;}
.mypage .payment .paysec .updown_btn{margin: 0 auto;width: 30px;background: transparent;display: block;cursor:pointer}
.mypage .payment .paysec.on .updown_btn img{transform: rotate(-180deg);transition:all 0.3s ease-in-out;}
.mypage .payment .paysec .inner{border: none;padding: 12px 0;}
.mypage .payment .paysec .container{display: flex;flex-direction: row;justify-content: space-between;}
.mypage .payment .paysec .container dl{height: fit-content;align-self:flex-start;width: calc(100% - 250px);}
.mypage .payment .paysec .container dl dt{padding: 6px 8px;width: 20%;}
.mypage .payment .paysec .container dl dd{padding: 6px 8px;width: 30%;} 
.mypage .payment .payment_vpn .paysec .container dl #tax-paysec{width: 80%;}
.mypage .payment .paysec .container #total_pay h6{text-align: right;font-weight: 600;font-size: 2em;}
.mypage .payment .paysec .container #total_pay button{padding: 0 8px;height: 35px;line-height: 35px; min-width: 200px;background: #000;color: #fff;border-radius: 6px;cursor: pointer;font-weight: 600;}
.mypage .payment .paysec .container #total_pay button:hover{background: #f26930;}

#bank_transfer.on{display: block;}
#bank_transfer{display: none;}
.mypage .payment .pay_common nav{margin-bottom: 15px;}
.mypage .payment .pay_common nav ul{display: flex;flex-direction: row;justify-content: flex-start;}
.mypage .payment .pay_common nav ul li{height: 45px;line-height: 45px;text-align: center;padding: 0 25px;border-radius: 4px;border: 1px solid #000;box-sizing: border-box;cursor: pointer;}
.mypage .payment .pay_common nav ul li.active{background: #000;color: #fff;}
.mypage .payment .pay_common .content{display: none;transition: all 0.3s ease-in-out;}
.mypage .payment .pay_common .content.on{display: block;}
.mypage .payment .pay_common .content .right{text-align: right;}
.mypage .payment .pay_common .content dt{display: flex;flex-direction: column;justify-content: center;width: 30%;}
.mypage .payment .pay_common .content dd{width: 70%;}
.mypage .payment .pay_common .content dd input{background: #efefef;line-height: 35px;padding: 0 6px;border-radius: 4px;}
.mypage .payment .pay_common .content dd select{background: #efefef;line-height: 35px;padding: 0 6px;border-radius: 4px;height: 35px;cursor: pointer;}
.mypage .payment .pay_common .content dd.three{flex-direction: row;justify-content: space-between;}
.mypage .payment .pay_common .content dd.three input{width: 30%;}
.mypage .payment .pay_common .content dd.three span{width: 5%;text-align: center;line-height: 35px;}
.mypage .payment .pay_common .content dd.address{flex-direction: row;justify-content: flex-start;flex-wrap: wrap;}
.mypage .payment .pay_common .content dd.address #etax_bill_zipcode{width: 30%;margin-right: 8px;}
.mypage .payment .pay_common .content dd.address button{width: 20%;margin-bottom: 6px;background: #000;color: #fff;}
.mypage .payment .pay_common .content dd.address input{width: 100%;margin-bottom: 6px;}
.mypage .payment .pay_common .content dd.address input:read-only{background: #bbbbbb;}

.mypage .payment .price_btn{margin:6px auto 6px 0;font-size: inherit; padding: 6px 12px; border-radius: 6px;transition: all 0.3s ease-in-out;cursor: pointer;display: block;width: fit-content;}
.mypage .payment .price_btn:hover{background: #000;color: #fff;}
.mypage .payment .price_pop{display: none; position: fixed;top: 0;left: 0;width: 100vw;height: 100vh;flex-direction: column;justify-content: center;background: #00000099;z-index: 99999;}
.mypage .payment .price_pop.on{display: flex;}
.mypage .payment .price_pop .inner{background: #fff;padding: 30px;background: #fff;border-radius: 15px;}
.mypage .payment .price_pop .top{display: flex;flex-direction: row;justify-content: flex-end;}
.mypage .payment .price_pop .top button{width: 30px;background: transparent;cursor: pointer;}
.mypage .payment .price_pop .top button:hover{background: transparent;}
.mypage .payment .price_pop .top button img{width: 100%;}
.mypage .payment .price_pop .table_wrap{}
.mypage .payment .price_pop table{border-collapse: collapse;width: 100%;margin: 10px 0;}
.mypage .payment .price_pop table caption{text-align: right;}
.mypage .payment .price_pop table th{padding: 12px;border-top: 2px solid #f26930;border-bottom: 1px solid #000;border-left: 1px solid #efefef;border-right: 1px solid #efefef;background: #fff5ef;}
.mypage .payment .price_pop table td{padding: 12px;text-align: center;border: 1px solid #efefef;}

.payment_end .sec1{text-align: center;}
.payment_end .sec1 h3{font-weight: 600;font-size: 22px;}
.payment_end .sec1 .detail{background: #efefef;padding: 30px;margin: 20px auto;}
.payment_end .sec1 .detail_box{padding: 30px;box-sizing: border-box;border: 2px solid #f26930;}
.payment_end .sec1 h5{font-weight: 600;}
.payment_end .sec1 .btn{max-width: 240px;border-radius: 6px;height: 40px;line-height: 40px;background: #000;color: #fff;text-align: center;margin: 30px auto;display: block;width: 100%;cursor: pointer;font-size: inherit;font-weight: 600;}


@media screen and (max-width: 1200px) {
    
    .mypage .aside{width: 100%;position: static;margin-bottom: 30px;overflow-x: scroll;}
    .mypage .aside ul{display: flex;flex-direction: row;justify-content: flex-start;}
    .mypage .aside ul li{margin-right: 4px;}
    .mypage .aside ul li a{border: 1px solid #efefef;border-radius: 4px;padding: 6px;word-break: keep-all;white-space: nowrap;}

    .mypage nav{overflow-x: scroll;}
    .mypage nav ul li a{line-height: 30px;height: 30px;padding: 0 8px;word-break: keep-all;white-space: nowrap;}

    .mypage .sec dl dt{padding: 8px;}
    .mypage .sec dl dd{padding: 8px;}
    
    .mypage .mypage_wrap .l_inner{width: 100%;}

    .mypage .status .sec2 .dl_wrap{overflow-x: scroll;}
    .mypage .status .sec2 dl{min-width: 1000px}

    .mypage .account .sec2 .modal .inner{padding: 20px;}
    .mypage .account .sec3 .pop .inner{padding: 20px}

    .mypage .mypage_wrap .sec h2{font-size: 16px;}
    .mypage .payment .price_pop .inner{padding: 20px;height: 100vh;}
    .mypage .payment .price_pop .table_wrap{overflow-x: scroll;}
    .mypage .payment .price_pop .table_wrap table{min-width: 450px;}
    .mypage .payment .price_pop .content{height: calc(100% - 26px);overflow-y: scroll;}
    .mypage .payment table th{padding: 6px!important;}
    .mypage .payment table td{padding: 6px!important;}
    .mypage .payment .pay_common nav{overflow-x: scroll;}
    .mypage .payment .pay_common nav ul{}
    .mypage .payment .pay_common nav ul li{height: 35px;line-height: 35px;padding: 0 12px;word-break: keep-all;white-space:nowrap;}
    .mypage .payment .payment_proxy .sec2 dl{overflow-x: scroll;}
    .mypage .payment .payment_proxy .sec2 dl .dl_wrap{min-width: 750px;}
    .mypage .payment .payment_vpn .sec3 .select_wrap{overflow-x: scroll;}
    .mypage .payment .payment_vpn .sec3 .select_wrap .btn{margin-top: 21px;}

    .mypage .payment .paysec{top: calc(100vh - 50px);bottom: auto;}
    .mypage .payment .paysec.on{bottom: 0;top: auto;}
    .mypage .payment .paysec h2{text-align: center;}
    .mypage .payment .paysec .container{flex-wrap: wrap;}
    .mypage .payment .paysec .container dl{width: 100%;}
    .mypage .payment .paysec .container #total_pay h6{font-size: 1.4em;}
    .mypage .payment .paysec .container #total_pay{width: 100%;}
    .mypage .payment .paysec .container #total_pay button{width: 100%;}

    .mypage .myin .sec3 ul{justify-content: flex-start;}
    .mypage .myin .sec3 ul li{padding: 0 8px;line-height: 35px;height: 35px;}
    .mypage .myin .sec4 ul li .txt_wrap{width: 100px;height: 100px;}
    .mypage .myin .sec4 ul li .txt_wrap p span{font-size: 3.5em;}

    .mypage .mypage_wrap .sec .dl_wrap{overflow-x: scroll;}
    
    .mypage .mypage_wrap .sec .dl_wrap dl{min-width: 750px;}
    

    
    .mypage .history .sec2 ul li .content{padding: 8px;}
    .mypage .history .sec2 ul li dl.content dt{font-size: 12px;padding: 4px;}
    .mypage .history .sec2 ul li dl.content dd{font-size: 12px;padding: 4px;}
    .mypage .history .vbank_area .s_inner{width: 100vw;}
    .mypage .history .vbank_area .s_inner .vbank_wrap{overflow-x: scroll;}
}

@media screen and (max-width: 600px) {
    .mypage .history .sec2 ul li .content1{display: block;}
    .mypage .history .sec2 ul li .content1 .right{display: flex;justify-content: flex-end;}
}





.test_service{background-image: linear-gradient(-20deg, #e9defa 0%, #fbfcdb 100%);margin-bottom: 0;}
.test_service .sec2{padding: 50px 0;}
.test_service .sec2 ul{display: flex;flex-direction: row;justify-content: space-around;flex-wrap: wrap;}
.test_service .sec2 ul li{width: 35%;border-radius: 6px;padding: 35px;background: #fff;text-align: center;margin-bottom: 30px;position: relative;}
.test_service .sec2 ul li h4{font-size: 20px;font-weight: 600;background: #000;color: #fff;border-radius: 4px;margin: 0 auto;height: 46px;line-height: 46px; position: absolute;top: -23px; left: 50%;transform: translateX(-50%); width: 85%;}
.test_service .sec2 ul li p{margin: 20px auto;}
.test_service .sec2 ul li .img_wrap{width: 180px;height: 180px;margin: 20px auto;border-radius: 50%;overflow: hidden;box-shadow: 2px 2px 20px 0 rgba(26,26,26,0.10);}
.test_service .sec2 ul li .img_wrap img{width: 100%;height: 100%;object-fit: cover;}
.test_service .sec2 ul li h5{font-weight: 700;font-size: 36px;}
.test_service .sec2 ul li .btn{padding: 8px 12px;border-radius: 4px;display: block;margin: 20px auto;width: fit-content;font-weight: 600;background: #000;color: #fff;transition: all 0.3s ease-in-out;cursor:default}
.test_service .sec2 ul li .btn:hover{background: #f26930;}
.test_service .sec2 ul li.down{box-sizing: border-box;border: 1px solid #000;color: #fff;background: #000;padding: 0;border-radius: 6px;transition: all 0.3s ease-in-out;}
.test_service .sec2 ul li.down a{font-weight: bold;display: block;padding: 12px 0;transition: all 0.3s ease-in-out;}
.test_service .sec2 ul li.down:hover{background:#f26930;border: 1px solid #f26930;}
.test_service .sec2 ul li.down:hover a{color: #fff;}
.test_service .sec3 iframe{margin: 0 auto;max-width: 560px;width: 100%;}
.test_service .sec4{padding-bottom: 50px;}
.test_service .sec4 ol{list-style: decimal;background: #fff;border-radius: 25px;padding: 30px;padding-left: 50px;}
.test_service .sec4 ol li{margin: 6px 0;}
.test_service .sec4 ol li u{font-weight: 700;position: relative;z-index: 1;text-decoration: none;font-size: 1.2em;}
.test_service .sec4 ol li u:after{position: absolute;content: '';width: 100%;height: 40%;bottom: 0;left: 0;background: #f26930;z-index: -1;opacity: 0.3;}

@media screen and (max-width:1200px) {
    .test_service .sec2 ul li{width: 48%;padding: 12px;margin-bottom: 8px;}
    .test_service .sec2 ul li.down{margin-bottom: 50px;}
    .test_service .sec2 ul li h4{font-size: 16px;}
    .test_service .sec2 ul li .img_wrap{width: 80px;height: 80px;margin: 15px auto;}
    .test_service .sec2 ul li h5{font-size: 20px;}
}
@media screen and (max-width:600px) {
    .test_service .sec2 ul li{width: 100%;}
    .test_service .sec2 ul li:nth-child(1){order: 1;}
    .test_service .sec2 ul li:nth-child(2){order: 3;}
    .test_service .sec2 ul li:nth-child(3){order: 2;}
    .test_service .sec2 ul li:nth-child(4){order: 4;}
}






/* 
.mypage .sec dl{border-top: 2px solid #000;border-bottom: 2px solid #000;margin: 8px 0;}
.mypage .sec dl dt, .mypage .sec dl dd{display: flex;flex-direction: row;justify-content: flex-start;}
.mypage .sec dl dt{background: #efefef;border-bottom: 1px solid #000;}
.mypage .sec dl .dl_item{padding: 12px 6px;text-align: center;border: 1px solid #efefef;}
.mypage .sec dl .dl_item button{font-size: inherit;cursor: pointer;text-align: center;border-radius: 4px;transition: all 0.3s ease-in-out;}
.mypage .sec dl .dl_item button:hover{background: #000;color: #fff;} */