:root {
    --fs-heads:28px;
    --fs-headm:32px;
    --fs-headl:40px;
    --fs-tits:20px;
    --fs-titm:24px;
    --fs-titl:28px;
    --fs-bodys:14px;
    --fs-bodym:16px;
    --fs-bodyl:18px;
    --fs-descript:12px;

    --fw-l:100;
    --fw-r:200;
    --fw-b:700;
    --fw-eb:800;

    --c-main:#333333;
    --c-pick:#076AEB;
    --c-1522:#FF571F;
    --c-g1:#fafafa;
    --c-g2:#dddddd;
    --c-g3:#aaaaaa;

    --op-w2:rgba(255,255,255,0.02);
    --op-w5:rgba(255,255,255,0.05);
    --op-w15:rgba(255,255,255,0.15);
    --op-w35:rgba(255,255,255,0.35);
    --op-w50:rgba(255,255,255,0.5);
    --op-w70:rgba(255,255,255,0.7);
    --op-w90:rgba(255,255,255,0.9);

    --op-b2:rgba(0,0,0,0.02);
    --op-b5:rgba(0,0,0,0.05);
    --op-b15:rgba(0,0,0,0.15);
    --op-b35:rgba(0,0,0,0.35);
    --op-b50:rgba(0,0,0,0.5);
    --op-b70:rgba(0,0,0,0.7);
    --op-b90:rgba(0,0,0,0.9);

    --fc-base:#333333;
    --fc-secon:#aaaaaa;
    --fc-terti:#dddddd;

    --br:15px;
}

body {width:100%; height:100%; margin:0; padding:0; font-family:'NanumSquare'; font-size:var(--fs-bodym); font-weight:var(--fw-r); color:var(--fc-base); line-height:1.5; letter-spacing:normal;}

