@import url("reset.css");
@import url("font.css");
@import url("jquery.fullPage.css");
@import url("swiper.css");


:root{
    --padding:20px;
    --header_h:100px;
    --width:1360px;
    --point-color-1:#C90008;
    --point-color-2:#1D2088;
    --font:"GmarketSans";
}

[data-delay] {position: relative; transition: all 1s ease; opacity:0;}
[data-direction="left"]{left:-40px;}
[data-direction="right"]{right:-40px;}
[data-direction="top"]{top:-40px;}
[data-direction="bottom"]{bottom:-40px;}
.section_on [data-delay]{opacity:1;}
.section_on [data-direction="left"]{left:0;}
.section_on [data-direction="right"]{right:0;}
.section_on [data-direction="top"]{top:0;}
.section_on [data-direction="bottom"]{bottom:0;}


@media screen and (max-width: 1200px){
  :root{
      --header_h:70px;
  }
}
@media screen and (max-width: 768px){
  :root{
      --header_h:60px;
  }
}

/* layout */
.cont{margin:0 auto; padding:0 var(--padding); max-width:var(--width); }

/* header */
.header{position:fixed; left:0; top:0; z-index:30; padding-left:3%;  width:100%; height:var(--header_h); display:flex; align-items: center; justify-content: space-between; transition: all 0.3s ease-out; }
.header .logo{position:relative; z-index:3;}
.header .logo a{width:218px; aspect-ratio: 218/41; display:block; background:url(../img/logo.svg) no-repeat center center; background-size:100%;  transition: all 0.3s ease-out; text-indent: -9999px;}
.gnb:before{position:fixed; left:0; top:var(--header_h); width:100vw; height:180px; background-color:#fff; display:block; content:""; visibility: hidden; opacity:0; transition: all 0.3s ease-out; border-top:1px solid #ddd; box-shadow:2px 5px 10px rgba(0,0,0,0.1);}
.gnb:hover .s_gnb,
.gnb:hover:before{opacity:1; visibility: visible;}
.gnb{position:relative; z-index:3;}
.gnb>ul{display:flex; }
.gnb>ul>li{position:relative; padding:0 50px;}
.gnb>ul>li>a{position:relative; height:var(--header_h); display:flex; align-items:center; justify-content: cebter; font-size:1.25rem; color:#fff; transition: all 0.3s ease-out;}
.gnb>ul>li>a:before{position:absolute; left:0; bottom:0; width:0; height:3px; background-color:var(--point-color-1); display:block; content:""; transition: all 0.3s ease-out; }
.gnb>ul>li:hover>a:before{width:100%;}
.s_gnb{position:absolute; left:0; top:var(--header_h); padding-top:30px; width:100%; visibility: hidden; opacity:0; transition: all 0.3s ease-out; }
.s_gnb ul li{line-height:1.6; white-space:nowrap; text-align:center; line-height:2.2;}
.s_gnb ul li a{font-size:1.125rem; transition: all 0.3s ease-out;}
.s_gnb ul li a:hover{color:var(--point-color-1);}
.total_menu_open{position:relative; z-index:3; width:var(--header_h); aspect-ratio: 1/1; background:url(../img/total_menu_open.svg) no-repeat center center var(--point-color-1); display:block; }
.header.over{background-color:#fff;}
.header.over .logo a{background:url(../img/logo_color.svg) no-repeat center center; background-size:100%;}
.header.over .gnb>ul>li>a{color:#111;}

.scroll .header{background-color:#fff;}
.scroll .header .logo a{background:url(../img/logo_color.svg) no-repeat center center; background-size:100%;}
.scroll .header .gnb>ul>li>a{color:#111;}

.fp-viewing-4 .header .logo a,
.fp-viewing-3 .header .logo a,
.fp-viewing-2 .header .logo a,
.fp-viewing-1 .header .logo a{background:url(../img/logo_color.svg) no-repeat center center; background-size:100%;}
.fp-viewing-4 .gnb>ul>li>a,
.fp-viewing-3 .gnb>ul>li>a,
.fp-viewing-2 .gnb>ul>li>a,
.fp-viewing-1 .gnb>ul>li>a{color:#111;}
@media screen and (max-width: 1200px){
.gnb>ul>li{padding:0 30px;}
}

@media screen and (max-width: 960px){
.gnb{display:none;}
}
@media screen and (max-width: 768px){
.header{background-color:#fff;}
.header .logo a{width:110px; background:url(../img/logo_color.svg) no-repeat center center; background-size:100%;}
.total_menu_open{background:url(../img/menu.svg) no-repeat center center transparent; background-size:20px;}
}


/* main */
@keyframes progressBar {
0% { width: 0%; }
  100% { width: 124px; } /* 혹은 100%로 바꿔도 무방, 고정 px 기준이면 그대로 */
}

.section_0.active .main_vs_txt .txt_1{bottom:0; opacity:1;}
.section_0.active .main_vs_txt .txt_2{bottom:0; opacity:1;}
.section_0.active .main_vs_txt .control{bottom:0; opacity:1;}
.main_visual{height:100vh;}
.main_visual .swiper-slide{position:Relative;width:100vw; height:100vh; }
.main_visual .swiper-slide:before{position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0.5); display:block; content:"";}
.main_visual .swiper-slide img{width:100%; height:100%; object-fit: cover;}
.main_vs_txt{position:absolute; left:50%; top:50%; z-index:4; padding:0 var(--padding); width:100%; max-width:var(--width);  transform:translate(-50%, -50%); color:#fff;}
.main_vs_txt .txt_1{font-family: var(--font); font-weight:700; font-size:4rem; line-height:1.25; position:relative; bottom:-40px; opacity:0; transition: all 0.6s ease-out 0.5s;}
.main_vs_txt .txt_2{margin-top:18px; font-size:1.375rem; color:#fff; font-weight:600; position:relative; bottom:-40px; opacity:0; transition: all 0.6s ease-out 0.8s;}
.main_vs_txt .control{margin-top:30px; display:flex; align-items: center; gap:30px; position:relative; bottom:-40px; opacity:0;  transition: all 0.6s ease-out 1.2s;}
.main_vs_txt .control .main_vs_stop{width:40px; aspect-ratio: 1/1; border:1px solid #fff; border-radius:50%; background:url(../img/ic_stop.svg) no-repeat center center;}
.main_vs_txt .paging_number{position:relative; display:flex; align-items: center; gap:148px; }
.main_vs_txt .paging_number:before{position:absolute; left:20px; top:50%; z-index:1; width:124px; height:2px; background-color:#fff; display:block; content:""; }
.main_vs_txt .paging_number:after{position:absolute; left:20px; top:50%; z-index:2; width:124px; height:2px; background-color:#219ED4; display:block; content:""; }
.main_vs_txt .paging_number.animate:after{ animation: progressBar 4s linear forwards;}
.main .title_area{position:relative; bottom:-40px; opacity:0; transition: all 0.6s ease-out 0.5s;}
.main .title_area h1{margin-bottom:max(calc(20/1080*100vh),10px); font-size:4rem; font-family: var(--font); font-weight:700; line-height:1;}
.main .title_area p{margin-top:20px; font-size:1.25rem; }
.section_1{position:relative; background:url(../img/main_bg.svg) no-repeat center bottom;}
.section_1 .cont{position:relative; }
.section_1 .tabCont>div{display:none;}
.section_1 .tabCont>div:first-child{display:block; }
.section_1 .tab_wrap{margin-top:58px; display:flex; align-items: flex-start;}
.section_1 .tab_wrap .tab_title{width:25%; background-color:#890005; border-radius:max(calc(60/1920*100vw),30px) 0 max(calc(60/1920*100vw),30px) 0; }
.section_1 .tab_wrap .tab_title ul li{position:relative; }
.section_1 .tab_wrap .tab_title ul li:before{position:absolute; left:50%; bottom:0; width:75%; height:1px; background:rgba(255,255,255,0.3); display:block; content:""; transform:translateX(-50%);}
.section_1 .tab_wrap .tab_title ul li:last-child:before{display:none;}
.section_1 .tab_wrap .tab_title ul li>*{padding:0 40px; width:100%; height:160px; display:flex; align-items: center; border-radius:max(calc(60/1920*100vw),30px) 0 max(calc(60/1920*100vw),30px) 0; text-align:left;}
.section_1 .tab_wrap .tab_title ul li.active>*{background-color:var(--point-color-1);}
.section_1 .tab_wrap .tab_title span{font-size:1.5rem; font-weight:700; color:#fff;}
.section_1 .tab_wrap .tab_title strong{margin-top:6px; display:block;  font-size:1.125rem; color:#fff; font-weight:300; font-family: var(--font);}
.section_1 .tab_wrap .tabCont{margin-left:auto; width:72%;}
.section_1 .tabCont ul{display:flex; gap:40px;}
.section_1 .tabCont ul li{width:50%; background-color:#fff;}
.section_1 .tabCont ul li a{position:relative; display:block; border:1px solid #ddd; border-radius:max(calc(60/1920*100vw),30px) 0 max(calc(60/1920*100vw),30px) 0; overflow:hidden;}
.section_1 .tabCont ul li a:before{position:absolute; left:0; top:0; width:100%; height:100%; display:block; content:""; border:3px solid var(--point-color-1); box-sizing:border-box; border-radius:max(calc(60/1920*100vw),30px) 0 max(calc(60/1920*100vw),30px) 0; opacity:0; transition: all 0.3s ease-out;}
.section_1 .tabCont ul li .img_area{margin:0 auto; padding:40px;  }
.section_1 .tabCont ul li .img_area .inner{position:relative; margin:0 auto; max-width:315px; aspect-ratio: 315/308; display:flex; align-items: center; justify-content: center;}
.section_1 .tabCont ul li .img_area img{max-width:100%; max-height:100%;}
.section_1 .tabCont ul li .txt_area{padding:30px 0; text-align:center; font-size:1.5rem; font-weight:700; transition: all 0.3s ease-out;}
.section_1 .tabCont ul li:hover .txt_area{background-color:var(--point-color-1); color:#fff;}
.section_1 .tabCont ul li:hover a:before{opacity:1;}
.section_1 .more{position:absolute; right:var(--padding); top:80px;}
.section_1 .more a{padding-right:70px; line-height:60px; display:inline-block; background:url(../img/ic_more.svg) no-repeat right center; transition: all 0.3s ease-out; font-size:1.125rem; }
.section_1 .more a:hover{background:url(../img/ic_more_on.svg) no-repeat right center;}

.section_1 .tab_title{position:relative; left:-40px; opacity:0; transition: all 0.6s ease-out 0.8s;}
.section_1 .tabCont{position:relative; left:-40px; opacity:0; transition: all 0.6s ease-out 1.2s;}
.section_1.active .title_area{opacity:1; bottom:0;}
.section_1.active .tab_title{left:0; opacity:1;}
.section_1.active .tabCont{left:0; opacity:1;}

.section_2 .title_area{margin-bottom:max(calc(80/1080*100vh),40px);}
.section_2 .d-flex{align-items: center;}
.section_2 .video_area{width:49%; position:relative; left:-40px; opacity:0; transition: all 0.6s ease-out 0.8s;}
.section_2 .video_area .inner{position:relative; aspect-ratio: 1/0.56; border-radius: max(calc(60/1920*100vw),30px) 0 max(calc(60/1920*100vw),30px) 0; overflow:hidden;}
.section_2 .video_area .inner iframe{width:100%; height:100%; }
.section_2 .txt_area{margin-left:auto; width:46%; position:relative; left:-40px; opacity:0; transition: all 0.6s ease-out 1.2s;}
.section_2 .txt_area h2{font-size:4rem; color:var(--point-color-2); font-weight:700; line-height:1.125;}
.section_2 .txt_area p{margin-top:20px; font-size:1.25rem; line-height:1.5;}
.section_2 .txt_area .more{margin-top:40px; }
.section_2 .txt_area .more a{padding-right:70px; line-height:60px; display:inline-block; background:url(../img/ic_more.svg) no-repeat right center; font-size:1.125rem; font-weight:500;  transition: all 0.3s ease-out;}
.section_2 .txt_area .more a:hover{background:url(../img/ic_more_on.svg) no-repeat right center;}

.section_2.active .title_area{opacity:1; bottom:0;}
.section_2.active .video_area{left:0; opacity:1;}
.section_2.active .txt_area{left:0; opacity:1;}


.section_3 .title_area{margin-bottom:max(calc(60/1080*100vh),30px);}
.section_3 .title_area h1{margin-bottom:0; font-size:4rem; font-family: var(--font); font-weight:700; line-height:1;}
.section_3 .title_area p{margin-top:20px; font-size:1.25rem; line-height:1.5;}
.section_3 .list ul{display:flex; flex-wrap:wrap; gap:30px;}
.section_3 .list ul li{padding:30px; width: calc((100% - 60px)/3); height:210px; border-radius:max(calc(30/1920*100vw),15px) 0 max(calc(30/1920*100vw),15px) 0; background-color:#F4F4F4; display:flex; flex-direction: column; justify-content: space-between; transition: all 0.6s ease-out;  position:relative; bottom:-40px; opacity:0; }
.section_3 .list ul li:nth-child(1){transition-delay:0.8s;}
.section_3 .list ul li:nth-child(2){transition-delay:1.1s;}
.section_3 .list ul li:nth-child(3){transition-delay:1.4s;}
.section_3 .list ul li .tit{font-size:1.25rem; font-weight:700; line-height:1.5; transition: all 0.3s ease-out;}
.section_3 .list ul li .download{text-align:right;}
.section_3 .list ul li .download a{padding-right:30px; font-size:1.125rem; color:#666; background:url(../img/download.svg) no-repeat right center; line-height:1.6; transition: all 0.3s ease-out;}
.section_3 .list ul li:hover{box-shadow:10px 10px 10px rgba(0,0,0,0.15); background-color:var(--point-color-1); }
.section_3 .list ul li:hover .tit{color:#fff; }
.section_3 .list ul li:hover .download a{background:url(../img/download_on.svg) no-repeat right center; color:#fff;}
.section_3 .link{margin-top:max(calc(76/1080*100vh),30px); padding:20px 40px; height:100px; box-sizing:border-box; display:flex; align-items: center; border: 1px solid #D4D4D4; border-radius:max(calc(30/1920*100vw),15px) 0 max(calc(30/1920*100vw),15px) 0;  position:relative; bottom:-40px; opacity:0; transition: all 0.6s ease-out 1.5s;}
.section_3 .link strong{font-size:1.25rem; }
.section_3 .link a{margin-left:auto; font-size:1.125rem; font-weight:700; color:var(--point-color-2);}
.family_logo{padding:0 max(calc(120/1920*100vw),40px); width:100%; }
.family_logo .inner{display:flex; align-items: center;}
.family_logo .tit{width:240px; font-size:1.25rem; color:#222;}
.family_logo_rolling_wrap{width: calc(100% - 360px);} 
.family_logo_rolling .swiper-slide{height:120px; display:Flex; align-items: center; justify-content: center;}
.family_logo .control{margin-left:auto; width:100px; display:Flex; align-items: center; gap:10px;}
.family_logo .control button{width:33%; aspect-ratio: 1/1; }
.family_logo .control .family_logo_prev{background:url(../img/rolling_prev.svg) no-repeat center center;}
.family_logo .control .family_logo_next{background:url(../img/rolling_next.svg) no-repeat center center;}
.family_logo .control .family_logo_stop{background:url(../img/rolling_stop.svg) no-repeat center center;}

.section_3.active .title_area,
.fp-viewing-4 .section_3 .list ul li,
.section_3.active .list ul li{opacity:1; bottom:0;}
.fp-viewing-4  .section_3 .link,
.section_3.active .link{bottom:0; opacity:1;}
.fp-viewing-4 .section_3 .title_area{left:0; opacity:1;}

.pc_only{display:block;}
.mb_only{display:none;}

@media screen and (max-width: 960px){
.main .title_area h1{font-size:3rem;}
.main .title_area p{margin-top:10px; font-size:1rem;}

.main_vs_txt .txt_1{font-size:3rem;}
.main_vs_txt .txt_2{font-size:1.25rem;}
.section_1 .tab_wrap .tab_title ul li>*{padding:0 20px;}
.section_3 .link{height:80px;}
.section_1 .tab_wrap .tab_title ul li>*{height:120px;}
.family_logo{padding:0 max(calc(60/1920*100vw),30px)}
.family_logo .tit{width:100px; }
.family_logo_rolling_wrap{width: calc(100% - 220px);}

.family_logo_rolling .swiper-slide{height:80px;}
}

@media screen and (max-width: 768px){
.pc_only{display:none;}
.mb_only{display:block;}

.section .fp-tableCell{padding-top:var(--header_h);}
.section_1{background:url(../img/main_bg_m.svg) no-repeat center bottom;}
.section_1 .tab_wrap{margin-top:20px; display:block;}
.section_1 .tab_wrap .tab_title{width:100%;}
.section_1  .tab_title ul{display:Flex;}
.section_1  .tab_title ul li{width:33.33%;}
.section_1 .tab_wrap .tab_title ul li{ display:block;}
.section_1 .tab_wrap .tab_title ul li>*{padding:0 5px; width:100%; height:60px; justify-content: center;}
.section_1 .tab_wrap .tab_title span{font-size:3.33vw; text-align:center;}
.section_1 .tab_wrap .tab_title strong{font-size:1.94vw;}
.section_1 .tab_wrap .tab_title ul li:before{display:none;}
.section_1 .tab_wrap .tabCont{margin-top:max(calc(60/1080*100vh),30px); width:100%;}
.section_1 .tabCont ul{gap:4.17vw;}
.section_1 .tabCont ul li .img_area{padding:10px;}
.section_1 .tabCont ul li .txt_area{padding:14px 0; font-size:3.33vw;}
.section_1 .more{position:relative; left:auto; right:auto; top:auto; margin-top:10px;}
.section_1 .more a{padding-right:50px;background-size:40px; line-height:40px;}
.main .title_area h1{font-size:8.89vw;}
.main .title_area p{word-break: keep-all;}
.main .title_area p br{display:none; }
.section_2 .title_area{margin-bottom:40px;}
.section_2 .d-flex{display:block; }
.section_2 .video_area{margin-bottom:7vw; width:100%;}
.section_2 .txt_area{width:100%;}
.section_2 .txt_area h2{font-size:8.89vw;}
.section_2 .txt_area p{margin-top:10px; font-size:3.33vw;}
.section_2 .txt_area .more{margin-top:15px;}
.section_2 .txt_area .more a{padding-right:50px;background-size:40px; line-height:40px;}
.section_2 .txt_area .more a:hover,
.section_1 .more a:hover{background-size: 40px;}

.section_3 .fp-tableCell{padding:var(--header_h) 0;}
.section_3 .list ul{display:block;}
.section_3 .list ul li{margin-bottom:10px; width:100%; height:100px; padding:15px;}
.section_3 .link{margin-top:20px; padding:15px;  display:block;}
.family_logo .tit{display:none;}
.family_logo .control{display:none;}
.family_logo{padding:0 var(--padding); }
.family_logo_rolling_wrap{width:100%;}
.family_logo_rolling .swiper-slide{height:60px;}
}

/*footer*/
.footer{padding:48px 0; background-color:#373737;}
.footer .cont{display:Flex;}
.footer_cont .menu ul{display:flex; gap:25px;}
.footer_cont .menu ul li a{font-size:1.125rem; color:#fff; font-weight:700;}
.footer_cont .menu ul li a strong{color:#FF7581;}
.footer_cont .info{margin-top:18px;}
.footer_cont .info li{font-size:1rem; color:#fff; line-height:1.875; display:flex; gap:10px;}
.footer_cont .copyright{margin-top:18px; font-size:1rem; color:#fff;}
.footer .right_area{margin-left:auto; display:flex; flex-direction: column; justify-content: space-between;}
.footer .family_site{position:relative; max-width:240px; width:100%;}
.footer .btn_family_site_open{width:100%; height:45px; line-height:45px; font-size:1.125rem; font-weight:500; color:#fff; background:url(../img/ic_plus.svg) no-repeat right center; display:block; text-align:left;  border-bottom:1px solid #fff;}
.footer .family_site_list{position:absolute; left:0; bottom:45px; z-index:10; width:100%; background-color:#fff; padding:20px;  box-shadow:2px 10px 10px 10px rgba(0,0,0,0.1); display:none;}
.footer .family_site_list ul li{padding:5px 0;}
.footer .sns_list ul{display:Flex; align-items: center; gap:38px;}

@media screen and (max-width: 768px){
.footer{padding:24px 0; }
.footer .fp-tableCell{padding-top:0;}
.footer .cont{display:block;}
.footer .right_area{margin-top:20px; display:flex; align-items: center; justify-content: space-between; flex-direction:row;}
.footer .family_site{max-width:160px;}
.footer .sns_list ul{gap:10px;}
.footer .sns_list ul li img{width:26px;}
.footer_cont .info li{display:block; }
.footer_cont .info li span{display:block; }
}


/* layout */
.sub_visual{position:relative; height:520px; background:url(../img/sub_visual_1.png) no-repeat center center; background-size:cover; display:flex; align-items: center; justify-content: center;}
.sub_visual_1{background:url(../img/sub_visual_1.png) no-repeat center center; background-size:cover; justify-content: center}
.sub_visual_2{background:url(../img/sub_visual_2.png) no-repeat center center; background-size:cover; justify-content: center}
.sub_visual_3{background:url(../img/sub_visual_3.png) no-repeat center center; background-size:cover; justify-content: center}
.sub_visual_4{background:url(../img/sub_visual_4.png) no-repeat center center; background-size:cover; justify-content: center}
.sub_visual_5{background:url(../img/sub_visual_5.png) no-repeat center center; background-size:cover; justify-content: center}
.sub_vs_txt h1{font-size:3.25rem; font-weight:700; color:#fff;  text-align:center;}
.tnb{position:absolute; left:0; bottom:0; width:100%;  background-color:#000;}
.tnb>ul{margin:0 auto; max-width:calc(var(--width) - 40px); box-sizing:border-box; display:flex;}
.tnb>ul>li{flex-grow:1; }
.tnb>ul>li>a{height:70px; display:flex; align-items: center; justify-content: center; font-size:1.25rem; color:#fff; font-weight:700; }
.tnb>ul>li.active>a{background-color:#fff; color:#000;}
.sub_cont{margin:0 auto; max-width:var(--width); padding:100px var(--padding) 150px; }
.sub_top_title{margin-bottom:max(calc(100/1920*100vw),40px);}
.sub_top_title h2{font-size:2.5rem; font-weight:700; text-align:center; }
.sub_top_title p{margin-top:20px; font-size:1.25rem; font-weight:500; color:#666; text-align:center;}

@media screen and (max-width: 960px){
.sub_visual{height:300px;}
.sub_vs_txt h1{font-size:2.5rem;}
.tnb>ul>li>a{height:50px; font-size:1rem;}
.sub_cont{padding:50px var(--padding) 70px;}
}

/*intro*/
.intro_cont{display:flex; word-break: keep-all;}
.intro_cont .img_area{width:43%;}
.intro_cont .txt_area{margin-left:auto; width:50%;}
.intro_cont .img_area h3{margin-bottom:max(calc(80/1920*100vw),40px); font-size:3rem; font-weight:700; line-height:1.2;}
.intro_cont .txt_area p{font-size:1.25rem; line-height:1.5; }
.intro_cont .txt_area p strong{margin-bottom:20px; font-size:1.5rem; color:#C90008; font-weight:700; display:block; }
.intro_cont .txt_area .name{margin-top:20px; font-size:1.25rem; font-weight:700;}
@media screen and (max-width: 960px){
.intro_cont{display:block; }
.intro_cont .img_area{width:100%; text-align:center; margin-bottom:50px; }
.intro_cont .img_area br{display:none;}
.intro_cont .txt_area{width:100%;}
}

/* overview */
.overview .img_area{margin-bottom:max(calc(100/1920*100vw),40px);}
.overview .txt_area{display:flex;}
.overview .txt_area h3{width:45%; font-size:3rem; font-weight:700; line-height:1.2;}
.overview .txt_area .table_area{margin-left:auto; width:49%; border-top:1px solid #111;}
.overview .txt_area .table_area th{width:120px; padding:12px 0; border-bottom:1px solid #D4D4D4; font-size:1.25rem; font-weight:500; text-align:left; vertical-align: top;}
.overview .txt_area .table_area td{padding:12px 0; border-bottom:1px solid #D4D4D4; font-size:1.25rem; color:#666;}
.overview .txt_area .table_area td strong{font-weight:500; display:block; color:#111; }
@media screen and (max-width: 960px){
.overview .txt_area{display:block;}
.overview .txt_area h3{width:100%; margin-bottom:50px; word-break: keep-all;}
.overview .txt_area h3 br{display:none;}
.overview .txt_area .table_area{width:100%; margin-bottom:50px;}
}
@media screen and (max-width: 768px){
.overview .txt_area h3{margin-bottom:30px; font-size:2rem;}
.overview .txt_area .table_area th{width:100px;}
}


/* location */
.location .map_area iframe{width:100%; display:block; height:520px; border:1px solid #ddd;}
.location_list{padding:30px 0; }
.location_list ul{display:flex; gap:10px 35px; flex-wrap:wrap;}
.location_list ul li{display:flex; font-size:1.25rem; color:#666; gap:20px;}
.location_list ul li strong{flex-shrink: 0; font-size:1.25rem; font-weight:500;}
.location .subway{border-top:1px solid #ddd; padding-top:30px; display:flex; flex-wrap:wrap;}
.location .subway .d-flex{gap:70px;}
.location .subway .d-flex strong{flex-shrink: 0; font-size:1.25rem; color:#111; font-weight:500; line-height:1.5;}
.location .subway .d-flex span{font-size:1.25rem; font-weight:500; color:#666; line-height:1.5;}
.location .subway .line{margin-left:auto; }
.location .subway .line ul{display:Flex; align-items: center; gap:55px;}
.location .subway .line ul li{display:flex; gap:10px; align-items: center;}
.location .subway .line ul li .circle{width:80px; height:80px; display:Flex; align-items: center; justify-content: center; border-radius:50%; font-size:1.25rem; }
.location .subway .line ul li .circle.blue{background-color:#18A7EF; color:#fff;}
.location .subway .line ul li .circle.yellow{background-color:#FFCE33; color:#111; font-size:1rem;text-align:center;}
@media screen and (max-width: 960px){
.location .subway{display:block; }
.location .subway .line{margin-top:20px;}
}
@media screen and (max-width: 768px){
.location .map_area iframe{height:300px;}
.location_list{padding:15px 0;}
.location .subway{padding-top:15px;}
.location .subway .d-flex{gap:20px;}
.location .subway .line ul{gap:30px;}
}

/* product_list */
.product_list>ul{display:flex; gap:30px; flex-wrap:wrap;}
.product_list>ul>li{width: calc((100% - 60px)/3); }
.product_list>ul>li>a{position:Relative; border-radius:max(calc(60/1920*100vw),20px) 0 max(calc(60/1920*100vw),20px) 0; border:1px solid #ddd; overflow:hidden; display:block;}
.product_list>ul>li>a:before{position:absolute; left:0; top:0; width:100%; height:100%; border-radius:max(calc(60/1920*100vw),20px) 0 max(calc(60/1920*100vw),20px) 0; border:3px solid var(--point-color-1); transition: all 0.3s ease-out; display:block; content:""; box-sizing:border-box; opacity:0;}
.product_list>ul>li .img_area{padding:50px; }
.product_list>ul>li .img_area .inner{margin:0 auto; max-width:306px; aspect-ratio: 306/300;}
.product_list>ul>li .img_area img{width:100%; height:100%; object-fit: cover;}
.product_list>ul>li .txt_area{padding:20px 0; font-size:1.5rem; font-weight:700; text-align:center; transition: all 0.3s ease-out;}
.product_list>ul>li>a:hover:before{opacity:1;}
.product_list>ul>li>a:hover .txt_area{background-color:var(--point-color-1); color:#fff;}
@media screen and (max-width: 768px){
.product_list>ul{gap:15px;}
.product_list>ul>li{width: calc((100% - 15px)/2); }
.product_list>ul>li .img_area{padding:10px;}
.product_list>ul>li .txt_area{padding:10px 0; font-size:1.2rem;}
}

/* product_view_cont */
.product_view_cont .top_area{display:flex;  padding-bottom:max(calc(80/1920*100vw),40px);}
.product_view_cont .top_area .img_area{width:43%; display:flex; align-items: center; justify-content: center; aspect-ratio: 564/480; border-radius:max(calc(60/1920*100vw),20px) 0 max(calc(60/1920*100vw),20px) 0; border:1px solid #ddd; overflow:hidden;}
.product_view_cont .top_area .img_area #bo_v_img{display:flex; align-items: center; justify-content: center; aspect-ratio: 564/480;}
.product_view_cont .top_area .img_area img{max-width:100%; max-height:100%; object-fit: cover;}
.product_view_cont .top_area .txt_area{margin-left:auto; width:47%; font-size:1.25rem; line-height:1.5;}
.product_view_cont .view_cont{padding:max(calc(80/1920*100vw),40px) 0; border-top:1px solid #ddd; display:flex;}
.product_view_cont .view_cont .title{width:34%; }
.product_view_cont .view_cont .title h3{font-size:2rem; font-weight:700;}
.product_view_cont .view_cont .txt_area{width:66%; font-size:1.25rem; line-height:1.5;}
.product_view_cont .link{padding:20px 40px; min-height:100px; box-sizing:border-box; border:1px solid #ddd; border-radius:max(calc(30/1920*100vw),15px) 0 max(calc(30/1920*100vw),15px) 0; display:flex; align-items: center;}
.product_view_cont .link span{font-size:1.25rem; display:block; }
.product_view_cont .link a{margin-left:auto; font-size:1.25rem; font-weight:700; color:var(--point-color-2);}
.product_view_cont .btn_area{margin-top:60px; text-align:center;}
.product_view_cont .btn_area a{width:180px; height:60px; line-height:58px; border:1px solid #111; border-radius:2em; text-align:center; display:inline-block; font-size:1.25rem; font-weight:600; color:#111; transition: all 0.3s ease-out;}
.product_view_cont .btn_area a:hover{background-color:#111; color:#fff;}
@media screen and (max-width: 960px){
.product_view_cont .view_cont{display:block;}
.product_view_cont .view_cont .title{width:100%; margin-bottom:20px; }
.product_view_cont .view_cont .txt_area{width:100%;}
.product_view_cont .link{padding:10px 20px;}
.product_view_cont .top_area .txt_area{width:52%;}
}
@media screen and (max-width: 768px){
.product_view_cont .top_area{display:block; }
.product_view_cont .top_area .img_area{width:100%; margin-bottom:30px; }
.product_view_cont .top_area .txt_area{width:100%;}
.product_view_cont .view_cont .title h3{font-size:1.75rem;}
.product_view_cont .link{display:block; min-height:1px;}
.product_view_cont .btn_area{margin-top:30px; }
.product_view_cont .btn_area a{width:120px; height:40px; line-height:38px;}
}

/* estimate_list */
.estimate_list>ul>li{margin-bottom:10px; display:flex; padding:25px 60px; align-items: center; border:1px solid #ddd; border-radius:20px 0 20px 0;}
.estimate_list>ul>li .num{width:100px; font-size:1.125rem; color:#666;}
.estimate_list>ul>li .title{width: calc(100% - 100px); font-size:1.25rem; font-weight:500;
text-overflow:ellipsis;
white-space:nowrap;
word-wrap:normal;
overflow:hidden;
}
@media screen and (max-width: 768px){
.estimate_list>ul>li{padding:15px 20px;}
.estimate_list>ul>li .num{width:60px;}
.estimate_list>ul>li .title{width: calc(100% - 60px);}
}

/* custom_checkbox */
.custom_checkbox{position:relative; display:inline-block; overflow: hidden;}
.custom_checkbox input[type=checkbox]{position:absolute; left:-20px; top:0; }
.custom_checkbox label{display:flex; align-items: center; gap:8px; font-size:1.125rem;}
.custom_checkbox label:before{width:24px; aspect-ratio: 1/1; background:url(../img/ic_check.svg) no-repeat center center; border-radius:4px; border:1px solid #ddd; transition: all 0.3s ease-out; display:block; content:"";}
.custom_checkbox input[type=checkbox]:checked+label:before{background:url(../img/ic_check_on.svg) no-repeat center center var(--point-color-1);}

/* estimate_write */
.estimate_write .list{display:flex; gap:30px; flex-wrap:wrap;}
.estimate_write .list>li{width: calc((100% - 60px)/3); }
.estimate_write .list>li input[type=number],
.estimate_write .list>li input[type=password],
.estimate_write .list>li input[type=text]{width:100%; height:60px; line-height:58px; border:1px solid #b4b4b4; border-radius:4px; transition: all 0.3s ease-out;}
.estimate_write .list>li.w100p{width:100%;}
.estimate_write .list>li textarea{width:100%; height:320px; border:1px solid #b4b4b4; border-radius:4px;}
.estimate_write .terms_box{margin:70px 0 15px;}
.estimate_write .terms_box h3{margin-bottom:20px; font-size:1.5rem; font-weight:700;}
.estimate_write .terms_box pre{padding:20px; width:100%; height:240px; box-sizing:border-box; border:1px solid #ddd; border-radius:4px; overflow:auto; font-size:1.125rem;  white-space: pre-wrap;}
.estimate_write .btn_area{margin-top:75px; display:flex; align-items: center; gap:10px; justify-content: center;}

@media screen and (max-width: 960px){
  .estimate_write .list{gap:10px;}
.estimate_write .list>li{width:100%;}
.estimate_write .list>li input[type=number],
.estimate_write .list>li input[type=password],
.estimate_write .list>li input[type=text]{height:46px; line-height:44px;}
}

/* btn */
.basic-btn01{width:180px; height:60px; line-height:60px; border-radius:2em; text-align:center; font-size:1.25rem; }
.btn-gray-bg{background-color:#949494; color:#fff;}
.btn-red-bg{background-color:var(--point-color-1); color:#fff;}
@media screen and (max-width: 960px){
.basic-btn01{width:120px; height:46px; line-height:46px;}
}

/* total_menu */
.total_menu{position:fixed; left:0; top:0; z-index:100; width:100vw; height:100vh; visibility: hidden; opacity:0; transition: all 0.3s ease-out;}
.total_menu.active{visibility: visible; opacity:1;}
.total_menu_bg{position:fixed; left:0; top:0; width:100vw; height:100vh; background:rgba(0,0,0,0.5);}
.total_menu.active .total_menu_inner{right:0;}
.total_menu_inner{position:fixed; right:-100%; top:0; padding-top:220px; width:100%; max-width:640px; height:100vh; overflow:auto; background-color:#fff; transition: all 0.3s ease-out;}
.total_menu_close{position:absolute; right:0; top:0; width:100px; aspect-ratio: 1/1; background:url(../img/menu_close.svg) no-repeat center center; display:block; }
.total_menu_list{padding:0 max(calc(80/1920*100vw), 30px); }
.total_menu_list>li{margin-bottom:60px;}
.total_menu_list>li:last-child{margin-bottom:0;}
.total_menu_list>li>a{font-size:1.75rem; font-weight:700; }
.total_menu_list>li .s_menu{position:relative; margin-top:30px; }
.total_menu_list>li .s_menu>ul{display:flex; align-items: center; gap:40px;}
.total_menu_list>li .s_menu>ul>li>a{font-size:1.25rem; line-height:1.5; transition: all 0.3s ease-out; font-weight:500;}
.total_menu_list>li .s_menu>ul>li:hover>a{color:var(--point-color-1);}

@media screen and (max-width: 640px) {
.total_menu_close{width:70px;}
.total_menu_inner{padding-top:140px; }
.total_menu_list>li{margin-bottom:40px;}
.total_menu_list>li .s_menu>ul{gap:20px;}
}