@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Anton&family=Archivo+Black&family=Bungee&family=Monoton&family=Quantico:ital,wght@0,400;0,700;1,400;1,700&family=Teko:wght@300..700&display=swap');

@font-face {
    font-family:'GmarketSans';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');
    font-weight:500;
    font-style:normal;
}

@font-face {
    font-family:'GmarketSans';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansLight.woff') format('woff');
    font-weight:300;
    font-style:normal;
}

@font-face {
    font-family:'GmarketSans';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff') format('woff');
    font-weight:800;
    font-style:normal;
}

/* CSS Reset */
body,html,
header,footer,aside,nav,section,article,details,figure,figcaption,menu,command,
div,dl,dd,ol,ul,li,form,fieldset,legend,iframe,table,caption,thead,tfoot,tbody,tr,th,td, /* Block Element */
h1,h2,h3,h4,h5,h6,dt,summary,input,textarea,button,select,datalist,
img,embed,object,canvas,audio,video,meter,progress,keygen, /* Inline Block Element */
a,label,output,dialog, /* Inline Element */
address,blockquote, /* Text Block Element */
p,pre,/* Text Inline Block Element */
span,b,strong,i,em,dfn,var,u,ins,s,del,q,mark,small,sub,sup,abbr,bdi,bdo,cite,time,ruby,rp,rt,code,kbd,samp, /* Text Inline Element */
acronym,big,frame,frameset,noframes,tt, /* Not HTML5 Used Element */
map,option,hr,*{border:0;padding:0;margin:0;color:inherit;font-family:inherit;font-size:inherit;line-height:inherit;}
header,footer,aside,nav,section,article,details,summary,figure,figcaption,menu,command{display:block} /* HTML5 Block Element */
applet,basefont,center,dir,font,strike{display:none} /* XHTML4, HTML5 Element Not Used Remove */
q,blockquote{quotes:none;content:none}
li,menu{list-style:none;word-break:break-all}

table{width:100%;border-spacing:0;border-collapse:separate;} /* Table Border (separate) */
caption{text-align:left}
th,td{text-align:center;vertical-align:middle}

address{font-style:normal}
label{display:inline-block;}
a{text-decoration:none;display:inline-block;} /* A Attribute  */