ul {margin:0; padding:0; list-style:none;}
p {margin:0; padding:0;}
a {text-decoration:none; color:#000;}
a:hover, a:active, a:focus {text-decoration:none;}

#wrap {display:block; width:100%; height:auto;}
.inner {position: relative; width:100%; max-width:1440px; padding:0px 40px; margin:auto; text-align:center; box-sizing:border-box;}
.inner-p {position: relative; width:100%; max-width:1440px; padding:120px 40px; margin:auto; text-align:center; box-sizing:border-box;}

.dis-on {display: inline-block !important;}
.dis-off {display: none !important;}
.strong {font-weight:var(--fw-eb);}

.mt0 {margin-top: 0 !important;}
.mb20 {margin-bottom: 20px !important;}

.headline {display: inline-block; width: auto; padding: 0 0 80px 0; font-size: var(--fs-headm); text-align: center; background-image: url(../img/headline-bar.svg); background-repeat: no-repeat; background-position: center bottom 60px;}

.title {display: inline-block;  width: 100%; padding: 0 0 80px 0; font-size: var(--fs-titm); font-weight: var(--fw-r); text-align: center;}
.title.s-1522 strong {color: var(--c-1522); font-weight: var(--fw-r);}
.title.s-pick strong {color: var(--c-pick); font-weight: var(--fw-r);}
.title span {display: inline-block; width: auto;}

.subtitle {padding-left: 30px; margin-top: 120px; margin-bottom: 24px; font-size: var(--fs-bodyl); font-weight: var(--fw-eb); text-align: left; background-repeat: no-repeat; background-position: left center;}
.subtitle.s-1522 {background-image: url(../img/bullet-o.svg);}
.subtitle.s-pick {background-image: url(../img/bullet-b.svg);}

/* header */
header {display: block; position: fixed; width: 100%; padding: 40px 0; color: var(--c-main); box-sizing: border-box; z-index: 100;}
header .wrap {display: flex; position: relative; flex-direction: row; justify-content: space-between; align-items: center;}
header .ci {line-height: 1.0;}
header .ci a {display: inline-block; width: 155px; height: 20px; background-image: url(../img/ci.svg); background-repeat: no-repeat; background-position: center;}
header .ci a:hover {opacity: 0.5;}
header .menu {position: relative;}
header .menu span {margin-right: 24px;}
header .menu span:last-child {margin-right: 0;}
header .menu span a:hover {text-decoration: underline;}
header .menu span a.on {text-decoration: underline;}
header .menu .sub {display: none; position: absolute; top: 0px; right: 32px; padding-top: 35px;}
header .menu .sub.on {display: inline-block;}
header .menu .sub .pack {display: inline-block; padding: 20px 32px; text-align: left; border: 1px solid var(--op-b15); border-radius: var(--br); background: #ffffff;}
header .menu .sub li {margin-bottom: 8px;}
header .menu .sub li:last-child {margin-bottom: 0;}
header .menu .sub li a {display: inline-block; padding: 3px 0;}

header .mb {display: none; width: 24px; height: 24px; background-image: url(../img/bars.svg); cursor: pointer;}
header .mb:hover {opacity: 0.5;}

header .mb-menu {display: none; position: absolute; top: 0; left: 0; width: 100vw; height: 100vh; background: #ffffff; box-sizing: border-box;}
header .mb-menu.on {display: block;}
header .mb-menu .top {display: flex; flex-direction: row; justify-content: space-between; align-items: center; padding: 20px 24px; background-color: var(--c-g1); border-bottom: 1px solid var(--op-b15);}
header .mb-menu .top .ci a {display: inline-block; width: 155px; height: 20px; background-image: url(../img/ci.svg); background-repeat: no-repeat; background-position: center;}
header .mb-menu .top .close {display: inline-block; width: 24px; height: 24px; background-image: url(../img/close.svg); cursor: pointer;}
header .mb-menu .list li {padding: 20px 24px;}
header .mb-menu .list li a {display: flex; flex-direction: row; justify-content: space-between; align-items: center; background-image: url(../img/arrow-right.svg); background-repeat: no-repeat; background-position: right -2px center; cursor: pointer;}
header .mb-menu .list li.open a {background-image: none;}
header .mb-menu .list li.sub {padding: 20px 24px 20px 40px; background-color: var(--c-g1);}
header .mb-menu .list li.division {display: block; height: 1px; padding: 0; border-top: 1px solid var(--c-g2);}
header .mb-menu .list li:last-child {border-bottom: 1px solid var(--c-g2);}

header.clear {background-color: rgba(255, 255, 255, 0);}
header.clear .ci a {background-image: url(../img/ci-w.svg);}
header.clear .menu span > a {color: #fff; text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.25);}

header.clear .mb {background-image: url(../img/bars-w.svg);}

header.stk {padding: 20px 0; background-color: var(--c-g1); border-bottom: 1px solid var(--op-b15);}
header.stk .ci a {background-image: url(../img/ci.svg);}
header.stk .menu span > a {color: var(--c-main); text-shadow: none;}

/* footer */
footer {color: var(--op-w50); font-size: var(--fs-descript); background-color: var(--c-main); border-top: 1px solid var(--op-w35);}
footer .top {display: flex; flex-direction: row; gap: 24px; align-items: center; width: 100%; padding-top: 32px; margin-bottom: 18px; overflow: hidden;}
footer .top li {float: left; display: inline-block;}
footer .link {text-align: left;}
footer .link a {margin-right: 16px; color: #fff;}
footer .link a:last-child {margin-right: 0;}
footer .link a:hover {opacity: 0.5;}
footer .info {padding-bottom: 16px; text-align: left;}
footer .info li {margin-bottom: 5px;}
footer .info li:last-child {margin-bottom: 0;}
footer .copy {padding: 16px 0; border-top: 1px solid var(--op-w15);}
footer .copy span {display: inline-block; width: 100%; text-align: left;}

/* main-bn */
.main-bn {display: block; position: relative; width: 100%; height: 1024px; overflow: hidden;}
.main-bn .main-video {position: absolute; top: 50%; left: 50%; min-width: 100%; min-height: 100%; width: auto; height: auto; transform: translate(-50%, -50%); z-index: 0; object-fit: cover; z-index: 0;}
.main-bn .inner {position: relative; height: 100%;}
.main-bn .slogan {position: absolute; bottom: 60px; right: 40px; color: #fff; text-shadow: 0px 3px 4px rgba(0, 0, 0, 0.25); text-align: right; z-index: 50;}
.main-bn .slogan li:first-child {font-size: var(--fs-heads); font-weight: var(--fw-l);}
.main-bn .slogan .core {margin-top: 20px; font-size: 128px; font-weight: var(--fw-l);}
.main-bn .slogan .core .text {display: inline-block !important; font-weight: var(--fw-eb); margin-right: 25px; line-height: 1.5;}

/* main-service */
.main-service {display: block; align-items: center; font-size: var(--fs-bodyl); border-bottom: 1px solid var(--op-b15); box-sizing: border-box;}
.main-service .inner-p {display: flex; flex-direction: row; justify-content: space-between; gap: 80px; align-items: center;}

.main-service .txt {display: inline-block; text-align: left; width: 100%;}
.main-service .txt .tit {font-size: var(--fs-headl); font-weight: var(--fw-eb); margin-bottom: 20px;}
.main-service .txt .explain {margin-bottom: 20px;}
.main-service .txt .item {padding-left: 25px; margin-bottom: 8px; font-size: var(--fs-bodym); background-image: url(../img/bullet-o.svg); background-repeat: no-repeat; background-position: left center;}
.main-service .txt .more {margin-top: 40px; font-size: var(--fs-bodym);}
.main-service .txt .more span:last-child {display: inline-block; width: 18px; height: 13px; background-image: url(../img/more-l.svg); background-repeat: no-repeat; background-position: right center; transition: width 0.5s ease;}
.main-service .txt .more:hover span:last-child {width: 29px;}

.main-service.m-pick .txt .item {background-image: url(../img/bullet-b.svg);}
.main-service.m-pick .txt .item.ing {background-image: url(../img/bullet-b50.svg);}

.main-service .visual {display: inline-block; position: relative; width: 100%; max-width: 990px; height: auto; aspect-ratio: 990 / 550; border-radius: 0; overflow: hidden;}
.main-service .visual li {position: absolute; left: 0; top: 0; width: 100%; height: auto; aspect-ratio: 990 / 550; border-radius: 0; overflow: hidden;}
.main-service .visual li img {display: inline-block; width: 100%;}
.main-service .visual li video {width: 102%; aspect-ratio: 990 / 550; margin-left: -1%;}

/* main-venture*/
.venture {padding: 36px 0; background-color: #174092;}
.venture .inner {position: relative; min-height: 130px; background-image: url(../img/venture.png); background-repeat: no-repeat; background-size: 130px 130px; background-position: right 40px center;}
.venture li {margin-bottom: 2px; text-align: left; color: #fff; font-size: var(--fs-bodym);}
.venture li:first-child {padding-top: 15px; margin-bottom: 20px; font-size: var(--fs-headm); font-weight: var(--fw-eb);}

/* tit-bar , tab */
.tit-bar.story {background-color: var(--c-g1);}
.tit-bar.s-1522 {background-color: var(--c-1522); background-image: url(../img/titbar-1522.svg); background-position: center center; background-size: auto;}
.tit-bar.s-pick {background-color: var(--c-pick); background-image: url(../img/titbar-pick.svg); background-position: right center; background-size: auto 100%;}
.tit-bar.cs {background-color: var(--c-g1); background-image: url(../img/titbar-cs.svg); background-position: center center;}

.tit-bar {display: flex; justify-content: center; align-items: center; position: relative; width: 100%; height: 750px; border-bottom: 1px solid var(--op-b15); background-repeat: no-repeat; background-size: auto; overflow: hidden;}
.tit-bar #core {display: inline-block; width: 1100px; height: 1100px; margin-top: 570px;}
.tit-bar #core svg {width: 1100px !important; height: 1100px !important;}
.tit-bar .tit-txt {font-size: var(--fs-tits); font-weight: var(--fw-l); text-align: center; color: #fff;}
.tit-bar .tit-txt li:first-child {font-size: 64px; font-weight: var(--fw-eb);}

.tit-bar.cs .tit-txt {color: var(--fc-base);}

.tit-tab {display: block; position: relative; width: 100%; margin-top: -76px; text-align: center;}
.tab {display: inline-block; width: auto; font-size: var(--fs-tits); background-color: #fff; border-top: 1px solid var(--op-b15); border-left: 1px solid var(--op-b15); border-right: 1px solid var(--op-b15); border-bottom: 1px solid #fff; border-radius: 15px 15px 0 0; overflow: hidden;}
.tab li {float: left; display: inline-block; width: auto; min-width: 200px; padding: 24px 36px 20px 36px; margin: 0; text-align: center; color: var(--fc-secon); border-right: 1px solid var(--op-b15); border-bottom: 1px solid var(--op-b15); box-sizing: border-box; cursor: pointer;}
.tab li:first-child {margin-left: 0;}
.tab li:last-child {border-right: none;}
.tab li.on {font-weight: var(--fw-eb); color: var(--fc-base); border-bottom: 1px solid #fff;}
.tab li:hover {color: var(--fc-base);}

.con {display: none;}
.con.on {display: block;}

/* story - value */
.value {border-bottom: 1px solid var(--op-b15);}
.value .inner-p {display: flex; flex-direction: row; gap: 60px; justify-content: space-between; align-items: center; text-align: left;}
.value .connect {display: inline-block; width: 0px; height: 140px; animation: connectw 7s infinite; overflow: hidden; text-align: right;}
.value .move {display: inline-block; width: calc(100% - 570px); height: 140px; animation: movew 7s infinite; overflow: hidden;}
.value #value {display: inline-block; width: 510px; height: 500px;}
.value .tit {font-size: var(--fs-headl); font-weight: var(--fw-l); margin-bottom: 20px;}
.value .tit span {font-weight: var(--fw-eb); margin-right: 10px;}
.value .txt {font-size: var(--fs-bodyl); margin-bottom: 5px;}

@keyframes movew {
  0% { width: calc(100% - 570px); }
  40% { width: calc(100% - 570px); }      
  50% { width: 0px; }    
  90% { width: 0px; }  
  100% { width: calc(100% - 570px); }        
}

@keyframes connectw {
  0% { width: 0; }
  40% { width: 0; }      
  50% { width: calc(100% - 570px); }    
  90% { width: calc(100% - 570px); }  
  100% { width: 0; }        
}

.value-mb {display: none; border-bottom: 1px solid var(--op-b15);}
.value-mb .move-mb {padding: 12px 0 36px 0; text-align: right;}
.value-mb .connect-mb {padding: 36px 0 12px 0; text-align: left;}
.value-mb .img {margin-bottom: 24px;}
.value-mb .img img {width: 100%; max-width: 485px;} 
.value-mb ul li:nth-child(2) {font-size: var(--fs-headm); font-weight: var(--fw-l);}
.value-mb ul li span {font-weight: var(--fw-eb);}

.is {border-bottom: 1px solid var(--op-b15);}
.is .inner-p {display: flex; justify-content: center; align-items: center; text-align: left;}
.is ul {overflow: hidden;}
.is ul li {display: inline-block; float: left; width: 200px; margin-right: 60px; margin-bottom: 0;}
.is ul li:last-child {margin-right: 0; margin-bottom: 0;}
.is ul li .img {position: relative; display: inline-block; width: 200px; height: 200px; margin-bottom: 32px; filter: grayscale(100%); border: 1px solid var(--op-b50); border-radius: 200px; background-position: center; background-repeat: no-repeat; background-size: 200px 200px; transition: filter 0.5s ease, background-size 0.5s ease; overflow: hidden; box-sizing: border-box;}
.is ul li .img .out {position: absolute; display: inline-block; width: 188px; height: 188px; top: 5px; left: 5px; border: 1px solid var(--op-b15); border-radius: 200px; box-sizing: border-box; pointer-events: none;}
.is ul li .txt {display: inline-block; width: 100%; text-align: left;}

.is ul li:nth-child(1) .img {background-image: url(../img/is-01.png);}
.is ul li:nth-child(2) .img {background-image: url(../img/is-02.png);}
.is ul li:nth-child(3) .img {background-image: url(../img/is-03.png);}

.is ul li .img:hover {filter: grayscale(0%); background-size: 230px 230px;}

/* story - client */
.client {display: flex; flex-wrap: wrap; gap: 0px; width: 100%; border-top: 1px solid var(--op-b15); border-left: 1px solid var(--op-b15); box-sizing: border-box;}
.client li {flex: 0 0 20%; text-align: center; border-bottom: 1px solid var(--op-b15); border-right: 1px solid var(--op-b15); box-sizing: border-box;}
.client li img {width: 100%;}

/* story - way */
.map {border: 1px solid var(--op-b15); height: 600px; border-radius: 15px; overflow: hidden;}
.map iframe {height: 100%;}
.map-info {width: 100%; padding: 28px 0 0 0; text-align: left;}
.map-info li {margin-bottom: 8px;}
.map-info li:last-child {margin-bottom: 0px;}

/* 1522 */
.list .item {display: flex; flex-direction: row; align-items: center; gap: 48px; width: 100%; margin-bottom: 24px; overflow: hidden;}
.list .item .img {display: inline-block; width: 100%; max-width: 550px; border: 1px solid var(--c-g2); border-radius: 15px; overflow: hidden; box-sizing: border-box;}
.list .item .img img {display: block; width: 100%; height: auto;}
.list .item .txt {display: inline-block; width: 100%; text-align: left; flex: 1;}
.list .item .txt li {font-size: var(--fs-bodyl);}
.list .item .txt li:first-child {font-weight: var(--fw-eb); font-size: var(--fs-tits); margin-bottom: 20px;}

.cost-info {font-size: var(--fs-bodym); text-align: left;}
.cost-info > li {margin-bottom: 24px;}
.cost-info > li:first-child {color: var(--c-1522); font-weight: var(--fw-eb);}

/* pick */
.pick-link {margin: 160px 0 120px 0; font-size: var(--fs-bodyl);}
.pick-link li:nth-child(2) {margin: 32px 0 12px 0; font-weight: var(--fw-eb); font-size: var(--fs-headm);}
.pick-link li span {display: inline-block; width: auto;}
.pick-link .down-link {margin: 32px 0 0 0; text-align: center;}
.pick-link .down-link a {display: inline-block; width: auto; min-width: 160px; padding: 20px; margin-right: 16px; border: 1px solid var(--op-b15); box-sizing: border-box;}
.pick-link .down-link a:last-child {margin-right: 0;}
.pick-link .down-link a span {display: flex; flex-direction: row; align-items: center; gap: 10px; width: auto;}
.pick-video video {width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border: 1px solid var(--op-b15); border-radius: 15px;}

.pick-ing {display: inline-block; width: 100%; max-width: 240px; margin-bottom: 60px;}
.ing-txt li {margin-bottom: 2px; font-size: var(--fs-bodyl);}
.ing-txt li:first-child {margin-bottom: 20px; font-weight: var(--fw-eb); font-size: var(--fs-tits);}
.ing-txt li:last-child {margin-top: 0;}
.ing-txt li span {display: inline-block; width: auto;}

/* tbl */
.tbl {width: 100%; margin-bottom: 24px; font-size: var(--fs-bodym); border-top: 1px solid var(--op-b15);}
.tbl li {display: flex; flex-direction: row; align-content: center; align-items: center; padding: 16px 0; border-bottom: 1px solid var(--op-b15);}
.tbl li.thead {background: var(--c-g1);}
.tbl li.nuri {background: #fef7f4;}
.tbl li span {display: inline-block; width: 100%;}

.tbl.compare li span:nth-child(1) {width: 200px; font-weight: var(--fw-r);}
.tbl.compare li span:nth-child(2) {width: 200px;}
.tbl.compare li span:nth-child(3) {width: 100%;}
.tbl.compare li span:nth-child(4) {width: 200px;}

.tbl.noti {margin-bottom: 0px;}
.tbl.noti li span {width: 100%; text-align: left;}

.tbl.noticon {text-align: left;}
.tbl.noticon .con {padding: 80px 0;}
.tbl.noticon .con p {margin-bottom: 10px;}
.tbl.noticon .nav span:first-child {width: 100px;}
.tbl.noticon .con .paragraph {margin-bottom: 40px;}

.btn-wrap {display: flex; justify-content: flex-end;}
.btn-list {position: relative; display: inline-block; width: 100px; height: 40px; border: 1px solid var(--c-main); border-radius: 999px; overflow: hidden; cursor: pointer;}
.btn-list li {display: inline-block; height: 40px; box-sizing: border-box; transition: all 0.5s ease;}
.btn-list .txt {position: absolute; left: 5px; padding: 8px 12px;}
.btn-list .arrow {position: absolute; top: -1px; left: 60px; width: 40px; height: 40px; background-image: url(../img/btn-list-arrow.svg); background-repeat: no-repeat; background-size: 40px 40px;}
.btn-list:hover .txt  {left: 40px;}
.btn-list:hover .arrow  {left: -1px;}

/* cs */
.cs-call {margin: 0 0 60px 0;}
.cs-txt {font-size: var(--fs-bodyl);}
.cs-txt li:last-child {margin-top: 0;}
.cs-txt .cs-tel {display: inline-block; margin: 0 0 24px 0; font-size: var(--fs-headl); font-weight: var(--fw-eb); text-decoration: underline;}
.cs-txt span {display: inline-block; width: auto;}

/* float */
.float {display: inline-block; position: fixed; right: 40px; bottom: 40px; width: auto; z-index: 100;}
.float .fl-pc {display: inline-block; width: auto;}
.float .fl-pc li {height: 100px;}
.float .fl-mb {display: none; flex-direction: row; justify-content: space-between; align-items: center; width: 100%; height: 40px; border-top: 1px solid var(--op-w15); background-color: var(--c-main);}
.float .fl-mb li {width: 50%; height: 100%; text-align: center; border-right: 1px solid var(--op-w15); box-sizing: border-box;}
.float .fl-mb li:last-child {border-right: none;}
.float .fl-mb li a {display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; color: #fff; font-size: var(--fs-descript);}
.float .fl-mb li a .ico {display: inline-block; width: 18px; height: 18px; margin-right: 4px;}

.pop {display: none; position: absolute; left: 0; top: 0; width: 100vw; height: 100vh; padding: 80px; box-sizing: border-box; background-color: var(--op-b70); z-index: 200;}
.pop.on {display: flex; justify-content: center; align-items: center;}
.pop .pop-close {display: inline-block; position: absolute; top: 10px; right: 10px; width: 60px; height: 60px; cursor: pointer; overflow: hidden;}
.pop .pop-close img {width: 100%; margin: 0;}
.pop .pop-close:hover img {width: 110%; margin: -5% 0 0 -5%;}

.pop .pop-biz {display: flex; flex-direction: column; position: relative; width: 720px; height: 100%; background-color: #fff; border-radius: var(--br); overflow: hidden;}
.pop .pop-biz .biz-top {position: relative; padding: 60px 40px 0px 40px; font-size: var(--fs-bodys); background-color: var(--c-1522);}
.pop .pop-biz .biz-top li {color: #fff;}
.pop .pop-biz .biz-top li:first-child {margin-bottom: 16px; font-size: var(--fs-tits); font-weight: var(--fw-eb);}
.pop .pop-biz .biz-top .biz-menu {display: block; width: auto; margin-top: 32px; overflow: hidden;}
.pop .pop-biz .biz-top .biz-menu span {display: inline-block; float: left; width: auto; padding: 12px 36px; color: var(--fc-secon); text-align: center; border-top: 1px solid var(--op-b15); border-bottom: 1px solid var(--op-b15); border-left: 1px solid var(--op-b15); background-color: #fff; box-sizing: border-box; cursor: pointer;}
.pop .pop-biz .biz-top .biz-menu span:first-child {border-radius: var(--br) 0 0 0;}
.pop .pop-biz .biz-top .biz-menu span:last-child {border-right: 1px solid var(--op-b15); border-radius: 0 var(--br) 0 0;}
.pop .pop-biz .biz-top .biz-menu span.on {border-bottom: 1px solid #fff; color: var(--fc-base); font-weight: var(--fw-eb);}
.pop .pop-biz .biz-top .biz-menu span:hover {color: var(--fc-base);}

.pop .pop-con {flex: 1; width: 100%; overflow-y: auto;}
.pop .pop-con .require {color: var(--c-1522);}

.pop .pop-biz .con-tell {display: none; justify-content: center; align-items: center; width: 100%; text-align: center; box-sizing: border-box;}
.pop .pop-biz .con-tell.on {display: flex;}
.pop .pop-biz .con-tell .tel-img {width: auto;}
.pop .pop-biz .con-tell .tel-link {display: inline-block; font-size: var(--fs-headl); font-weight: var(--fw-eb); text-decoration: underline; margin: 60px 0 24px 0;}

.pop .pop-biz .con-mail {display: none; width: 100%; padding: 40px; font-size: var(--fs-bodys); box-sizing: border-box;}
.pop .pop-biz .con-mail.on {display: block;}
.pop .pop-biz .con-mail .noti {margin-bottom: 16px;}
.pop .pop-biz .con-mail .noti .txt {display: block; width: 100%; padding: 12px; margin-top: 4px; font-size: var(--fs-descript); background: var(--op-b2); border: 1px solid var(--op-b15); border-radius: 4px; box-sizing: border-box;}
.pop .pop-biz .con-mail .noti .txt span {display: inline-block; padding-left: 14px; background-image: url(../img/ico-dot.svg); background-repeat: no-repeat; background-position: 0 6px;}
.pop .pop-biz .con-mail .input-wrap {margin-bottom: 16px;}
.pop .pop-biz .con-mail .input-wrap input[type="text"] {width: 100%; padding: 8px 12px; margin-top: 4px; border: 1px solid var(--op-b15); border-radius: 4px; box-sizing: border-box;}
.pop .pop-biz .con-mail .term {margin: 0 0 24px 0;}
.pop .pop-biz .con-mail .term .txt textarea {display: block; width: 100%; height: 200px; padding: 12px; margin-top: 4px; font-size: var(--fs-descript); line-height: 1.5; background: var(--op-b2); border: 1px solid var(--op-b15); border-radius: 4px; box-sizing: border-box; overflow-y: auto;}
.pop .pop-biz .con-mail .term .agree {display: flex; margin-top: 8px;}
.pop .pop-biz .con-mail .term .agree input[type="checkbox"] {width: 18px; height: 18px; margin: 0 8px 0 0;}

.pop .pop-biz .con-mail .biz-btn {display: inline-block; width: 100%; padding: 12px 20px; color: #fff; font-size: var(--fs-bodyl); text-align: center; border: none; border-radius: 4px; background: var(--c-1522); box-sizing: border-box; cursor: pointer;}



/* scroll */
::-webkit-scrollbar {width:5px;} 
::-webkit-scrollbar-thumb {background-color:#555; border-radius:0px;}
::-webkit-scrollbar-track {background-color:#ddd; border-radius:0px; box-shadow:inset 0px 0px 1px rgba(0,0,0,0.1);}



@media screen and (max-width:990px) {
  body {letter-spacing: -1.0px;}

  .title {padding: 0 0 60px 0; font-size: var(--fs-tits);}
  .title span {width: 100%;}
  .subtitle {margin-top: 60px;}
  .headline {padding: 0 0 60px 0; font-size: var(--fs-titm); background-position: center bottom 40px;}

  .inner {padding:0px 24px;}
  .inner-p {padding:60px 24px;}

  header {padding: 20px 0;}
  header .menu {display: none;}
  header .mb  {display: block;}

  .main-bn {height: 90vh;}
  .main-bn .slogan {right: 24px; bottom: 12px;}
  .main-bn .slogan li:first-child {font-size: var(--fs-bodym);}
  .main-bn .slogan .core {font-size: 60px; margin-top: 28px;}
  .main-bn .slogan .core .text {display: block !important; margin-right: 0; line-height: 1.0;}

  .main-service {font-size: var(--fs-bodym);}
  .main-service.m-1522 .inner-p {flex-direction: column-reverse; gap: 36px;}
  .main-service.m-pick .inner-p {flex-direction: column; gap: 36px;}
  .main-service .visual li {border-radius: var(--br);}
  .main-service .visual li img {display: none;}
  .main-service .txt .tit {font-size: var(--fs-heads);}
  .main-service .txt .more {margin-top: 20px; font-size: var(--fs-bodys);}

  .venture .inner {background-position: left 24px top;}
  .venture li {font-size: var(--fs-bodys);}
  .venture li:first-child {padding-top: 160px; font-size: var(--fs-titm);}

  footer .top {flex-direction: column; align-items: baseline; gap: 16px;}
  footer .copy {padding: 16px 0 56px 0;}

  .tit-tab {margin-top: -58px;}
  .tab {display: flex; flex-direction: row; flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; width: 100%; border-left: none; border-right: none; border-bottom: 1px solid var(--op-b15); border-radius: 0;}
  .tab li {flex: 0 0 auto; float: none; min-width: auto; padding: 16px 8px; margin: 0 16px 0 0; font-size: var(--fs-bodym); border-right: none; border-bottom: none;}
  .tab li:first-child {margin-left: 16px;}

  .value {display: none;}
  .value-mb {display: block; font-size:}
  .value-mb .img img {max-width: 280px;}

  .is ul li {float: none; display: block; width: 100%; margin-right: 0; margin-bottom: 60px;}
  .is ul li .img {display: block; filter: none;}
  .is ul li .txt {text-align: center;}

  .tit-bar.s-1522 {background-size: 300px;}
  .tit-bar.cs {background-size: 225px;}

  .tit-bar .tit-txt li:first-child {font-size: var(--fs-headl);}
  .tit-bar .tit-txt {font-size: var(--fs-bodym);}

  .list .item {flex-direction: column; align-items: baseline; gap: 24px; margin-bottom: 48px;}
  .list .item .txt li {font-size: var(--fs-bodym);}
  .list .item .txt li:first-child {margin-bottom: 12px;}
  .list .item .img {max-width: none;}

  .pick-link {margin: 120px 0 100px 0; font-size: var(--fs-bodys);}
  .pick-link li:nth-child(2) {font-size: var(--fs-titm);}
  .pick-link li span {width: 100%;}
  .pick-link .down-link a {padding: 15px; margin-right: 8px; min-width: 145px;}

  .ing-txt li {font-size: var(--fs-bodym);}
  .ing-txt li:last-child {margin-top: 24px;}
  .ing-txt li span {width: 100%;}

  .cs-call {margin: 36px 0 60px 0;}
  .cs-txt {font-size: var(--fs-bodym);}
  .cs-txt li:last-child {margin-top: 24px;}
  .cs-txt span {width: 100%;}

  .float {right: 0px; bottom: 0px; width: 100%;}
  .float .fl-pc {display: none;}
  .float .fl-mb {display: flex;}
}

@media screen and (max-width:720px) {
  .is ul li .img {width: 170px; height: 170px;}
  .is ul li .img .out {width: 160px; height: 160px; top: 4px; left: 4px;}

  .client li {flex: 0 0 50%;}

  .map {height: 400px;}

  .pick-ing {max-width: 185px;}

  .tbl {font-size: var(--fs-bodys);}
  .tbl.compare li {flex-direction: column;}
  .tbl.compare .thead {display: none;}
  .tbl.compare li span:nth-child(1) {font-weight: var(--fw-eb);}

  .pop {height: 100%; padding: 0;}
  .pop .pop-biz {border-radius: 0;}
  .pop .pop-biz .biz-top .biz-menu span {width: 50%;}
  .pop .pop-biz .con-tell .tel-img  {width: 120px;}
  .pop .pop-biz .con-tell .tel-link {font-size: var(--fs-heads);}
}