/* 제품 서브 비주얼 이미지 */
#sv.sv02 #visual-box .bg{ background: url("/img/sub/subVisual02_1.png") no-repeat center center / cover; }
#sv.sv02 #visual-box .bg img{ display: none; }

#sv.sv02 #visual-box[data-eq="2"] .bg{ background: url("/img/sub/subVisual02_2.png") no-repeat center center / cover; }
#sv.sv02 #visual-box[data-eq="3"] .bg{ background: url("/img/sub/subVisual02_3.png") no-repeat center center / cover; }
#sv.sv02 #visual-box[data-eq="4"] .bg{ background: url("/img/sub/subVisual02_4.png") no-repeat center center / cover; }
#sv.sv02 #visual-box[data-eq="5"] .bg{ background: url("/img/sub/subVisual02_5.png") no-repeat center center / cover; }


/* common */
.subVisual{ padding: 180px 0 0; overflow-x: hidden; overflow-y: visible; }
.subVisual .txt-box{ position: relative; z-index: 2; display:flex; justify-content:space-between; align-items:flex-end; width: 100%; }
.subVisual .txt-box h2.title{ font-size:140px; font-family: var(--lex); color:#111; letter-spacing: -2.8px; transform: translate3d(-100px, 0, 0); opacity: 0; transition:all 1.2s }
.subVisual .txt-box .lnb{ display:flex; align-items:center; transform: translate3d(100px, 0, 0); opacity: 0; transition:all 1.2s; }
.subVisual .txt-box .lnb li{ position: relative; }
.subVisual .txt-box .lnb li > p{ width: 300px; height: 70px; padding: 0px 40px; display: flex; justify-content: space-between; align-items: center; border-radius: 100px; border: 1px solid #E5E5E5;
color:#111; font-weight: 500; letter-spacing: -0.38px; cursor:pointer; }
.subVisual .txt-box .lnb li ul{ position: absolute; transform:translateX(-50%); left: 50%; top: calc(100% + 10px); width: 100%; border-radius: 20px; border: 1px solid #E5E5E5; background: #FFF;
padding: 30px 40px; display:none; }
.subVisual .txt-box .lnb li ul li:not(:last-child){ margin-bottom: 15px; }
.subVisual .txt-box .lnb li ul li a{ color:#ccc; font-weight: 500; letter-spacing: -0.38px; transition:all 0.3s; }
.subVisual .txt-box .lnb li ul li a:hover{ color:var(--mainC); }
.subVisual .txt-box .lnb li.on p img{ transform:rotate(180deg); }
.subVisual .txt-box .lnb .path1{ margin: 0 10px;}
.subVisual .txt-box .lnb .home a{ display:block; width: 70px; height: 70px; border-radius:50%; background: var(--mainC); display:flex; justify-content:center; align-items:center; }
.subVisual.active .txt-box h2.title,
.subVisual.active .txt-box .lnb{ transform: translate3d(0, 0, 0); opacity: 1; }

/* subVisual - vh */
.subVisual.vh{ height: 100vh; display: flex; flex-direction: column; padding-bottom: 20px; }
.subVisual.vh > div{ flex: 1 0 auto; height: 100%; display: flex; flex-direction: column; }

#visual-box{ flex: 1 0 auto; opacity: 1; margin-top: 60px;}
#visual-box .bg{ width: 100%; height: 100%; border-radius:20px; opacity: 1; }
#visual-box .bg img{ height: 100%; object-fit: cover; transform:translate(-50%,-50%) scale(1.05); transition:all 3s;  }
.subVisual.active #visual-box .bg img{ transform:translate(-50%,-50%) scale(1); }


#subTitle{ text-align: center; color: #111; font-weight: 600; letter-spacing: -1.36px; margin-bottom: 120px; }

#subContents{ padding: 150px 0 200px;}

/* sub */
:root {
    --susH : 100vh;
}
#sustain .intro-box{ position: relative; height: calc( var(--susH)  * 3); background: #fff; margin-bottom: 150px;}
#sustain .intro-box .ctn-box{ position: relative; position: -webkit-sticky; position:sticky; top: 0; left: 0; width: 100%; height: 100vh; overflow: hidden;}
#sustain .intro-box .ctn-box .txt-box{ position: relative; width: 100%; height: 100%; display:flex; justify-content:center; align-items:center;  }
#sustain .intro-box .ctn-box .txt-box p{ color:#ccc; font-weight: bold; letter-spacing: -1.68px; }
#sustain .intro-box .ctn-box .txt-box .move{ position: relative; margin-left: 10px; min-width:145px; overflow: hidden; }
#sustain .intro-box .ctn-box .txt-box .move span{ display:block; color:var(--mainC); transition:all 0.7s; }
#sustain .intro-box .ctn-box .txt-box .move span.on{ position: absolute; top: 100%;}
#sustain .intro-box .img-box{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 50px 0; z-index: 5;  }
#sustain .intro-box .img-box .wrap-box{ position: relative; width: 100%; height: 100%; border-radius:20px; overflow: hidden; padding: 100px 50px; display:flex; align-items:flex-end; clip-path: inset(0 100% 0 0); transition:all 1s 0.8s; }
#sustain .intro-box .img-box .wrap-box:after{ content:''; display:block; position: absolute; top: 0; left: 0; opacity: 0.2; background: #000; width: 100%; height: 100%; clip-path: inset(0 0 0 100%); transition:all 0.8s 2s;}
#sustain .intro-box .img-box .wrap-box .fit-box{ width: 100%; height: 100%; z-index: -1; position: absolute; top: 0; left: 0; }
#sustain .intro-box .img-box .wrap-box .fit-box img{ transform:translate(-50%,-50%) scale(1.08); transition:all 3s 1s ; }
#sustain .intro-box .img-box .wrap-box div{ position: relative; z-index: 2;}
#sustain .intro-box .img-box .wrap-box div *{ transform: translateX(15%); opacity: 0; }
#sustain .intro-box .img-box .wrap-box .title{ color:#fff; font-weight: 600; line-height: 1.5; letter-spacing: -1.24px; margin-bottom: 80px; transition:all 1.2s 2.8s;}
#sustain .intro-box .img-box .wrap-box .txt{ color:#fff; font-weight: 300; line-height: 1.7; letter-spacing: -0.42px;  transition:all 1.2s 3s;}
#sustain .intro-box .img-box .wrap-box .txt em{ font-weight: bold; }
#sustain .intro-box.active .ctn-box .txt-box .move span.on{ top: 0; }
#sustain .intro-box.active .ctn-box .txt-box .move span.off{ transform:translateY(-100%); }
#sustain .intro-box.active .img-box .wrap-box,
#sustain .intro-box.active .img-box .wrap-box:after{ clip-path: inset(0 0 0 0); }
#sustain .intro-box.active .img-box .wrap-box .fit-box img{ transform:translate(-50%,-50%) scale(1);}
#sustain .intro-box.active .img-box .wrap-box div *{ transform: translateX(0); opacity: 1; }
#sustain .content{ border-bottom:1px solid #e5e5e5; }
#sustain .content > dl{ position: relative; border-top: 1px solid #E5E5E5; display:flex; align-items: flex-start;} 
#sustain .content > dl dt.title{ position: -webkit-sticky; position: sticky; top: 0; left: 0; width: 35.2%; color:#111; font-weight: 600; letter-spacing: -1.08px;}
#sustain .content > dl > *{ padding: 150px 50px;}
#sustain .content > dl > dd{ border-left: 1px solid #E5E5E5; width: 64.8%; ;}
#sustain .content > dl > dd .title{ color:#111; font-weight: 500; letter-spacing: -0.84px; }
#sustain .content > dl > dd .stit{ color:var(--mainC); font-weight: 500; letter-spacing: -0.46px; margin: 10px 0 60px;}
#sustain .content > dl > dd .txt{ color:#333; font-weight: 300; letter-spacing: -0.42px; line-height: 1.7; }
#sustain .content > dl > dd .btxt{ color:#222; font-weight: 300; line-height: 1.7; letter-spacing: -0.46px; }
#sustain .content > dl > dd .btxt em{ color:var(--mainC); font-weight: 600; }
#sustain .content > dl > dd figure{ width: 100%; height: 420px; border-radius:10px; margin: 60px 0;}
#sustain .content > dl > dd .item-box:not(:last-child){ margin-bottom: 120px; }
#sustain .content > dl > dd .txt-box { margin-top: 60px;}
#sustain .content > dl > dd .txt-box dl{ display:flex;}
#sustain .content > dl > dd .txt-box dl dt{ border-top: 2px solid #000; padding: 20px; text-align: center; color:#111; font-weight: 500; letter-spacing: -0.42px; 
width:220px; margin-right: 20px; flex-shrink:0; display:flex; justify-content:center; align-items: center;}
#sustain .content > dl > dd .txt-box dl dd{ padding: 60px 40px; border-top: 1px solid #000; width: 100%; min-height:290px; }
#sustain .content > dl > dd .txt-box dl dd:nth-child(2n){ min-height:250px; }
#sustain .content > dl > dd .txt-box dl dd ul{ margin-bottom: 40px; }
#sustain .content > dl > dd .txt-box dl dd ul li{ color:#333; font-weight: 300; letter-spacing: -0.38px; text-indent:-10px; margin-left: 10px;}
#sustain .content > dl > dd .txt-box dl dd ul li:not(:last-child){ margin-bottom: 15px; }
#sustain .content > dl > dd .txt-box dl dd .btn-box{ display:flex; align-items:center; }
#sustain .content > dl > dd .txt-box dl dd .btn-box a{ position: relative; width: 280px; height: 65px; padding: 0px 40px; display:flex; justify-content: center; align-items: center;border-radius: 10px; background: #EEE; letter-spacing: -0.34px; color:#aaa; font-weight: 500; overflow: hidden; transition:all 0.5s; }
#sustain .content > dl > dd .txt-box dl dd .btn-box a *{ position: relative; z-index: 5;}
#sustain .content > dl > dd .txt-box dl dd .btn-box a:before{ content:''; display:block; width: 100%; height: 100%; background: var(--mainC); position: absolute; top: 0; left: 0; z-index: 1;  opacity: 0; transition:all 0.5s; }
#sustain .content > dl > dd .txt-box dl dd .btn-box a:not(:last-child){ margin-right: 10px;}
#sustain .content > dl > dd .txt-box dl dd .btn-box a svg{ margin-left: 10px; width: auto; height: auto;}
#sustain .content > dl > dd .txt-box dl dd .btn-box a:hover{ color:#fff; }
#sustain .content > dl > dd .txt-box dl dd .btn-box a:hover:before{ opacity: 1; }
#sustain .content > dl > dd .txt-box dl dd .btn-box a:hover path{ stroke:#fff; }
#sustain .content > dl > dd .txt-box dl:last-child dt{ border-bottom: 2px solid #000; }
#sustain .content > dl > dd .txt-box dl:last-child dd{ border-bottom: 1px solid #000; }

#material .ctn-box{ display:flex; gap: 150px 120px; flex-wrap:wrap; }
#material .ctn-box .item-box{ width: calc((100% - 120px) / 2);}
#material .ctn-box .item-box figure{ width: 100%; height: 480px; transition:all 0.5s; margin-bottom: 40px;  }
#material .ctn-box .item-box figure img{ transform:translate(-50%,-50%) scale(1); transition:all 0.7s;  }
#material .ctn-box .item-box .txt-box{ padding: 0 20px; }
#material .ctn-box .item-box .txt-box > div{ display:flex; justify-content:space-between; align-items:center; }
#material .ctn-box .item-box .txt-box .left{ width: calc(100% - 50px); padding-right: 30px; transform: translateX(-20px); transition: all 0.5s; will-change: transform; }
#material .ctn-box .item-box .txt-box .right{ transform: translateX(20px); transition: all 0.5s; will-change: transform; }
#material .ctn-box .item-box .txt-box .title{ color:#111; font-weight: 600; letter-spacing: -0.84px; margin-bottom: 20px;}
#material .ctn-box .item-box .txt-box .txt{ color:#555; font-weight: 300; letter-spacing: -0.42px; }
#material .ctn-box .item-box a:hover figure{ border-radius: 80px; }
#material .ctn-box .item-box a:hover figure img{ transform:translate(-50%,-50%) scale(1.05);  }
#material .ctn-box .item-box a:hover .left,
#material .ctn-box .item-box a:hover .right{ transform: translateX(0); }
/* #material .ctn-box .item-box a:hover .txt-box{ padding: 0 20px;} */

.material .title-box{ margin-bottom: 120px; padding-bottom: 50px; border-bottom: 1px dashed #AAA; }
.material .title-box .title{ color: #111; font-family: var(--lex); font-weight: 500; letter-spacing: -0.96px; margin-bottom: 30px; } 
.material .title-box .txt{ color: #333; font-weight: 300; line-height: 1.5; letter-spacing: -0.42px; }
.material .ctn-box > *:not(:last-child){ margin-bottom: 120px; }
.material .ctn-box dl dt{ color: #111; font-weight: 600; letter-spacing: -0.52px; margin-bottom: 30px; }
.material .ctn-box dl dd{ display:flex; flex-wrap:wrap; gap:30px 0; }
.material .ctn-box .icon-box p{ display:flex; align-items:center; color: #111; font-weight: 500; letter-spacing: -0.38px; min-width:270px; }
.material .ctn-box .icon-box p:not(:last-child){ margin-right: 20px; }
.material .ctn-box .icon-box p img{ margin-right: 30px; }
.material .ctn-box .img-box dd{ display:flex; flex-wrap:wrap; gap:20px; }
.material .ctn-box .img-box .item-box{ width: calc((100% - 60px) / 4); }
.material .ctn-box .img-box .item-box .img{ position: relative; border-radius: 20px; background: #F8F8F8; height: 415px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align: center; }
.material .ctn-box .img-box .item-box .img p{ width: 100%; position: absolute; transform:translateX(-50%); bottom: 30px; left: 50%; color: #111; font-family: var(--lex); letter-spacing: -0.46px; }
.material .ctn-box .img-box .item-box .img p.type2{ font-family: var(--baseFont);}
.material .ctn-box .img-box .item-box > p{ color: #CCC; font-weight: 200; letter-spacing: -0.32px; margin-top: 20px; word-break:break-all; }
.material .ctn-box .table-box{ position: relative; }
.material .ctn-box .table-box .scroll-icon{ width: 100%; height: 100%; background: rgba(0,0,0,0.5); position: absolute; top: 0; left: 0; z-index: 5; border-radius:10px;  display:none; }
.material .ctn-box .table-box .scroll-icon span{ display:block; font-size:25px; color:#fff; font-weight: 300; text-align: center; margin-top: 20px;}
.material .ctn-box .table-box table{ text-align: center; }
.material .ctn-box .table-box table > *{ position: relative; }
.material .ctn-box .table-box table thead th{ color: #FFF; letter-spacing: -0.38px; font-weight: 400; }
.material .ctn-box .table-box table thead th:not(:last-child){ border-right: 2px solid #194E8F; }
.material .ctn-box .table-box table th{ background: var(--mainC); } 
.material .ctn-box .table-box table th:first-child{ border-radius: 10px 0 0 10px; }
.material .ctn-box .table-box table th:last-child{ border-radius: 0 10px 10px 0; }
.material .ctn-box .table-box table th p{ width: 100%; padding: 25px 0; display:flex; justify-content:center; align-items:center; }
.material .ctn-box .table-box table th div{ display:flex; padding: 0; border-top: 2px solid rgba(255, 255, 255, 0.10); }
.material .ctn-box .table-box table th div p:not(:last-child){ border-right: 2px solid rgba(255, 255, 255, 0.10); }
.material .ctn-box .table-box table th.bar{ background: #fff; height: 2px; }
.material .ctn-box .table-box table tr:first-child td:first-child{ border-radius:10px 0 0 10px; }
.material .ctn-box .table-box table tr:first-child td:last-child{ border-radius:0 10px 0 0; }
.material .ctn-box .table-box table tr:last-child td:last-child{ border-radius:0 0 10px 0; }
.material .ctn-box .table-box table tr td:last-child{ padding: 0; }
.material .ctn-box .table-box table td{ position: relative; color: #333; font-weight: 300; letter-spacing: -0.38px; border-right: 2px solid #FFF; border-bottom: 2px solid #FFF; background: #F8F8F8; padding: 20px 0;}
.material .ctn-box .table-box table td div{ display:flex; position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.material .ctn-box .table-box table td div p{ width: 100%; }
.material .ctn-box .table-box table td div p:not(:last-child){ border-right: 2px solid #FFF; }
.material .ctn-box .table-box table td div p a{ width: 100%; height: 100%; display:flex; justify-content:center; align-items:center; padding: 5px 0;}

#property .chk-box{ border-radius: 20px; background: #F8F8F8; padding: 60px; margin-bottom: 80px; }
#property .chk-box dl:first-child{ padding-bottom: 60px; border-bottom: 1px dashed #AAA; margin-bottom: 60px; }
#property .chk-box dl dt{ width: 180px; height: 55px; display: flex; justify-content: center; align-items: center; border-radius: 10px; background: #222; color: #FFF; font-weight: 600; letter-spacing: -0.42px; margin-bottom: 60px; }
#property .chk-box dl dd{ display:flex; align-items:center; flex-wrap:wrap; gap:20px 0; }
#property .chk-box dl dd .input-box:not(:last-child){ margin-right: 40px; }
#property .chk-box dl dd .input-box input{ display:none; }
#property .chk-box dl dd .input-box label{ display:flex; align-items:center; width: 165px; color: #333; font-weight: 300; letter-spacing: -0.38px; cursor:pointer; }
#property .chk-box dl dd .input-box label span{ width: 25px; height: 25px; border-radius: 5px; border: 2px solid #E5E5E5; background: #FFF; display:flex; justify-content:center; align-items:center;
margin-right: 15px; transition:all 0.3s; }
#property .chk-box dl dd .input-box label span img{ opacity: 0; transition:all 0.3s; }
#property .chk-box dl dd .input-box input:checked + label span{ border:2px solid var(--mainC); }
#property .chk-box dl dd .input-box input:checked + label span img{ opacity: 1; }

#about .txt-box{ text-align: center;	 }
#about .txt-box p:not(:last-child){ margin-bottom: 40px; }
#about .txt-box .title{ color: #111; font-weight: 300; letter-spacing: -0.84px; }
#about .txt-box .title em{ color:var(--mainC); font-weight: 600; }
#about .txt-box .txt{ color: #333; font-weight: 300; line-height: 1.7; letter-spacing: -0.42px; }
#about .img-box{ margin: 150px 0 240px; }
#about .icon-txt-box > .title{ color: #111; font-weight: 500; letter-spacing: -0.72px; text-align: center; margin-bottom: 80px; }
#about .icon-txt-box .ctn-box{ display:flex; flex-wrap:wrap; gap:20px; } 
#about .icon-txt-box .ctn-box .item-box{ display:flex; flex-direction:column; justify-content:center; align-items:center; text-align: center; width: calc((100% - 40px) / 3); min-height:320px; 
border-radius:20px; background: #F8F8F8; padding: 0 30px;}
#about .icon-txt-box .ctn-box figure.item-box{ background: var(--mainC); }
#about .icon-txt-box .ctn-box .item-box .title{ color: var(--mainC); font-family: var(--lex); font-weight: 400; letter-spacing: -0.46px; margin: 30px 0 10px; }
#about .icon-txt-box .ctn-box .item-box .txt{ color: #333; font-weight: 300; letter-spacing: -0.38px; }

#history > div{ position: relative; padding-top: 95px; }
#history .tab-wrap{ position: relative; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 6; pointer-events: none;}
#history .tab-wrap ul{ position: -webkit-sticky; position: sticky; top: 20px; left: 0; max-width: 680px; height: 65px; display:flex; justify-content: center; align-items: center;  margin: 0 auto; 
border-radius:50px; background: var(--mainC);  pointer-events: auto; }
#history .tab-wrap ul li:not(:last-child){ margin-right: 100px; }
#history .tab-wrap ul li a{ color: rgba(255,255,255,0.3); font-family: var(--lex); letter-spacing: -0.38px; transition:all 0.3s; }
#history .tab-wrap ul li.on a{ color:#fff; }
#history .ctn-box{ position: relative; border-top: 1px solid #E5E5E5; }
#history .ctn-box .bar-wrap{ position: relative; position: absolute; top: 0; left: calc(37.2% + 12px); height: 100%; z-index: 5; pointer-events:none; }
#history .ctn-box .bar-wrap .bar{ position: relative; position: -webkit-sticky; position: sticky; top: 0; left: 0; width: 3px; height: 165px; background: var(--mainC); }
#history .ctn-box .bar-wrap .bar span{ display:block; width: 15px; height: 15px; border-radius:50%; border:5px solid var(--mainC); position: absolute; top: 100%; left: 50%; transform:translateX(-50%); }
#history .ctn-box section{ position: relative; display:flex; padding: 0 50px; border-bottom: 1px solid #E5E5E5; }
#history .ctn-box section > *{ padding: 150px 0; }
#history .ctn-box section#year2000 .txt-box{ padding-bottom: 200px;}
#history .ctn-box section .year{ position: -webkit-sticky; position: sticky; top: 0; left: 0; width: 37.2%; height: 410px; color: #111; font-family: var(--lex); letter-spacing: -1.68px; flex-shrink:0; }
#history .ctn-box section .txt-box{ border-left:1px solid #E5E5E5; padding-left: 50px; }
#history .ctn-box section .txt-box .item-box:not(:last-child){ margin-bottom: 120px; }
#history .ctn-box section .txt-box .item-box p{ color: var(--mainC); font-family: var(--lex); letter-spacing: -0.64px; margin-bottom: 40px; }
#history .ctn-box section .txt-box .item-box ul li{ color: #333; font-weight: 300; letter-spacing: -0.42px; }
#history .ctn-box section .txt-box .item-box ul li:not(:last-child){ margin-bottom: 20px; }
#history .ctn-box section .txt-box .item-box ul li em{ color:var(--mainC); font-weight: 500; }

#global > div{ position: relative;}
#global .map{  border-radius:20px; overflow: hidden; }
#global .map .txt-box{ cursor:pointer; pointer-events: bounding-box; }
#global .map .txt-box .bak-circle{ animation: circle 1.5s infinite forwards; }
#global .map .circle-box .circle-b{ animation: circleB 8s infinite forwards;  }
#global .map .circle-box .circle-s{ animation: circleS 8s infinite forwards; }
#global .ctn-box{ position: relative; position: absolute; top: 0; left: 0; width: 100%; height: 100%; pointer-events:none; }
#global .ctn-box .item-box{ position: absolute; width: 360px; padding: 40px; border-radius: 20px; background: #FFF; opacity: 0; transition:all 0.5s; }
#global .ctn-box .item-box figure{ padding-bottom: 15px; border-bottom: 1px dashed #AAA; margin-bottom: 20px; }
#global .ctn-box .item-box .title{ display:flex; align-items:center; color: var(--mainC); font-weight: 600; letter-spacing: -0.38px; margin-bottom: 15px; }
#global .ctn-box .item-box .title img{ margin-right: 20px; flex-shrink:0; }
#global .ctn-box .item-box ul li{ display:flex; align-items:flex-start; color: #555; font-weight: 300; letter-spacing: -0.38px; }
#global .ctn-box .item-box ul li:not(:last-child){ margin-bottom: 15px; }
#global .ctn-box .item-box ul li img{ margin-right: 20px; margin-top: 6px; flex-shrink:0; }
#global .ctn-box .item-box.item01{ bottom: 77px; left: 14%; } 
#global .ctn-box .item-box.item02{ bottom: 160px; left: 18%; } 
#global .ctn-box .item-box.item03{ bottom: 20px; left: 41.5%; } 
#global .ctn-box .item-box.item04{ bottom: 90px; right: 26.5%; } 
#global .ctn-box .item-box.item05{ bottom: 75px; right: 21%; } 
#global .ctn-box .item-box.on{ opacity: 1; }

@keyframes circle {
	0%{ r: 5px; }
	50%{ r: 15px; }
	100%{ r: 10px; opacity: 0; }
}

@keyframes circleB {
	0%{ r: 5px; }
	50%{ r: 500px; }
	100%{ r: 500px; opacity: 0; }
}

@keyframes circleS {
	0%{ r: 5px; }
	50%{ r: 250px; }
	100%{ r: 250px; opacity: 0; }
}

#ceo .title{ color: var(--mainC); font-weight: 600; letter-spacing: -0.84px; margin-bottom: 60px; }
#ceo .txt-box{ display:flex; justify-content:space-between; }
#ceo .txt-box > div{ width: calc((100% - 80px) / 2);}
#ceo .txt-box p{ color: #111; font-weight: 300; line-height: 1.7; letter-spacing: -0.42px;}
#ceo .txt-box p:not(:last-child){ margin-bottom: 40px; }
#ceo .txt-box p.name{ color: #111; font-weight: 600; line-height: 1.3; letter-spacing: -0.46px; }

#cae h5.title{ display:flex; color: #111; font-weight: 600; letter-spacing: -0.52px; margin-bottom: 40px; }
#cae h5.title span{ font-family: var(--lex); font-weight: 500; margin-right: 20px; }
#cae .intro{ position: relative; width: 100%; height: 940px; overflow: hidden; display:flex; justify-content:center; align-items:center; text-align: center; }
#cae .intro .video-box{ position: relative; position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
#cae .intro .video-box:after{ content:''; display:block; position: absolute;	 top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.3); clip-path:inset(0 100% 0 0); transition:all 0.7s 1s; }
#cae .intro .video-box video{ position: absolute; transform:translate(-50%,-50%); top: 50%; left: 50%; min-width:100%; min-height:100%; object-fit:cover; z-index: -1; }
#cae .intro .video-box.aos-animate:after{ clip-path:inset(0 0 0 0)}
#cae .intro .txt-box .title{ color: #FFF; font-weight: 600; letter-spacing: -1.68px; margin-bottom: 80px; }
#cae .intro .txt-box .txt{ color: #FFF; font-weight: 600; letter-spacing: -0.88px; }
#cae .intro .txt-box .txt span{ display:block; }
#cae .intro .txt-box .txt span:not(:last-child){ margin-bottom: 10px; }
#cae .intro .scroll-move{ position: absolute; transform:translateX(-50%); bottom: 40px; left: 50%; }
#cae .present{ padding: 150px 0;}
#cae .present h5.title span{ color:var(--mainC); }
#cae .present .ctn-box{ display:flex; gap:40px; }
#cae .present .ctn-box .item-box{ width: calc((100% - 120px) / 4);}
#cae .present .ctn-box .item-box dt{ display: flex; align-items:center; justify-content:center; height: 85px; color: #FFF; font-weight: 600; letter-spacing: -0.46px; border-radius: 15px; background: var(--mainC);}
#cae .present .ctn-box .item-box figure{ position: relative; width: 350px; height: 350px; border-radius: 50%; border: 2px dashed #CCC; display:flex; justify-content:center; align-items:center; margin: 40px auto; }
#cae .present .ctn-box .item-box figure:before{ content:''; display:block; width: 1px; height: 40px; border-right:2px dashed #ccc; position: absolute; bottom: 100%; }
#cae .present .ctn-box .item-box figure:after{ content:''; display:block; width: 10px; height: 10px; border-radius:50%; background: var(--mainC); border: 2px solid #fff; 
position: absolute; bottom: calc(100% + 35px); transform:translateX(-50%); left: 50.2%; }
#cae .present .ctn-box .item-box:nth-child(2n) dt{ background: #222; }
#cae .present .ctn-box .item-box:nth-child(2n) figure:after{ background: #222;}
#cae .present .ctn-box .item-box ul{ display:flex; justify-content:center; flex-wrap:wrap; gap:10px; }
#cae .present .ctn-box .item-box ul li{ border-radius: 50px; background: #EEE; height: 45px; display:flex; justify-content:center; align-items:center; padding: 0 30px; }
#cae .scroll-wrap{ position: relative; }
#cae .scroll-wrap section{ position: relative; position: -webkit-sticky; position:sticky; top: 0; left: 0; width: 100%; height: 100vh; padding: 120px 0;}
#cae .scroll-wrap section:not(:first-child){ margin-top: 30vh;}
#cae .scroll-wrap section > div{ display:flex; justify-content:space-between; flex-direction:column; height: 100%; }
#cae .scroll-wrap section h5.title{ color:#fff; }
#cae .scroll-wrap section .fit-box{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1;}
#cae .scroll-wrap section .txt-box .txt{ color: #FFF; font-weight: 500; letter-spacing: -0.52px; }
#cae .scroll-wrap section .txt-box .title{ color: #FFF; font-weight: 600; letter-spacing: -1.08px; margin: 20px 0 80px;}
#cae .scroll-wrap section .txt-box .title span{ display:block; } 
#cae .scroll-wrap section .txt-box .title span:not(:last-child){ margin-bottom: 10px; }
#cae .scroll-wrap section .txt-box ul{ display:flex; flex-wrap:wrap; gap:20px; }
#cae .scroll-wrap section .txt-box ul li{ width: calc((100% - 60px) / 4); height: 75px; background: var(--mainC); backdrop-filter: blur(7.5px); display:flex; justify-content:center; align-items:center;
color: #FFF; font-weight: 600; letter-spacing: -0.42px; text-align: center; padding: 0 10px;}

.form section{ margin-bottom: 120px; }
.form section > .title{ display:flex; justify-content:space-between; align-items:flex-end; color: #111; font-weight: 600; letter-spacing: -0.64px; padding-bottom: 30px; 
border-bottom: 1px dashed #AAA; margin-bottom: 60px; }
.form section > .title span{ color: #333; font-weight: 300; letter-spacing: -0.34px; }
.form section > .title span em{ color: #FD0000; }
.form section .ctn-box{ display:flex; flex-wrap:wrap; gap:60px; }
.form section .ctn-box dl{ width: calc((100% - 60px) / 2); }
.form section .ctn-box dl.type2{ width: 100%; }
.form section .ctn-box dl dt{ color: #111; font-weight: 600; letter-spacing: -0.42px; margin-bottom: 10px; }
.form section .ctn-box dl dt em{ color: #FD0000; }
.form section .ctn-box dl dd{ width: 100%; }
.form section .ctn-box dl dd input[type="text"]{ border-radius: 5px; background: #F8F8F8; padding: 0 30px; height: 70px; color:#222; width: 100%; border: 2px solid #F8F8F8; 
transition:all 0.3s;}
.form section .ctn-box dl dd input[type="text"]::placeholder{ color: #AAA; font-weight: 300; letter-spacing: -0.34px;}
.form section .ctn-box dl dd input[type="text"]:focus{ border: 2px solid var(--mainC); background: #fff; }
.form section .ctn-box dl dd input[type="radio"],
.form section .ctn-box dl dd input[type="file"]{ display:none; }
.form section .ctn-box dl dd select{ width: 100%; height: 70px; background: #F8F8F8 url("/img/sub/icon_select.png") no-repeat center right 30px / auto; border: 2px solid #F8F8F8; border-radius: 5px; padding: 0 30px; font-weight: 300; color: #AAA; outline: none; transition:all 0.3s; }
.form section .ctn-box dl dd select:focus{ background: #FFF; border: 2px solid var(--mainC); }
.form section .ctn-box dl dd textarea{ border-radius: 5px; background: #F8F8F8; padding: 30px; height: 240px; color:#222; width: 100%; border: 2px solid #F8F8F8; resize:none; transition:all 0.3s;}
.form section .ctn-box dl dd textarea::placeholder{ color:#aaa; }
.form section .ctn-box dl dd textarea:focus{ border: 2px solid var(--mainC); background: #fff;  }
.form section .ctn-box dl dd.radio-box{ display:flex; align-items:center; flex-wrap:wrap; min-height:70px; gap:20px 50px; }
.form section .ctn-box dl dd.radio-box label{ display:flex; align-items:center; color: #111; font-weight: 300; letter-spacing: -0.34px;  cursor:pointer; }
.form section .ctn-box dl dd.radio-box label span{ position: relative; width: 20px; height: 20px; border-radius:50%; border:2px solid #E5E5E5; margin-right: 15px; 
display:flex; justify-content:center; align-items:center; transition:all 0.3s;}
.form section .ctn-box dl dd.radio-box label span:after{ content:''; display:block; width: 4px; height: 4px; background: var(--mainC); border-radius:50%; opacity: 0; transition:all 0.3s; }
.form section .ctn-box dl dd.radio-box input:checked + label span{ border:2px solid var(--mainC); }
.form section .ctn-box dl dd.radio-box input:checked + label span:after{ opacity: 1;}
.form section .ctn-box dl dd.file-box label{ display:flex; align-items:center; cursor:pointer; }
.form section .ctn-box dl dd.file-box label > *{ display:flex; align-items:center; height: 70px; }
.form section .ctn-box dl dd.file-box label .txt{ color: #AAA; font-weight: 300; letter-spacing: -0.34px; border-radius: 5px; background: #F8F8F8; padding: 0 30px;  width: 100%; }
.form section .ctn-box dl dd.file-box label .btn{ width: 240px; border-radius: 5px; background: #222; justify-content:center; margin-left: 10px; flex-shrink:0; color: #FFF; font-weight: 600; letter-spacing: -0.34px; }
.form section .ctn-box dl dd.file-box label.on .txt{ color:#222; }
.form section .ctn-box dl dd.captcha-box{ display:flex; align-items:center;  }
.form section .ctn-box dl dd.captcha-box figure{ display:inline-block; border-radius:5px; overflow: hidden; flex-shrink:0; }
.form section .ctn-box dl dd.captcha-box input{ margin: 0 10px; border: 1px solid #E5E5E5; background: #fff; }
.form section .ctn-box dl dd.captcha-box button{ display: flex; width: 70px; height: 70px; justify-content: center; align-items: center; border-radius: 5px; background: #222; flex-shrink:0; }
.form section .ctn-box .privacy dt{ display:flex; align-items:center; }
.form section .ctn-box .privacy dt input{ display:none; }
.form section .ctn-box .privacy dt label{ display:flex; align-items:center; cursor:pointer; }
.form section .ctn-box .privacy dt label span{ width: 20px; height: 20px; border:2px solid #E5E5E5; border-radius:50%; margin-right: 10px; display:flex; justify-content:center; align-items:center; transition:all 0.3s;  }
.form section .ctn-box .privacy dt label span:after{ content:''; display:block; width: 4px; height: 4px; background: var(--mainC); border-radius:50%; opacity: 0; transition:all 0.3s; }
.form section .ctn-box .privacy dt input[type="checkbox"]:checked + label span{ border:2px solid var(--mainC); }
.form section .ctn-box .privacy dt input[type="checkbox"]:checked + label span:after{ opacity: 1; }
.form section .ctn-box .privacy dd{ padding: 30px; background: #f8f8f8; border-radius:5px; }
.form section .ctn-box .privacy dd p:not(:last-child){ margin-bottom: 10px; }
.form section .ctn-box .privacy dd .title{ color: #333; font-weight: 500; letter-spacing: -0.34px;}
.form section .ctn-box .privacy dd .txt{ color:#555; font-weight: 300; }
.form section .ctn-box .privacy dd ul{ margin-top: 30px; color: #555; font-weight: 300; letter-spacing: -0.34px; }
.form section .ctn-box .privacy dd ul li:not(:last-child){ margin-bottom: 10px; }
.form section .ctn-box .privacy a{ display:inline-block; color: #333; font-weight: 500; letter-spacing: -0.34px; margin-top: 30px; text-decoration:underline; text-underline-offset : 3px;}

.board .ctn-box{ display:flex; flex-wrap:wrap; gap:120px 40px; }
.board .ctn-box .item-box{ width: calc((100% - 120px) / 4); } 
.board .ctn-box .item-box figure{ position: relative; width: 100%; height: 400px; overflow: hidden; transition:all 0.5s;  }
.board .ctn-box .item-box figure > img{ position: absolute; transform:translate(-50%,-50%); top: 50%; left: 50%; min-width:100%; min-height:100%; object-fit:cover; transition:all 0.5s; }
.board .ctn-box .item-box figure span{ position: absolute; transform:translate(-50%,-50%); top: 50%; left: 50%; width: 200px; height: 200px; background: var(--mainC); border-radius:50%; display:flex; justify-content:center; align-items:center; transition:all 0.7s; opacity: 0; }
.board .ctn-box .item-box .title{ color: #111; font-weight: 500; letter-spacing: -0.44px; margin-top: 30px; text-overflow: ellipsis;  overflow: hidden; display:-webkit-inline-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; }
.board .ctn-box .item-box .txt{ color: var(--mainC); font-family: var(--lex); font-weight: 500; letter-spacing: -0.34px; margin-top: 10px; }
.board .ctn-box .item-box:hover figure{ border-radius: 100px; }
.board .ctn-box .item-box:hover figure > img{ transform:translate(-50%,-50%) scale(1.1); } 
.board .ctn-box .item-box:hover figure span{ width: 60px; height: 60px; opacity: 1;}
#brochure.board .ctn-box .item-box figure span img{ filter: invert(1) brightness(100); }

#view .ctn-box .title-box{ padding-bottom: 60px; margin-bottom: 60px; border-bottom: 2px solid #E5E5E5;  }
#view .ctn-box .title-box .title{ color: #111; font-weight: 500; letter-spacing: -0.9px; margin-bottom: 30px; }
#view .ctn-box .title-box .txt{ color: var(--mainC);font-family: var(--lex); font-weight: 500; letter-spacing: -0.34px;}
#view .ctn-box .title-box .day{ display:inline-block; border-radius: 5px; background: var(--mainC); padding: 10px 30px; color: #FFF; font-family: var(--lex); font-weight: 500; letter-spacing: -0.32px; 
margin-bottom: 30px; }
#view .ctn-box .title-box ul{ display:flex; align-items:center; color: #333; font-weight: 300; letter-spacing: -0.36px; font-weight: 500;}
#view .ctn-box .title-box ul li{ display:flex; align-items:center; }
#view .ctn-box .title-box ul li:last-child{ font-family: var(--lex); font-weight: 300; }
#view .ctn-box .title-box ul li:last-child:before{ content:''; display:block; width: 1px; height: 15px; background: #000; margin: 0 15px; }
#view .ctn-box .file-box{ margin: 60px 0; }
#view .ctn-box .file-box p:not(:last-child){ margin-bottom: 25px; }
#view .ctn-box .file-box p a{ display:inline-flex; align-items:center; color: #555; font-weight: 300; letter-spacing: -0.34px; }
#view .ctn-box .file-box p a img{ margin-right: 20px;}
#view .ctn-box .page-box{ display:flex; }
#view .ctn-box .page-box div{ width: 50%; border-top: 1px solid #E5E5E5; border-bottom: 1px solid #E5E5E5; }
#view .ctn-box .page-box div a{ display:flex; align-items:center; gap:95px; color: #111; font-weight: 300; letter-spacing: -0.42px; padding: 40px; }
#view .ctn-box .page-box div:last-child a{ justify-content:flex-end; }
#view .ctn-box .page-box .stxt{ color: #CCC; font-family: var(--lex); font-weight: 500; display:flex; align-items:center; gap:30px; transition:all 0.5s; }
#view .ctn-box .page-box .stxt i{ color:#000; }
#view .ctn-box .page-box div:hover .stxt{ color:var(--mainC); transform:translatex(-20px); }
#view .ctn-box .page-box div.next:hover .stxt{ transform:translatex(20px); }

#view.form .ctn-box .title-box{ margin-bottom: 30px; }
#view.form section > .title{ margin-bottom: 0; border:none;  justify-content: flex-end; }
#view.form .ctn-box .file-box{ margin: 0; display:flex; align-items:center; }
#view.form .ctn-box .file-box label{ width: 100%; }
#view.form .ctn-box .file-box a{ display:flex; justify-content:center; align-items:center; width: 240px; height: 70px; border-radius: 5px; background: var(--mainC); margin-left: 10px;  color: #FFF; font-weight: 600;  letter-spacing: -0.34px; flex-shrink:0; }

#brochure .ctn-box .item-box figure{ height: 500px; }

#talent .intro{ margin-bottom: 150px; }
#talent .intro .circle-box{ display:flex; justify-content:center; align-items:center; margin-bottom: 170px; }
#talent .intro .circle-box .item-box{ position: relative; width: 340px; height: 340px; border-radius:50%; text-align: center; display:flex; flex-direction:column; justify-content:center; align-items:center; background: #fff; }
#talent .intro .circle-box .item-box:not(.center):after{ width: calc(100% - 4px); height: calc(100% - 4px) ; aspect-ratio: 1; content: ""; position: absolute; top: 0; left:0; padding: 2px; border-radius: 50%; background: linear-gradient( 140deg, rgba(0, 59, 131, 1), rgba(0, 59, 131, 0), rgba(0, 59, 131, 0), rgba(0, 59, 131, 1)); -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); mask: linear-gradient(#fff 0 0) content-box,  linear-gradient(#fff 0 0); -webkit-mask-composite: xor; mask-composite: exclude; z-index: 5;}
#talent .intro .circle-box .item-box:before{ content:''; display:block; position: absolute; transform:translate(-50%,-50%); top: 50%; left: 50%; width: calc(100% + 100px); height: calc(100% + 100px);
background: rgba(0, 59, 131, 0.03); border-radius:50%; z-index: -1;}
#talent .intro .circle-box .item-box .title{ color: var(--mainC); font-family: var(--lex); font-weight: 500; letter-spacing: -0.72px; margin-bottom: 30px; }
#talent .intro .circle-box .item-box .txt{ color: #333; font-weight: 300; letter-spacing: -0.42px; }
#talent .intro .circle-box .item-box.center{ background: linear-gradient(135deg, #003B83 0%, #04ABB7 100%); }
#talent .intro .circle-box .item-box.center .title,
#talent .intro .circle-box .item-box.center .txt{ color:#fff; } 
#talent .intro .txt-box{ text-align: center; }
#talent .intro .txt-box .title{ color: #111; font-weight: 300; letter-spacing: -0.84px; margin-bottom: 15px; }
#talent .intro .txt-box .title em{ color:var(--mainC); font-weight: 600; }
#talent .intro .txt-box .txt{ color: #333; font-weight: 300; letter-spacing: -0.56px; }
#talent .content > div{ border-top: 1px solid #E5E5E5; }
#talent .content .item-box{ display:flex; align-items:center; border-bottom: 1px solid #E5E5E5; }
#talent .content .item-box > *{ padding: 50px; }
#talent .content .item-box .txt-box{ width: 100%; }
#talent .content .item-box .txt-box .stxt{ color: var(--mainC); font-family: var(--lex); font-weight: 500; letter-spacing: -0.46px; }
#talent .content .item-box .txt-box .title{ margin: 40px 0; color: #111; font-weight: 300; line-height: 1.5; letter-spacing: -0.84px; }
#talent .content .item-box .txt-box .txt{ color: #333; font-weight: 300; line-height: 1.7; letter-spacing: -0.42px; }
#talent .content .item-box figure{ padding: 150px 50px; flex-shrink:0; border-left: 1px solid #E5E5E5; }

#personnel .title-box .txt{ color: #111; font-weight: 300; letter-spacing: -0.64px; }
#personnel .title-box .title{ color: #111; font-weight: 200; line-height: 1.5; letter-spacing: -0.84px; }
#personnel .title-box .title em{ color:var(--mainC); font-weight: 600; }
#personnel .ctn-box{ display:flex; flex-wrap:wrap; gap:50px; }
#personnel .ctn-box .item-box{ position: relative; width: calc((100% - 100px) / 3); height: 620px; border-radius: 10px; overflow: hidden; }
#personnel .ctn-box .item-box figure{ position: relative; }
#personnel .ctn-box .item-box figure img{ transition:all 0.7s; }
#personnel .ctn-box .item-box figure span{ position: absolute; bottom: 40px; left: 40px; color: #FFF; font-weight: 600; letter-spacing: -0.84px;}
#personnel .ctn-box .item-box .txt-box{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: var(--mainC); display:flex; flex-direction:column; justify-content:center; align-items:center; text-align: center; padding: 40px; opacity: 0; transition:all 0.5s; }
#personnel .ctn-box .item-box .txt-box dt{ color: #FFF; font-weight: 600; letter-spacing: -0.84px; margin-bottom: 40px; }
#personnel .ctn-box .item-box .txt-box dd{ color: #FFF; font-weight: 300; line-height: 1.5; letter-spacing: -0.46px; }
#personnel .ctn-box .item-box:hover .txt-box{ opacity: 1; }
#personnel .ctn-box .item-box:hover figure img{ transform:translate(-50%,-50%) scale(1.05); }

#welfare .ctn-box{ display:flex; flex-wrap:wrap; gap:20px; }
#welfare .ctn-box .item-box{ width: calc((100% - 60px) / 4); min-height:340px; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align: center; border-radius: 20px;
background: #F8F8F8; }
#welfare .ctn-box .item-box figure{ width: 150px; height: 150px; border-radius:50%; background: #fff; display:flex; justify-content:center; align-items:center; margin-bottom: 30px; }
#welfare .ctn-box .item-box p{ color: #111; font-weight: 500; line-height: 1.5; letter-spacing: -0.42px; } 

#recruit .intro .title{ color: #111; font-weight: 300; letter-spacing: -0.84px; text-align: center; margin-bottom: 60px; }
#recruit .intro .title em{ color:var(--mainC); font-weight: 600; }
#recruit .intro .ctn-box{ display:flex; gap:20px; }
#recruit .intro .ctn-box .item-box{ position: relative; width: 100%; text-align: center; min-height:240px; display:flex; flex-direction:column; justify-content:center; align-items:center; border-radius: 10px; background: rgba(0, 59, 131, 0.03);}
#recruit .intro .ctn-box .item-box .arrow{ position: absolute; transform:translateY(-50%); top: 50%; left: calc(100% - 20px); width: 60px; height: 60px; border-radius:50%; background: #fff; display:flex; justify-content:center; align-items:center; z-index: 10;}
#recruit .intro .ctn-box .item-box p{ color: #111; font-weight: 500; letter-spacing: -0.42px; text-align: center; margin-top: 35px; }
#recruit .intro .ctn-box .item-box.item02{ background: rgba(0, 59, 131, 0.07); }
#recruit .intro .ctn-box .item-box.item03{ background: rgba(0, 59, 131, 0.12); }
#recruit .intro .ctn-box .item-box.item04{ background: rgba(0, 59, 131, 0.20); }
#recruit .intro .ctn-box .item-box.item05{ background: linear-gradient(225deg, #003B83 0%, #04ABB7 100%); }
#recruit .intro .ctn-box .item-box.item05 p{ color:#fff; }
#recruit .content > div{ border-top: 1px dashed #AAA; padding-top: 120px; }
#recruit .content > div > .title{ color: #111; font-weight: 600; letter-spacing: -0.84px; text-align: center; margin-bottom: 50px; }
#recruit .content .ctn-box{ display:flex; flex-wrap:wrap; gap:50px; }
#recruit .content .ctn-box .item-box{ width: calc((100% - 100px) / 3); min-height:330px; }
#recruit .content .ctn-box .item-box a{ display:flex; flex-direction:column; justify-content:space-between; align-items:flex-start; width: 100%; height: 100%; border-radius: 10px; background: #F8F8F8; padding: 60px; border:2px solid #f8f8f8; transition:all 0.5s;  }
#recruit .content .ctn-box .item-box .day{ border-radius: 5px; background: var(--mainC); padding: 10px 30px; color: #FFF; font-family: var(--lex); font-weight: 500; letter-spacing: -0.32px; }
#recruit .content .ctn-box .item-box .title { text-overflow: ellipsis;  overflow: hidden; display:-webkit-inline-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
#recruit .content .ctn-box .item-box .title span{ display:block; color: #111; font-weight: 500; line-height: 1.5; letter-spacing: -0.44px; }
#recruit .content .ctn-box .item-box ul{ display:flex; align-items:center; color: #333; font-weight: 300; letter-spacing: -0.36px; font-weight: 500;}
#recruit .content .ctn-box .item-box ul li{ display:flex; align-items:center; }
#recruit .content .ctn-box .item-box ul li:last-child{ font-family: var(--lex); font-weight: 300; }
#recruit .content .ctn-box .item-box ul li:last-child:before{ content:''; display:block; width: 1px; height: 15px; background: #000; margin: 0 15px; }
#recruit .content .ctn-box .item-box:hover a{ border:2px solid var(--mainC); }

#she > div{ border-top: 1px solid #E5E5E5; }
#she section{ position: relative; display:flex; align-items: flex-start; padding: 0 50px; border-bottom: 1px solid #E5E5E5; }
#she section > *{ padding: 150px 0; }
#she section > .title{ position: -webkit-sticky; position:sticky; top: 0; left: 0; width: 37.2%; flex-shrink:0; color: #111; font-weight: 600; letter-spacing: -1.08px;  } 
#she section .ctn-box{ padding-left: 50px; border-left:1px solid #e5e5e5; }
#she section .ctn-box > *:not(:first-child,dl){ margin-top: 50px; }
#she section .ctn-box h5.title{ color: #111; font-weight: 500; etter-spacing: -0.84px; }
#she section .ctn-box .stxt{ color: var(--mainC); font-family: var(--lex); font-weight: 500; letter-spacing: -0.46px; margin-top: 10px; }
#she section .ctn-box .txt{ color: #333; font-weight: 300; line-height: 1.7; letter-spacing: -0.42px; }
#she section .ctn-box .txt b{ color:#111; font-weight: 500; }
#she section .ctn-box .box{ border-radius: 20px; background: #F8F8F8; padding: 80px; color: #555; font-weight: 300; line-height: 1.5; letter-spacing: -0.38px; }
#she section .ctn-box .box ul li{ display:flex; align-items:flex-start; }
#she section .ctn-box .box ul li:not(:last-child){ margin-bottom: 20px; }
#she section .ctn-box .box ul li:before{ content:''; display:block; width: 5px; height: 5px; border-radius:50%; margin: 12px 10px 0 0; background: var(--mainC); flex-shrink:0; }
#she section .ctn-box dl{ display:flex; }
#she section .ctn-box dl:not(:first-child) dt{ margin-top: -2px; }
#she section .ctn-box dl:not(:first-child) dd{ margin-top: -1px;}
#she section .ctn-box dl dt{ width: 220px; flex-shrink:0; border-top: 2px solid #000; border-bottom: 2px solid #000; color: #111; text-align: center; font-weight: 500; letter-spacing: -0.42px;
 margin-right: 20px; display:flex; justify-content:center; align-items:center; }
#she section .ctn-box dl dd{ border-top: 1px solid #000; border-bottom: 1px solid #000; padding: 60px 40px; color: #333; font-weight: 300; line-height: 1.5; letter-spacing: -0.38px; }

#ethics > div{ position: relative; }
#ethics .tab-wrap{ position: relative; position: absolute; top: 0; left: 0; width: 100%; height: 100%; margin: 0 auto; text-align: center; pointer-events:none; }
#ethics .tab-wrap .tab-box{ position: -webkit-sticky; position:sticky; top: 120px; left: 0; display:inline-flex; justify-content:center; align-items:center; max-width:1200px; width: 100%;
background: var(--mainC); height: 65px; border-radius:50px; pointer-events:auto; }
#ethics .tab-wrap .tab-box li:not(:last-child){ margin-right: 100px; }
#ethics .tab-wrap .tab-box li a{ color: rgba(255,255,255,0.3); font-weight: 500; letter-spacing: -0.38px; transition:all 0.3s;  }
#ethics .tab-wrap .tab-box li:hover a,
#ethics .tab-wrap .tab-box li.on a{ color:#fff; }
#ethics .ctn-box section:first-child{ padding-top: 90px; }
#ethics .ctn-box section{ padding-top: 150px; }
#ethics .ctn-box section .txt-box{ display:flex; margin-top: 80px; }
#ethics .ctn-box section .txt-box p{ width: 37.2%; flex-shrink:0; color: #111; font-weight: 600; letter-spacing: -1.08px; }
#ethics .ctn-box section .txt-box ul { margin-top: 3px; padding-right: 30px; }
#ethics .ctn-box section .txt-box ul li{ display:flex; align-items:flex-start; color: #333; font-weight: 300; line-height: 1.5; letter-spacing: -0.38px; }
#ethics .ctn-box section .txt-box ul li:not(:last-child){ margin-bottom: 15px; }
#ethics .ctn-box section .txt-box ul li span{ width: 35px; height: 35px; flex-shrink: 0; border-radius: 5px; background: var(--mainC); display:flex; justify-content:center; align-items:center; 
color: #FFF; font-family: var(--lex); font-weight: 500; letter-spacing: -0.34px; margin-right: 15px; margin-top: -3px; }

#social .txt-box{ text-align: center; }
#social .txt-box .title{ color: #111; font-weight: 300; line-height: 1.5; letter-spacing: -0.96px; }
#social .txt-box .title em{ color:var(--mainC); font-weight: 600; }
#social .txt-box span{ display:block; width: 1px; height: 80px; background: #000; margin: 60px auto;}
#social .txt-box .txt{ color: #111; font-weight: 300; line-height: 1.5; letter-spacing: -0.42px; }
#social .img-box{ position: relative; width: 100%; border-radius: 20px; overflow: hidden; }
#social .img-box figure{ width: 100%; height: 100%; height: 780px; }
#social .img-box dl{ position: absolute; bottom: -100%; left: 0; width: 100%; z-index: 2; padding: 50px 60px; background: rgba(0,0,0,0.8); transition: all 1.5s; }
#social .img-box dl dt{ color: #FFF; font-weight: 600; letter-spacing: -0.84px; margin-bottom: 20px; }
#social .img-box dl dd{ color: #FFF; font-weight: 300; letter-spacing: -0.42px; }
#social .img-box.aos-animate dl{ bottom: 0; }

#online .intro .w1720{ border-radius: 20px; background: #F8F8F8; padding: 40px; display:flex; align-items:flex-end; }
#online .intro .w1720 > figure{ margin-right: 80px; }
#online .intro .txt-box .title{ color: var(--mainC); font-weight: 600; letter-spacing: -0.96px; margin-bottom: 30px; }
#online .intro .txt-box .txt{ color: #111; font-weight: 300; line-height: 1.5; letter-spacing: -0.42px; margin-bottom: 125px; }
#online .intro .txt-box .icon-box{ display:flex; gap:20px; }
#online .intro .txt-box .icon-box div{ width: 240px; min-height:240px; border-radius: 20px; background: #FFF; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align: center; }
#online .intro .txt-box .icon-box .txt01{ color: var(--mainC); font-family: var(--lex); font-weight: 600; letter-spacing: -0.42px; margin: 30px 0 10px; }
#online .intro .txt-box .icon-box .txt02{ color: #333; font-family: var(--lex); font-weight: 300; letter-spacing: -0.38px; }
#online .intro .txt-box .icon-box div:last-child .txt02{ font-family:var(--baseFont); }
#online .content{ margin-top: 150px; border-top: 1px dashed #AAA; padding-top: 150px; }
#online .content > div > *:not(:last-child){ margin-bottom: 80px; }
#online .content .title-box .title{ color: #111; font-weight: 600; letter-spacing: -0.64px; margin-bottom: 40px; }
#online .content .title-box .txt{ padding: 60px; border-radius: 20px; background: #F8F8F8; color: #333; font-weight: 300; line-height: 1.7; letter-spacing: -0.38px; }
#online .content dl dt{ color: #111; font-weight: 500; letter-spacing: -0.56px; margin-bottom: 20px; }
#online .content dl dd{ color: #555; font-weight: 300; letter-spacing: -0.34px; }
#online .content dl dd ul{ margin-top: 20px; }
#online .content dl dd ul li{ text-indent:-10px; margin-left: 10px; }
#online .content dl dd ul li:not(:last-child){ margin-bottom: 10px; }
#online .content dl dd ul li em{ font-weight: 600; }
#online .content dl dd .title{ margin:20px 0 -10px; color: #333; font-weight: 500; letter-spacing: -0.38px; }

.application .tab-box{ display:flex; align-items:center; justify-content:center; max-width:680px; width: 100%; height: 65px; margin: 0 auto 30px; background: var(--mainC); border-radius:50px; }
.application .tab-box li:not(:last-child){ margin-right: 100px; }
.application .tab-box li a{ color: rgba(255,255,255,0.3); font-weight: 500; letter-spacing: -0.38px; transition:all 0.5s; }
.application .tab-box li:hover a,
.application .tab-box li.on a{ color:#fff; }
.application .content{ position: relative; }
.application .content .off{ position: absolute; top: 0; left: 0; z-index: -1; opacity: 0;  }
.application .content .bg { background: url("/img/sub/application_bg.jpg") no-repeat center center / cover; border-radius: 20px; overflow: hidden; }
.application .content .bg .circle-box{ cursor:pointer; position: relative; transform-box: fill-box; transform-origin: center; }
.application .content .bg .circle-box .circle01{ pointer-events:none; }
.application .content .bg .circle-box .circle02{ transform-origin: center center; }
.application .content .bg .circle-box:hover,
.application .content .bg .circle-box.on{ animation: mercury-group 0.7s forwards; }
.application .content .bg .circle-box:hover .circle01,
.application .content .bg .circle-box.on .circle01{ animation: app-circle 3s 0.7s infinite forwards;}
.application .content .bg .circle-box:hover .circle02,
.application .content .bg .circle-box.on .circle02{  r: 19px; fill: #fff; }
.application .content .bg .circle-box:hover path,
.application .content .bg .circle-box.on path{ fill:var(--mainC); opacity: 1; }
.application .content .ctn-box#pc{ position: relative; position: absolute; top: 0; left: 0; width: 100%; height: 100%; pointer-events:none; }
.application .content .ctn-box#pc figure{ position: absolute; top: 0; left: 0; opacity: 0; transition:all 0.7s; }
.application .content .ctn-box#pc figure.on{ opacity: 1; }

.application .content .ctn-box#mobile{ position: relative; margin-top: 30px; display:none; }
.application .content .ctn-box#mobile .item-box{ position: relative; position: absolute; top: 0; left: 0; opacity: 0; transition:all 0.7s; pointer-events:none; width: 100%; }
.application .content .ctn-box#mobile .item-box a{ display:block; width: 100%; text-align: center; padding: 40px 20px 20px; border-radius:20px; box-shadow:0 0 10px rgba(0,0,0,0.2); }
.application .content .ctn-box#mobile .item-box .title{ color: var(--mainC); font-family: var(--lex); letter-spacing: -0.34px; margin-top: 20px; }
.application .content .ctn-box#mobile .item-box .txt{ color:#aaa; font-weight: 300; letter-spacing: -0.34px; margin-top: 20px; }
.application .content .ctn-box#mobile .item-box.on{ position: relative; opacity: 1; pointer-events:auto; }
.application .content .ctn-box#mobile .arrow{ width: 35px; height: 35px; background: var(--mainC); border-radius:50%; display:flex; justify-content:center; align-items:center; position: absolute; top: 20px; right: 20px;}

@keyframes app-circle {
	0%{ r: 14px; opacity: 0.3;}
	50%{ r: 100px; }
	100%{ r: 100px; opacity: 0; }
}

@keyframes mercury-group {
	0% { transform: rotateZ(0deg); }
	100% { transform: rotateZ(-90deg); }
}

.appView section:not(:last-child){ margin-bottom: 120px; }
.appView section h6.title{ color: #111;font-weight: 600; letter-spacing: -0.84px; display:flex; justify-content:space-between; align-items:flex-end; margin-bottom: 30px;}
.appView section h6.title a{ color: var(--mainC); font-family: var(--lex); font-weight: 400; letter-spacing: -0.38px; }
.appView .info{ display:flex; }
.appView .info .img-box{ margin-right: 80px; width: 55.5%; flex-shrink:0; }
.appView .info .img-box .img{ background: url("/img/sub/application_view_bg.jpg") no-repeat center center / cover; border-radius: 20px; }
.appView .info .img-box .circle-box .box02{ opacity: 0; }
.appView .info .img-box .circle-box .circle01{ fill:var(--mainC); animation: app-circle 3s 0.7s infinite forwards; pointer-events:none; }
.appView .info .img-box .circle-box.on .box01{ opacity: 0; }
.appView .info .img-box .circle-box.on .box02{ opacity: 1; }
.appView .info .txt-box{ width: 44.5%; display:flex; flex-direction:column; justify-content:space-between; }
.appView .info .txt-box .title{ color: var(--mainC); font-family: var(--lex); font-weight: 500; letter-spacing: -0.84px; }
.appView .info .txt-box div > figure{ border-radius: 20px; border: 2px solid #E5E5E5; padding: 30px; height:280px; display:flex; justify-content:center; align-items:center; margin: 20px 0 40px; }
.appView .info .txt-box p{ color: #333; font-weight: 300; line-height: 1.5; letter-spacing: -0.38px;}
.appView .info .txt-box dl { margin-top: 30px; }
.appView .info .txt-box dl dt{ color: var(--mainC); font-weight: 600; letter-spacing: -0.36px; margin-bottom: 10px; }
.appView .info .txt-box dl dd{ color: #CCC; font-weight: 300; letter-spacing: -0.32px; }
.appView .info .txt-box .ctn-box{ display:flex; flex-wrap:wrap; gap: 15px; margin-top: 40px; text-align: center; }
.appView .info .txt-box .ctn-box .item-box{ position: relative; width: calc((100% - 60px) / 5); height: 125px; border-radius: 10px; background: #F8F8F8; display:flex; flex-direction:column; justify-content: flex-end; align-items:center; padding: 10px; border: 2px solid  #F8F8F8; }
.appView .info .txt-box .ctn-box .item-box > *{ transition:all 0.5s; }
.appView .info .txt-box .ctn-box .item-box p{ color: #CCC; }
.appView .info .txt-box .ctn-box .item-box .num{ position: absolute; top: 10px; left: 10px; font-family: var(--lex); font-weight: 500; letter-spacing: -0.32px; }
.appView .info .txt-box .ctn-box .item-box .title{ font-weight: 500; letter-spacing: -0.32px; }
.appView .info .txt-box .ctn-box .item-box.on{ border: 2px solid  var(--mainC); background: #fff; }
.appView .info .txt-box .ctn-box .item-box.on p,
.appView .info .txt-box .ctn-box .item-box:hover p{ color:var(--mainC); }
.appView .introduction > div{ display:flex; }
.appView .introduction dl{ width: 100%; }
.appView .introduction dl:not(:last-child){ width: 400px; flex-shrink:0; }
.appView .introduction dl dt{ background: var(--mainC); margin-bottom: 2px;  height: 75px; display:flex; justify-content:center; align-items:center; color: #FFF; font-weight: 500; letter-spacing: -0.38px; width: 100%; }
.appView .introduction dl > *{ display:flex; justify-content:center; align-items:center; }
.appView .introduction dl:first-child > *{ border-radius:10px 0 0 10px; }
.appView .introduction dl:last-child > *{ border-radius: 0 10px 10px 0; }
.appView .introduction dl dt{ border: 2px solid rgba(255, 255, 255, 0.10); }
.appView .introduction dl dd{ height: calc(100% - 75px); padding: 20px; color: #333; font-weight: 300; letter-spacing: -0.38px; text-align: center; border: 2px solid #E5E5E5;  }
.appView .introduction dl:not(:last-child) > *{ border-right:none; }
.appView .introduction .icon-box{ display:flex; flex-wrap:wrap; gap:20px 0; }
.appView .introduction .icon-box div{ width: 20%; }
.appView .introduction .icon-box span{ display:block; letter-spacing: -0.34px; margin-top: 20px; }
.appView .app-material .ctn-box{ display:flex; gap:20px; flex-wrap:wrap; }
.appView .app-material .ctn-box .item-box{ position: relative; width: calc((100% - 60px) / 4);}	 
.appView .app-material .ctn-box .item-box a{ text-align: center; display:block; }
.appView .app-material .ctn-box .item-box figure{  width: 100%;  height: 300px; border-radius: 20px;  }
.appView .app-material .ctn-box .item-box p{ color: #111; font-family: var(--lex); letter-spacing: -0.46px; margin-top: 30px; }

/* Application 상세 수정 - 20250708 */
.appView .info .txt-box .tit{ font-family: var(--lex); font-size: 19px; font-weight: 500; color: var(--mainC); letter-spacing: -0.84px; position: relative; }
.appView .info .txt-box .tit span{ display: inline-block; background: #FFF; padding-right: 10px; }
.appView .info .txt-box .tit::before{ content: ""; max-width: 100%; width: 250px; height: 1px; background: var(--mainC); vertical-align: middle; position: absolute; top: 0.7em; left: 0; z-index: -1; }
.appView .info .txt-box .flex{ display: flex; }
.appView .info .txt-box .flex > div{ width: 50%; }
.appView .info .txt-box .flex .left{ display: flex; flex-direction: column; padding-top: 10px; padding-right: 50px; }
.appView .info .txt-box .flex .left div{ flex: 1 0 auto; display: flex; flex-direction: column; justify-content: center; padding: 20px 0; }
.appView .info .txt-box .flex .left p{ font-size: 26px; font-weight: 700; color: #111; }
.appView .info .txt-box .flex  figure{ margin: 0; }

#non-auto .tab-box li:last-child a{ color:#fff; }
#non-auto .info .img-box{ border-radius: 20px; background: #F8F8F8; padding: 20px; }
#non-auto .info .img-box .link-box { position: relative; height: 80px; border-radius: 20px;  overflow: hidden; background: #fff; margin-top: 20px;  }
#non-auto .info .img-box .link-box .move { position: absolute; display: block; height: 80px; background: var(--mainC); transition: left 0.5s ease; border-radius:20px; }
#non-auto .info .img-box .link-box ul{ display:flex; }
#non-auto .info .img-box .link-box ul {  position: relative; z-index: 5; display: flex; height: 100%; }
#non-auto .info .img-box .link-box ul li { width: 100%; height: 100%; }
#non-auto .info .img-box .link-box ul li a { display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; background: transparent; border-radius: 20px; color: #ccc; letter-spacing: -0.46px; font-weight: 500;  transition: all 0.3s; }
#non-auto .info .img-box .link-box ul li.on a, 
#non-auto .info .img-box .link-box ul li:hover a { color: #fff; }
#non-auto .info .txt-box .title{ font-family: var(--baseFont); }


/* 팝업 */
.popup{ width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); position: fixed; top: 0; left: 0; z-index: 100000; display: none; }
.popup .blank{ width: 100%; height: 100%; }
.popup .inner{ max-width: 90%; background: #FFF; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }


/* 팝업 - 파일 다운로드 */
.popup.download .inner{ width: 860px; border-radius: 20px; }
.popup.download section{ padding: 50px; margin-bottom: 0; }
.popup.download .form section > .title{ padding-bottom: 20px; margin-bottom: 40px; }

.popup.download .form section .ctn-box{ max-height: calc(100dvh - 330px); overflow-x: clip; overflow-y: auto; -ms-overflow-style: none; scrollbar-width: none; gap: 20px; }
.popup.download .form section .ctn-box dl{ width: calc((100% - 20px) / 2); margin: 0; }
.popup.download .form section .ctn-box dl dt{ font-weight: 500; }
.popup.download .form section .ctn-box dl dt span{ font-family: var(--lex); }
.popup.download .form section .ctn-box dl dd input[type="text"]{ height: 55px; }
.popup.download .form section .ctn-box dl dd select{ height: 55px; }

.popup.download .form section .ctn-box .privacy{ width: 100%; }
.popup.download .form section .ctn-box .privacy dd{ height: 150px; overflow-x: clip; overflow-y: auto; }
.popup.download .form section .ctn-box .privacy dd::-webkit-scrollbar{ width: 25px; height: 25px; }
.popup.download .form section .ctn-box .privacy dd::-webkit-scrollbar-thumb{ background: var(--mainC); background-clip: padding-box; border: 10px solid transparent; border-radius: 100px; }
.popup.download .form section .ctn-box .privacy dd::-webkit-scrollbar-track{ background: #EEE; background-clip: padding-box; border: 10px solid transparent; border-radius: 100px; }

.popup.download .btns{ display: flex; transform: translateY(1px); }
.popup.download .btns button{ width: 50%; height: 85px; background: var(--mainC); border: none;  border-radius: 0 0 20px 0; font-size: 19px; font-weight: 400; color: #FFF; letter-spacing: -0.02em; }
.popup.download .btns .close{ background: #EEE; border-radius: 0 0 0 20px; color: #AAA; }


/* CAE Support - 2025.07.17 수정 */
#cae2 .intro{ margin-top: 65px; position: relative; }
#cae2 .intro .bg{ clip-path: inset(0 0 0 0 round 20px); -webkit-clip-path: inset(0 0 0 0 round 20px); }
#cae2 .intro .txt{ padding: 0 30px; position: absolute; top: 50%; left: 0; right: 0; transform: translateY(-50%); }
#cae2 .intro .txt *{ font-weight: 500; color: #FFF; }
#cae2 .intro .txt > *{ width: 50%; margin-left: auto; }
#cae2 .intro .txt h3{ margin-bottom: 40px; }
#cae2 .intro .txt p{ line-height: 1.5; }

#cae2 .cae{ padding-top: 200px; }
#cae2 .cae dl{ display: grid; grid-template-columns: 35.2% 64.8%; align-items: flex-start;  border-bottom: 1px solid #E5E5E5; }
#cae2 .cae dl:first-of-type{ border-top: 1px solid #E5E5E5; }
#cae2 .cae dl > *{ padding: 150px 50px; }
#cae2 .cae dl:last-of-type > *{ padding-bottom: 200px; }
#cae2 .cae dl > *:last-child{ border-left: 1px solid #E5E5E5; }
#cae2 .cae dl dd{ font-weight: 300; color: #333; }
#cae2 .cae .title{ font-weight: 600; color: #111; position: sticky; top: 0; left: 0; }

#cae2 .cae .diagram{  text-align: center; }
#cae2 .cae .diagram .grid-box{ display: grid; grid-template-columns: repeat(4, 25%); margin: -20px -5px; }
#cae2 .cae .diagram .item{ margin: 20px 5px; }
#cae2 .cae .diagram .item p{ height: 65px; display: flex; justify-content: center; align-items: center; background: #67ABFF; border-radius: 15px; font-weight: 500; color: #FFF; }
#cae2 .cae .diagram .item div{ padding: 30px 0; position: relative; }
#cae2 .cae .diagram .item div::before{ content: ""; width: 1px; height: 30px; border-left: 2px dashed #CCC; position: absolute; top: 0; left: 50%; transform: translateX(-25%); }
#cae2 .cae .diagram .item div::after{ content: ""; width: 6px; height: 6px; background: #67ABFF; border: 2px solid #FFF; border-radius: 50%; position: absolute; top: 0; left: 50%; transform: translate(-50%, -50%); }
#cae2 .cae .diagram .item figure{ display: block; border: 2px dashed #CCC; border-radius: 50%; padding-bottom: calc(100% - 4px); position: relative; }
#cae2 .cae .diagram .item figure img{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
#cae2 .cae .diagram .item ul{ display: flex; flex-wrap: wrap; justify-content: center; margin: -5px -2px; }
#cae2 .cae .diagram .item ul li{ background: #EEE; border-radius: 100px; padding: 5px 15px;  font-weight: 600; color: #888; margin: 5px 2px; }

#cae2 .cae .diagram .item:nth-of-type(even) p, 
#cae2 .cae .diagram .item:nth-of-type(even) div::after{ background: #6F6BDE; }


#cae2 .cae .basic p{ line-height: 1.7; }
#cae2 .cae .basic figure{ margin: 60px 0; clip-path: inset(0 0 0 0 round 10px); -webkit-clip-path: inset(0 0 0 0 round 10px); }
#cae2 .cae .basic figure img{ width: 100%; }
#cae2 .cae .basic ul{ display: grid; grid-template-columns: repeat(2, 50%); margin: -5px; }
#cae2 .cae .basic ul li{ background: var(--mainC); font-weight: 600; color: #FFF; text-align: center; padding: 20px; margin: 5px; }

@media screen and (max-width: 1800px){
	#cae2 .cae dl dd br{ display: none; }
}

@media screen and (max-width: 1500px){
	#cae2 .cae .diagram{ max-width: 600px; margin: 0 auto; }
	#cae2 .cae .diagram .grid-box{ grid-template-columns: repeat(2, 50%); }
}

@media screen and (max-width: 1400px){
	#cae2 .intro .txt .font64{ font-size: 54px; }
	#cae2 .intro .txt .font32{ font-size: 28px; }
}

@media screen and (max-width: 1200px){
	#cae2 .intro .txt br{ display: none; }
	#cae2 .intro .txt h3{ margin-bottom: 20px; }
	#cae2 .intro .txt .font64{ font-size: 44px; }
	#cae2 .intro .txt .font32{ font-size: 24px; }

	#cae2 .cae{ padding-top: 150px; }
	#cae2 .cae dl{ grid-template-columns: 30% 70%; }
	#cae2 .cae dl > *{ padding: 100px 30px; }
	#cae2 .cae dl:last-of-type > *{ padding-bottom: 100px; }

	#cae2 .cae .diagram .item p{ height: 55px; }
	#cae2 .cae .diagram .item div{ padding: 20px 0; }
	#cae2 .cae .diagram .item div::before{ height: 20px; }

	#cae2 .cae .basic figure{ margin: 30px 0; }
	#cae2 .cae .basic ul li{ padding: 15px; }
}

@media screen and (max-width: 960px){
	#cae2 .intro{ margin-top: 50px; }
	#cae2 .intro .bg{ width: calc(100% - 40px); height: 100%; position: absolute; top: 0; left: 20px; }
	#cae2 .intro .bg img{ width: 100%; height: 100%; object-fit: cover; object-position: 0; }
	#cae2 .intro .txt{ padding: 25px 25px 250px; position: relative; top: 0; transform: unset; }
	#cae2 .intro .txt > *{ width: 100%; }
	#cae2 .intro .txt br{ display: block; }
	#cae2 .intro .txt .font64{ font-size: 36px; }
	#cae2 .intro .txt .font32{ font-size: 20px; }

	#cae2 .cae{ padding-top: 100px; }
	#cae2 .cae dl{ grid-template-columns: repeat(1, 100%); }
	#cae2 .cae dl:last-of-type > *{ padding-bottom: 80px; }
	#cae2 .cae dl dt br{ display: none; }
	#cae2 .cae dl dd{ border-left: none !important; padding: 0 0 80px; }
	#cae2 .cae .title{ padding: 30px 0 !important; }
}

@media screen and (max-width: 700px){
	#cae2 .cae .basic ul{ grid-template-columns: repeat(1, 100%); }
}