/* Common Setting */
html{overflow-y:auto;}
html,body{height:100%;} /* Horizen Scroll */
body{color:#333;font-size:13px;font-family:"GmarketSans", "Montserrat", 'Noto Sans KR', sans-serif, "Nanum Gothic";font-weight:400;min-width:320px;}
div{outline:0}
img {vertical-align:middle;}

::selection {background-color:#333;color:#fff;}


/* Intro */
.fullscreen-bg {position:fixed;top:0;right:0;bottom:0;left:0;overflow:hidden;z-index:-100;}
.fullscreen-bg__video{position:absolute;top:0;left:0;width:100%;height:100%;}
@media (min-aspect-ratio: 16/9) { .fullscreen-bg__video {height:300%;top:-100%;} }
@media (max-aspect-ratio: 16/9) { .fullscreen-bg__video {width:300%;left:-100%;} }
/*@media only screen and (max-width:767px) {

.fullscreen-bg {background-image:url("../img/poster.png");background-size:auto 100%;background-position:center;;}
.fullscreen-bg__video {display:none;}}
*/

.introVod {position:relative;width:100%;height:100%;}
.introVod .backOpacity {position:absolute;width:100%;height:100%;top:0;left:0;background-color:black;opacity:0.35;}

.in_text {position:relative;width:740px;margin:0 auto;text-align:center;color:white;}
.in_text .top {position:relative;padding-top:100px;}
.in_text .top img {width:80px;}
.in_text .top h1 {font-family:'GmarketSans';font-size:26px;font-weight:500;padding:35px 0 5px 0;}
.in_text .top h2 {font-family:'GmarketSans';font-size:15px;font-weight:500;}
.in_text .country {position:relative;color:#333;text-align:left;padding-top:30px;}
.in_text .country li {float:left;width:240px;margin-right:10px;margin-bottom:10px;font-family:'GmarketSans';font-size:16px;font-weight:500;}
.in_text .country li:nth-child(3n) {margin-right:0;}
.in_text .country li a {display:block;background-color:white;border-radius:30px;padding:9px 9px;}
.in_text .country li a img {width:30px;padding-right:10px;}
.in_text .country li a span {font-size:10px;opacity:0.5;padding-left:5px;}
.in_text .country li a:hover {background-color:#e23d3d;color:white;}

.in_footer {position:absolute;width:740px;bottom:10px;left:50%;margin-left:-370px;font-size:11px;letter-spacing:1px;font-weight:200;text-align:center;color:white;}

/* Main & Common */
.gnb {position:absolute;top:0;left:0;width:100%;height:90px;font-family:'GmarketSans';font-size:17px;font-weight:500;z-index:100;border-bottom:solid 1px #e5e5e5;background-color:white;}
.gnb .logo {position:absolute;top:30px;left:30px;font-size:20px;font-weight:800;z-index:2;}
.gnb .logo img {width:30px;vertical-align:middle;padding:0 7px 3px 0;}
.gnb .menu {position:absolute;top:32px;left:190px;}
.gnb .menu a {padding:0 10px;}
.gnb .right {position:absolute;top:35px;right:30px;}
.gnb .right a {padding:0 0 0 10px;opacity:0.7;font-size:15px;}
.gnb .right a img {width:17px;padding:0 6px 2px 0;filter:invert(100);opacity:0.5;}
.gnb .menu a:hover {color:#ff6666;}

.gnb_main {border:0;color:white;background:none;}
.gnb_main .logo img {filter:brightness(500%);}
.gnb_main .right a img {filter:invert(0);}

.gnb_float {position:fixed;top:0;left:0;background-color:#FFF!important;color:#000;border-bottom:solid 1px #e5e5e5;z-index:1000;}
.gnb_float .right a img {filter:invert(100);}
.gnb_float .logo img {filter:brightness(100%);}

.ham {display:none;}
.menu_mobile {display:none;}

.mainVisual {position:relative;width:100%;height:780px;}
.mainVisual .vod {position:relative;width:100%;height:100%;}
.mainVisual .backBlack {position:absolute;width:100%;height:100%;background-color:black;top:0;left:0;opacity:0.2;}
.mainVisual .text {position:absolute;width:1000px;top:50%;left:50%;margin-top:-120px;margin-left:-500px;;color:white;}
.mainVisual .text h2 {font-family:'GmarketSans';font-size:70px;font-weight:300;line-height:70px;padding-bottom:10px;}
.mainVisual .text h1 {font-family:'GmarketSans';font-size:70px;font-weight:600;line-height:70px;padding-bottom:35px;}
.mainVisual .text a {font-size:19px;font-weight:700;background-color:#FFF;border-radius:50px;padding:10px 23px 10px 19px;color:#000;margin-right:10px;}
.mainVisual .text a img {width:30px;padding-right:5px;}
.mainVisual .text a:hover {color:#FFF;background-color:#000;}
.mainVisual .text a:hover img {filter:invert(100);}
.mainVisual .arrow {position:absolute;bottom:15px;left:50%;margin-left:-10px;}
.mainVisual .arrow img {width:20px;opacity:0.5;}

.mainRbox {position:relative;width:1000px;margin:50px auto 0 auto;}
.mainReview {position:relative;}
.mainReview div {position:relative;float:left;width:200px;height:260px;border:solid 1px #e5e5e5;border-radius:20px;padding:30px;font-family:'GmarketSans';font-size:13px;font-weight:500;line-height:20px;margin-bottom:50px;}
.mainReview div p {font-size:16px;padding-bottom:10px;}
.mainReview div p b {color:#dd2323;}
.mainReview div span {display:block;font-size:10px;opacity:0.5;position:absolute;bottom:30px;left:30px;}

.mainIntro {position:relative;width:1000px;margin:0 auto;clear:both;border-top:solid 1px #e5e5e5;padding:70px 0;font-size:13px;line-height:23px;color:#666;}
.mainIntro p {font-family:'GmarketSans';font-size:22px;font-weight:500;color:#333;padding-bottom:15px;}
.mainIntro p b {font-weight:800;}

.footer_link {position:relative;width:1000px;margin:0 auto;clear:both;border-top:solid 1px #e5e5e5;border-bottom:solid 1px #e5e5e5;padding:50px 0 30px 0;}
.footer_link .btlink {position:relative;}
.footer_link .btlink a {font-family:'GmarketSans';font-size:13px;font-weight:600;margin-right:20px;color:#333;}
.footer_link .btlink a:hover {color:#ff6666;}
.footer_link .store {position:relative;padding-top:15px;}
.footer_link .store a {margin-right:25px;font-weight:700;font-size:13px;}
.footer_link .store a img {width:20px;padding:0 3px 4px 0;}
.footer_copy {position:relative;width:1000px;margin:0 auto;padding:30px 0;font-family:'GmarketSans';font-size:12px;color:#666;}
.footer_copy h3 {font-weight:800;font-size:12px;padding-bottom:10px;}
.footer_copy span {margin-right:20px;}
.footer_copy p {padding-top:3px;font-size:11px;}


/* Sub */
.wrap {position:relative;padding:90px 0 50px 0;}
.warpfixed {width:1000px;margin:0 auto;}

.camtalkNew {position:relative;background-color:#f7f7f7;padding:100px 0;text-align:center;font-family:'GmarketSans';}
.camtalkNew h1 {font-size:45px;}
.camtalkNew p {font-size:17px;}
.camtalkNew .photo {position:relative;padding:35px 0;}
.camtalkNew .photo img {width:20%;border-radius:20px;margin:0 0.2%;border:solid 1px #e5e5e5;}
.camtalkNew .check {position:relative;}
.camtalkNew .check h2 {font-size:22px;color:#e10000;padding-bottom:5px;}
.camtalkNew .check span {font-size:14px;color:#999;}

.camtalk_intro {position:relative;}
.camtalk_intro .box {position:relative;width:1000px;margin:0 auto;height:750px;}
.camtalk_intro .box h2 {font-family:'GmarketSans';font-size:45px;font-weight:400;padding:280px 550px 10px 0;line-height:55px;}
.camtalk_intro .box p {font-family:'GmarketSans';font-size:20px;font-weight:500;opacity:0.7;line-height:28px;padding:0 550px 0 0;}
.camtalk_intro .box img {position:absolute;top:50px;right:0;}
.camtalk_gray {background-color:#f7f7f7;}

.vod_box {position:relative;}
.vod_box .contents {width:1000px;margin:0 auto;padding:100px 0;text-align:center;}
.vod_box .contents h2 {font-family:'GmarketSans';font-size:40px;font-weight:400;}
.vod_box .contents p {font-family:'GmarketSans';font-size:15px;font-weight:500;color:#999;}
.vod_box .contents .list {position:relative;padding:60px 0 40px 0;}
.vod_box .contents .list a {font-family:'GmarketSans';font-size:17px;font-weight:600;color:#8c8c8c;margin:0 15px;}
.vod_box .contents .list a:hover, .vod_box .contents .list .on {color:#e23d3d;text-decoration:underline;text-underline-offset:5px;}
.vod_box .contents .youtube {}
.vod_box .contents .youtube iframe {border-radius:50px;}
.vod_box_gray {background-color:#f7f7f7;}

#camtalkVod1 {display:block;}
#camtalkVod2 {display:none;}
#camtalkVod3 {display:none;}
#camtalkVod4 {display:none;}
#camtalkVod5 {display:none;}
#camtalkVod6 {display:none;}
#camtalkVod7 {display:none;}
#camtalkVod8 {display:none;}

#camtalkVodS2 {display:none;}
#camtalkVodS3 {display:none;}
#camtalkVodS4 {display:none;}
#camtalkVodS5 {display:none;}

.raw_title {position:relative;padding:100px 0 50px 0;}
.raw_title h2 {font-family:'GmarketSans';font-size:35px;font-weight:400;}
.raw_title p {font-family:'GmarketSans';font-size:15px;font-weight:500;color:#999;}
.raw_tab {position:relative;}
.raw_tab td {border-top:solid 1px #c7c7c7;border-left:solid 1px #c7c7c7;padding:0;}
.raw_tab td:last-child {border-right:solid 1px #c7c7c7;}
.raw_tab td a {font-family:'GmarketSans';font-size:14px;font-weight:400;color:#999;padding:19px 19px 15px 19px;}
.raw_tab td:hover, .raw_tab .on {background-color:#f3f3f3;color:#000;font-weight:700;}
.raw_tab td:hover a, .raw_tab .on a {color:#000;font-weight:700;}
.raw {position:relative;clear:both;padding:50px 0;font-size:13px;color:#666;}
.raw strong {font-size:14px;color:#333;}
.raw h2 {font-size:17px;color:#333;padding:10px 0 0 0;}
.raw h3 {font-size:14px;color:#333;padding:10px 0 0 0;}

#raw02 {display:none;}
#raw03 {display:none;}
#raw04 {display:none;}
#raw05 {display:none;}
#raw06 {display:none;}
#raw07 {display:none;}


.faq_title {position:relative;padding:100px 0 50px 0;}
.faq_title h2 {font-family:'GmarketSans';font-size:35px;font-weight:400;}
.faq_title p {font-family:'GmarketSans';font-size:15px;font-weight:500;color:#999;}
.faq_list {position:relative;}
.faq_list li:first-child {border-top:dashed 1px #e5e5e5;padding:50px 0 10px 0;font-size:15px;font-weight:600;}
.faq_list li:last-child {font-size:13px;padding:0 0 50px 0;line-height:20px;color:#999;}

.down {position:relative;padding:210px 0 150px 400px;}
.down .phone {position:absolute;top:70px;left:0;}
.down h2 {font-family:'GmarketSans';font-size:50px;font-weight:400;}
.down h1 {font-family:'GmarketSans';font-size:50px;font-weight:600;padding-bottom:30px;}
.down h1 b {color:#e23d3d;}
.down a {background-color:#e7e7e7;margin-right:5px;padding:10px 19px 8px 15px;font-size:15px;font-weight:600;border-radius:50px;}
.down a img {width:26px;padding:0 5px 5px 0;}
.down a:hover {background-color:#000;color:white;}
.down a:hover img {filter:invert(100);}
.down .text {position:relative;font-size:13px;line-height:24px;color:#999;padding-top:50px;}
.down .text p {font-family:'GmarketSans';font-size:20px;font-weight:400;color:#000;padding-bottom:5px;}


.camtalker{width:100%;}
.camtalker img{width:100%;}



@media only screen and (max-width:1000px) { 

.introVod {width:auto;}
.in_text {width:90%;margin-left:-45%;left:50%;}
.in_text .top {padding-top:80px;}
.in_text .top h1 {font-size:22px;padding:20px 0 5px 0;}
.in_text .top h2 {font-size:13px;}
.in_text .country {padding-top:20px;}
.in_text .country li {width:32.3333%;margin-right:1%;margin-bottom:2%;font-size:15px;}
.in_text .country li a img {width:25px;padding-right:5px;}
.in_footer {width:100%;;margin-left:-50%;}

.gnb {height:70px;font-size:16px;}
.gnb .logo {top:20px;left:15px;font-size:17px;}
.gnb .logo img {width:25px;padding:0 5px 3px 0;}
.gnb .menu {top:25px;left:145px;}
.gnb .menu a {padding:0 8px;}
.gnb .right {top:26px;right:20px;}
.gnb .right a {padding:0 0 0 5px;font-size:13px;}
.gnb .right a img {width:15px;padding:0 4px 2px 0;}

.mainVisual .text {width:80%;top:40%;margin-top:-5%;margin-left:-40%;}
.mainVisual .text h2 {font-size:55px;line-height:55px;}
.mainVisual .text h1 {font-size:55px;line-height:55px;padding-bottom:25px;}
.mainVisual .text a {font-size:15px;padding:8px 20px 8px 15px;}
.mainVisual .text a img {width:25px;padding:0 5px 3px 0;}

.mainRbox {width:auto;margin:50px auto 0 auto;}

.mainIntro {width:94%;padding:50px 0;line-height:20px;}
.mainIntro p {font-size:19px;}

.footer_link {width:94%;padding:30px 0 20px 0;}
.footer_link .btlink a {font-size:13px;margin-right:10px;line-height:20px;}
.footer_link .store a {margin-right:15px;font-size:12px;}
.footer_link .store a img {width:17px;padding:0 5px 3px 0;}
.footer_copy {width:94%;padding:20px 0 30px 0;}
.footer_copy span {margin-right:20px;}

.wrap {padding:70px 0 50px 0;}
.warpfixed {width:94%;}

.camtalkNew {padding:80px 20px;}

.camtalk_intro .box {width:94%;margin:0 auto;height:auto;text-align:center;}
.camtalk_intro .box h2 {font-size:35px;padding:73.5% 0 10px 0;line-height:40px;}
.camtalk_intro .box p {font-size:17px;line-height:20px;padding:0 0 50px 0;}
.camtalk_intro .box img {top:30px;left:50%;margin-left:-25%;width:50%;}

.vod_box .contents {width:94%;padding:70px 0;}
.vod_box .contents h2 {font-size:30px;}
.vod_box .contents p {font-size:14px;}
.vod_box .contents .list {padding:40px 0 30px 0;line-height:22px;}
.vod_box .contents .list a {font-size:15px;margin:0 7px;}
.vod_box .contents .youtube iframe {border-radius:30px;}

.raw_title {padding:60px 0 30px 0;}
.raw_title h2 {font-size:28px;padding-bottom:5px;}
.raw_title p {font-size:14px;}
.scroll {position:relative;width:100%;overflow-x:auto;}
.raw_tab td {white-space:nowrap;}
.raw {padding:30px 0;}

.faq_title {padding:60px 0 30px 0;}
.faq_title h2 {font-size:28px;padding-bottom:5px;}
.faq_title p {font-size:14px;}
.faq_list li:first-child {padding:30px 0 10px 0;}
.faq_list li:last-child {padding:0 0 30px 0;}

.down {padding:40px 0 0 0;text-align:center;}
.down .phone {position:relative;top:0;left:0;width:35%;}
.down h2 {font-size:35px;}
.down h1 {font-size:45px;}
.down .text {padding-top:30px;}

.camtalker{width:100%;}
.camtalker img{width:100%;}

}


@media only screen and (max-width:767px) {
html,body{min-width:320px;}


.introVod {width:auto;}
.in_text {width:90%;margin-left:-45%;left:50%;}

.in_text .top {padding-top:60px;}
.in_text .top img {width:65px;}
.in_text .top h1 {font-size:20px;}
.in_text .top h2 {font-size:12px;}
.in_text .country li {width:48.5%;margin-right:3%;margin-bottom:7px;font-size:15px;}
.in_text .country li:nth-child(3n) {margin-right:3%;}
.in_text .country li:nth-child(even) {margin-right:0;}
.in_text .country li a {padding:8px 7px;font-size:13px;}
.in_text .country li a span {display:none;}
.in_text .country li a img {width:20px;padding-right:5px;}
.in_footer {font-size:11px;letter-spacing:0px;}

.gnb {height:70px;font-size:16px;background-color:transparent;}
.gnb .logo {top:25px;left:20px;font-size:17px;}
.gnb .logo img {width:25px;padding:0 8px 3px 0px;}
.gnb .menu {display:none;}
.gnb .right {display:none;}

.ham {display:block;position:absolute;top:20px;right:20px;}
.ham img {width:20px;}
.gnb_main .ham img {filter:invert(100);}
.gnb_float .ham img {filter:invert(0);}

.menu_mobile {position:fixed;width:100%;height:100%;top:0;left:0;background-color:#000;z-index:1001;}
.menu_mobile .close {position:absolute;top:30px;right:30px;z-index:1;}
.menu_mobile .close img {width:20px;filter:invert(100);}
.menu_mobile .list {position:relative;width:100%;text-align:center;padding-top:70px;}
.menu_mobile .list a {display:block;font-family:'GmarketSans';font-size:32px;font-weight:700;color:#FFF;padding-bottom:20px;}
.menu_mobile .list a:last-child {padding-bottom:40px;}
.menu_mobile .list2 {position:relative;width:50%;margin:0 auto;border-top:dashed 1px #999;padding-top:30px;}
.menu_mobile .list2 a {font-family:'GmarketSans';font-size:15px;font-weight:400;color:#FFF;padding:0 10px;}
.menu_mobile .list2 a img {width:16px;padding:0 5px 3px 0;}

.mainVisual .text {top:25%;margin-top:0;}
.mainVisual .text h2 {font-size:30px;line-height:35px;}
.mainVisual .text h1 {font-size:55px;line-height:60px;padding-bottom:25px;}
.mainVisual .text a {font-size:13px;padding:8px 17px 6px 15px;margin-bottom:7px;}
.mainVisual .text a img {width:20px;padding:0 5px 3px 0;}

.mainRbox {width:auto;margin:25px auto 0 auto;}
.mainReview div {width:150px;height:190px;border-radius:15px;padding:20px;;margin-bottom:20px;}
.mainReview div p {font-size:15px;padding-bottom:5px;}
.mainReview div span {bottom:10px;left:20px;}

.mainIntro {width:auto;padding:40px 10px;line-height:20px;}
.mainIntro p {font-size:19px;}

.footer_link {width:auto;padding:30px 10px 20px 10px;}
.footer_link .btlink a {font-size:12px;margin-right:10px;}
.footer_copy {width:auto;padding:20px 10px 20px 10px;line-height:17px;}
.footer_copy span {margin-right:10px;}

.wrap {padding:70px 0 50px 0;}
.warpfixed {width:auto;margin:0 10px;}

.camtalkNew {padding:50px 10px;}
.camtalkNew h1 {font-size:26px;}
.camtalkNew p {font-size:14px;line-height:18px;}
.camtalkNew .photo {padding:25px 0;}
.camtalkNew .photo img {width:45%;border-radius:15px;margin:0.3%;}
.camtalkNew .check h2 {font-size:17px;line-height:24px;}
.camtalkNew .check span {font-size:13px;}


.camtalk_intro .box {width:auto;margin:0 10px;}
.camtalk_intro .box h2 {font-size:20px;padding:115% 0 5px 0;line-height:25px;}
.camtalk_intro .box p {font-size:13px;line-height:18px;padding-bottom:30px;}
.camtalk_intro .box img {top:30px;left:50%;margin-left:-40%;width:80%;}

.vod_box .contents {width:auto;padding:50px 10px;}
.vod_box .contents h2 {font-size:24px;}
.vod_box .contents p {font-size:13px;}
.vod_box .contents .list {padding:30px 0 20px 0;line-height:22px;}
.vod_box .contents .list a {font-size:13px;margin:0 5px;}
.vod_box .contents .youtube iframe {border-radius:20px;height:350px;}
.vod_box_gray .contents .youtube iframe {width:100%;height:500px;}

.raw_title {padding:50px 0 30px 0;}
.raw_title h2 {font-size:22px;padding-bottom:5px;}
.raw_title p {font-size:13px;}
.raw_tab td {white-space:nowrap;}
.raw_tab td a {font-size:13px;padding:17px 15px 12px 15px;}

.faq_title {padding:50px 0 30px 0;}
.faq_title h2 {font-size:22px;padding-bottom:5px;}
.faq_title p {font-size:13px;}
.faq_list li:first-child {padding:20px 0 5px 0;}
.faq_list li:last-child {padding:0 0 20px 0;}

.down {padding:30px 0 0 0;}
.down .phone {width:70%;}
.down h2 {font-size:25px;}
.down h1 {font-size:35px;}
.down a {padding:10px 19px 8px 15px;font-size:13px;margin-bottom:5px;}
.down a img {width:20px;padding:0 5px 3px 0;}

.down .text {padding-top:30px;}

.camtalker{width:100%;}
.camtalker img{width:100%;}
}


/* === iOS burger color override (pre-scroll) === */
.is-ios .gnb_main .ham img { filter: invert(0) !important; }
/* Optional: make header icons/text dark on iOS main header */
.is-ios .gnb_main { color:#000; background:rgba(255,255,255,0.9); border-bottom:1px solid #e5e5e5; }
.is-ios .gnb_main .right a img { filter: invert(0) !important; }
.is-ios .gnb_main .logo img { filter: brightness(100%) !important; }
/* === end iOS overrides === */


/* === Mobile menu robustness (iOS-safe) === */
.menu_mobile { z-index: 9999; pointer-events: auto; }
.menu_mobile.open { display: block !important; }
body.menu-open { overflow: hidden; }
/* === end === */

/* 2.1: кнопка = та же «кликабельная зона», что и ссылка раньше */
.gnb .ham button,
.gnb .ham a {
  display: inline-flex;             /* центрируем иконку */
  align-items: center;
  justify-content: center;
  width: 32px;                      /* поставьте тот же размер, что был у .ham a */
  height: 32px;
  position: relative;               /* если .ham a было absolute — задайте так же */
  /* пример, если раньше .ham a стояло в углу: */
  /* position: absolute; top: 10px; right: 12px; */

  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
  z-index: 10001;                   /* над шапкой/оверлеями, как было у ссылки */
}

/* 2.2: убрать спец-рендеринг кнопки в WebKit/Chromium */
.gnb .ham button { appearance: none; -webkit-appearance: none; }

/* 2.3: картинка внутри кнопки — блочная, чтобы клик шёл по всей области */
.gnb .ham button img { display: block; width: 100%; height: auto; }

/* 2.4: меню показываем/прячем по классу .open */
.menu_mobile { display: none; pointer-events: none; }
.menu_mobile.open { display: block; pointer-events: auto; }

/* === 1) Гамбургер ВСЕГДА ЧЁРНЫЙ (и в обычном состоянии, и при скролле) === */
.gnb .ham img,
.gnb.scrolled .ham img,
.gnb.fixed .ham img,
.gnb.on .ham img,
.header.scrolled .ham img,
.is-scrolled .gnb .ham img {
  /* Делает любой PNG/SVG визуально чёрным */
  filter: brightness(0) saturate(100%) !important;
  -webkit-filter: brightness(0) saturate(100%) !important;

  /* Запрещаем «светлые» режимы и инвертирование */
  mix-blend-mode: normal !important;
  opacity: 1 !important;
}

/* На случай, если гамбургер — inline SVG, тоже форсим чёрный */
.gnb .ham svg,
.gnb .ham svg * {
  fill: #000 !important;
  stroke: #000 !important;
}

/* Если иконка гамбургера задаётся через icon-font/псевдоэлемент — тоже чёрный */
.gnb .ham .icon,
.gnb .ham i,
.gnb .ham::before,
.gnb .ham::after {
  color: #000 !important;
  background-color: #000 !important;
}

/* === 2) Логотип — вернуть исходные цвета, без инвертов и блендов === */
.gnb .logo img,
.header .logo img {
  filter: none !important;
  -webkit-filter: none !important;
  mix-blend-mode: normal !important;
  opacity: 1 !important;
}

/* Если где-то глобально инвертируют все картинки в шапке — обнуляем только для логотипа */
.gnb.white .logo img,
.gnb.on .logo img,
.gnb.scrolled .logo img,
.header.scrolled .logo img {
  filter: none !important;
  -webkit-filter: none !important;
  mix-blend-mode: normal !important;
}

/* Крест «закрыть» — убрать фон у контейнера, кнопки и картинки */
.menu_mobile .close,
.menu_mobile .close button,
.menu_mobile .close img {
  background: transparent !important;
  box-shadow: none !important;
}

/* Нормализуем кнопку (Android/Chrome часто даёт системный фон) */
.menu_mobile .close button {
  border: 0 !important;
  padding: 0 !important;
  -webkit-appearance: none;
  appearance: none;
}

/* Картинка крестика — плотная без подсветок/блендов */
.menu_mobile .close img {
  display: block;
  mix-blend-mode: normal !important;
  filter: none !important;
  -webkit-filter: none !important;
}

/* Если где-то задавали фон через псевдоэлементы — обнулим */
.menu_mobile .close::before,
.menu_mobile .close::after {
  content: none !important;
  background: transparent !important;
}

@media only screen and (max-width:767px) {
  .menu_mobile .close img {
    filter: invert(100%) !important;
    -webkit-filter: invert(100%) !important;
  }
}

/* === FIX: фон-видео ТОЛЬКО внутри .mainVisual === */
.mainVisual{
  position: relative;
  overflow: hidden;
  height: 100vh;
  background: #000; /* чтобы не светило белым пока видео грузится */
}
@supports (height: 100dvh){
  .mainVisual{ height: 100dvh; }
}

/* важное: перебиваем fixed + z-index:-100 из .fullscreen-bg */
.mainVisual .vod.fullscreen-bg{
  position: absolute !important;
  inset: 0;
  z-index: 0 !important;
  overflow: hidden;
}

.mainVisual video.fullscreen-bg__video{
  position: absolute;
  inset: 0;
  width: 100% !important;
  height: 100% !important;
  top: 0 !important;
  left: 0 !important;
  object-fit: cover;
  object-position: center;
  display: block;
}

/* слои поверх видео */
.mainVisual .backBlack{ z-index: 1; }
.mainVisual .text,
.mainVisual .arrow{ position: absolute; z-index: 2; }


/* 캠톡 소개 추가하기 2026.01.12 */

.nintro {position:relative;width:900px;margin:80px auto;}
.nintro .top {position:relative;background-image:url('../img/nintro_01.png');background-size:cover;background-position:center;background-repeat: no-repeat;text-align:center;color:white;padding:200px 0 100px 0;}
.nintro .top .catch {position:relative;}
.nintro .top .catch h1 {font-weight:300;font-size:55px;}
.nintro .top .catch h1 b {font-weight:700;text-emphasis-style:dot;text-emphasis-position:over;}
.nintro .top .catch h2 {font-weight:300;font-size:55px;}
.nintro .top .catch h2 b {font-weight:700;color:#ff3737;}
.nintro .top .catch span {font-family:"Montserrat";font-size:15px;;font-weight:700;letter-spacing:4px;}
.nintro .top .line {position:relative;margin:100px auto;width:70px;height:7px;background-color:white;left:50%;margin-left:-35px;}
.nintro .top .sub {position:relative;}
.nintro .top .sub h3 {font-size:35px;color:#ffc90f;}
.nintro .top .sub p {font-size:17px;line-height:30px;padding:5px 50px;}
.nintro .top .box {position:relative;padding:100px 50px;}
.nintro .top .box li {float:left;border-right:dashed 1px #666;padding:0 20px;width:calc(33.33% - 41px);}
.nintro .top .box li:last-child {border-right:0;}
.nintro .top .box li i {font-family:"Montserrat";font-size:12px;font-weight:500;letter-spacing:2px;font-style:normal;display:block;}
.nintro .top .box li span {font-size:55px;color:#ff3636;padding:10px 0;}
.nintro .top .box li p {font-size:14px;padding-top:10px;}
.nintro .top .clear {position:relative;clear:both;}

.nintro .list {position:relative;text-align:center;padding:120px 0 0 0;}
.nintro .list h2 {font-family:"Montserrat";font-size:20px;font-weight:700;letter-spacing:3px;color:#ff3636;}
.nintro .list h1 {font-size:50px;line-height:55px;padding:15px 0 50px 0;}
.nintro .list img {width:100%;margin-bottom:20px;border-radius:20px;}
.nintro .tech {position:relative;color:white;text-align:left;}
.nintro .tech li {position:relative;background-color:#000;margin-bottom:10px;padding:60px 50px 50px 220px;border-radius:20px;}
.nintro .tech li .icon {position:absolute;width:140px;height:140px;background-color:white;text-align:center;top:35px;left:40px;border-radius:50%;}
.nintro .tech li .icon span {color:#000;font-size:70px;padding-top:32px;}
.nintro .tech li h3 {font-size:28px;}
.nintro .tech li i {font-style:normal;font-family:"Montserrat";font-size:13px;font-weight:700;letter-spacing:2px;color:#ff3636;display:block;padding:0 0 10px 0;}
.nintro .tech li p {font-size:14px;opacity:0.7;line-height:20px;}


.nintro .last {position:relative;text-align:center;padding:120px 0 0 0;}
.nintro .last h2 {font-family:"Montserrat";font-size:20px;font-weight:700;letter-spacing:3px;color:#ff3636;}
.nintro .last h1 {font-size:50px;line-height:55px;padding:15px 0 15px 0;}
.nintro .last p {font-size:14px;opacity:0.7;}
.nintro .photo {padding:35px 0;}
.nintro .photo img {width:100%;border-radius:15px;}


@media only screen and (max-width:1000px) { 

.nintro {width:auto;margin:60px auto;}
.nintro .list img {width:100%;}

}

@media only screen and (max-width:767px) {


.nintro {margin:0 auto 50px auto;}
.nintro .top {padding:100px 0 50px 0;}
.nintro .top .catch h1 {font-size:35px;padding:0 30px;line-height:40px;}
.nintro .top .catch h2 {font-size:35px;padding:0 30px;line-height:40px;}
.nintro .top .catch span {font-size:11px;letter-spacing:1px;}
.nintro .top .line {margin:50px auto;;height:3px;margin-left:-35px;}
.nintro .top .sub h3 {font-size:26px;}
.nintro .top .sub p {font-size:14px;line-height:22px;padding:5px 20px;}
.nintro .top .box {position:relative;padding:50px 10px;}
.nintro .top .box li {border-bottom:dashed 1px #666;border-right:0;padding:20px 0;width:calc(100% - 10px);}
.nintro .top .box li:last-child {border-bottom:0;}
.nintro .top .box li p {font-size:13px;}

.nintro .list {padding:90px 0 0 0;}
.nintro .list h2 {font-size:15px;letter-spacing:2px;}
.nintro .list h1 {font-size:30px;line-height:35px;padding:10px 20px 30px 20px;}
.nintro .list img {margin-bottom:10px;border-radius:7px;}
.nintro .tech {padding:0 10px;text-align:center;}
.nintro .tech li {margin-bottom:10px;padding:130px 20px 40px 20px;border-radius:7px;}
.nintro .tech li .icon {width:80px;height:80px;top:35px;left:50%;margin-left:-40px;}
.nintro .tech li .icon span {font-size:45px;padding-top:18px;}
.nintro .tech li h3 {font-size:22px;}
.nintro .tech li i {font-size:12px;letter-spacing:1px;}


.nintro .last {padding:90px 0 0 0;}
.nintro .last h2 {font-size:15px;letter-spacing:2px;}
.nintro .last h1 {font-size:30px;line-height:35px;padding:10px 20px 0 20px;}
.nintro .last p {font-size:14px;padding:0 25px;}

}


/* === FIX: tech icon should be centered & never overflow (material-symbols) === */
.tech li .icon,
.nintro .tech li .icon{
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}

.tech li .icon span.material-symbols-outlined,
.nintro .tech li .icon span.material-symbols-outlined{
  display:block;
  line-height:1 !important;
  padding:0 !important;
  margin:0 !important;
  /* keep glyph visually centered */
  transform: translateY(-1px);
  font-size:70px;
}

/* If circle is small on mobile, scale icon down a bit */
@media (max-width: 640px){
  .tech li .icon span.material-symbols-outlined,
  .nintro .tech li .icon span.material-symbols-outlined{
    font-size:56px;
  }
}