/* common */
header .gnb-bg{ height: 100%; }
header.bg .gnb-bg{ background: rgba(255, 255, 255, 0.9); box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); }
header.bg.blue .gnb-bg{ background: #fff; }

#sv{ padding: 180px 0 0; }
#sv #lnb{ display:flex; align-items:center; margin-bottom: 20px; }
#sv #lnb li{ color:#111; font-weight: 500; }
#sv #lnb li:not(:last-child){ display:flex; align-items:center; }
#sv #lnb li:not(:last-child):after{ content:''; display:block; width: 5px; height: 5px; background: #000; margin: 0 30px;}
#sv .title{ color:#000; font-weight: 500; }
#sv .title em{ font-family: var(--gan); }

#sv.sv07 #lnb li:nth-child(2),
#sv.sv08 #lnb li:nth-child(2),
#sv.sv08 #tab-box{ display:none; }

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

.sec150 section:not(:last-of-type){ margin-bottom: 150px; }

#tab-box{ display:inline-flex; align-items:center; margin-top: 80px; padding: 0 30px; background: #000; min-height:50px; border-radius:50px; }
#tab-box li:not(:last-child){ margin-right: 30px; }
#tab-box li a{ font-size:18px; color: rgba(255,255,255,0.5); letter-spacing: -0.54px; text-transform: capitalize; transition:all 0.5s; }
#tab-box li a em{ font-family: var(--gan); letter-spacing: 0;}
#tab-box li.on a{ color:#fff; }

#stit{ color:#222; font-weight: 500; margin-bottom: 20px; letter-spacing: -1.08px; }

#icon-box{ display:flex; gap:20px; }
#icon-box .item-box{ width: 100%; border: 1px solid #DDD; padding: 50px; }
#icon-box .item-box figure{ margin-bottom: 30px; }
#icon-box .item-box .title{ color:#222; font-weight: 500; letter-spacing: -0.78px; margin-bottom: 20px;}
#icon-box .item-box .title em{ font-family: var(--gan);}
#icon-box .item-box .txt{ color:#333; letter-spacing: -0.54px; line-height: 1.66; font-weight: 300; }

#btn-box{ display:flex; justify-content:center; margin: 150px auto 0; }
#btn-box button:not(:last-child){ margin-right: 20px;}

#popup-box{ position: relative; position: fixed; transform:translate(-50%,-50%); top: 50%; left: 50%; z-index: 5; max-width:1500px; width: 100%; height: 740px; z-index: 100002; overflow: hidden; opacity: 0; pointer-events:none; visibility: hidden; background: #fff; }
#popup-box.active{ opacity: 1; pointer-events:auto;  visibility: visible;}
#popup-box .close{ position: absolute; top: 20px; right: 20px; z-index: 5; width: auto; height: auto; }
#popup-box .pop-content{ display:flex; height: 100%; cursor: auto; }
#popup-box .pop-content > *{ width: 50%; height: 100%; }
#popup-box .pop-content .main-swiper{ }
#popup-box .pop-content .main-swiper .swiper-slide{ display:flex; width: 100%; height: 100%;  }
#popup-box .pop-content .main-swiper .swiper-slide .img{ height: 100%; }
#popup-box .pop-content .txt-box{ position: relative; padding: 100px; padding-right: 60px; background: #fff; }
#popup-box .pop-content .txt-box .scroll{ height: 100%; overflow-y:scroll; padding-right: 40px; }
#popup-box .pop-content .txt-box .scroll::-webkit-scrollbar{ width: 1px; background: #ddd; }
#popup-box .pop-content .txt-box .scroll::-webkit-scrollbar-thumb{ width: 3px; background: var(--mainC); }
#popup-box .pop-content .txt-box .scroll .title{ padding: 20px 0 50px; letter-spacing: -1.5px; color:#111; font-weight: 500; }
#popup-box .pop-content .txt-box .scroll .info-box{ border-top: 1px solid #000; }
#popup-box .pop-content .txt-box .scroll .info-box dl{ display:flex; align-items:center; border-bottom: 1px solid #EEE; }
#popup-box .pop-content .txt-box .scroll .info-box dl > *{ min-height:70px; padding: 20px; display:flex; flex-direction:column; justify-content:center; }
#popup-box .pop-content .txt-box .scroll .info-box dl dt{ width: 150px; flex-shrink:0; color:#333; font-weight: 500; letter-spacing: -0.54px; }
#popup-box .pop-content .txt-box .scroll .info-box dl dd{ width: 100%; color:#666; font-weight: 300; letter-spacing: -0.54px; }
#popup-box .pop-content .txt-box .scroll .info-box dl dd ul li{ display:flex; align-items:flex-start; }
#popup-box .pop-content .txt-box .scroll .info-box dl dd ul li:before{ content:''; display:block; width: 4px; height: 4px; background: #333; margin: 9.5px 10px 0 0; flex-shrink:0; }
#popup-box .pop-content .txt-box .scroll .info-box dl dd ul li:not(:last-child){ margin-bottom: 10px; }
#popup-box .pop-content .txt-box .scroll .info-box dl.date dd{ font-family: var(--gan); }
#popup-box .sub-wrap{ position: absolute; bottom: 30px; left: 30px; width: 80px; }
#popup-box .sub-wrap .sub-swiper{ max-height: 440px; overflow: hidden;}
#popup-box .sub-wrap .sub-swiper .swiper-slide{ position: relative; width: 80px; height: 80px; margin-bottom: 10px;}
#popup-box .sub-wrap .sub-swiper .swiper-slide img{ position: absolute; transform:translate(-50%,-50%); top: 50%; left: 50%; min-width:100%; min-height:100%; object-fit:cover; }
#popup-box .sub-wrap .swiper-nav{ margin-top: 10px; display:flex; align-items:center; justify-content: space-between;}
#popup-box .sub-wrap .swiper-nav > *{ position: relative; z-index: 2;}
#popup-box .sub-wrap .swiper-nav .pagi-box{ top: auto; left: auto; bottom: auto; flex-shrink:0; }
#popup-box .sub-wrap .swiper-nav .pagi-box span{ font-family: var(--gan); font-size:14px; font-weight: 600; color:#fff; opacity: 0.5; }
#popup-box .sub-wrap .swiper-nav .pagi-box span.current{ opacity: 1; }
#popup-box .sub-wrap .swiper-nav .pagi-box span.center{ margin: 0 3px; }
#popup-box .sub-wrap .swiper-nav .arrow-box{ display:flex; flex-direction:column; align-items:center; }

#chk-box input{ display:none; } 
#chk-box label{ display:inline-flex; align-items:center; cursor:pointer; }
#chk-box label p{ display:flex; align-items:center; color:#333; letter-spacing: -0.54px; }
#chk-box label span{ position: relative; display:block; width: 25px; height: 25px; border-radius:50%; margin-right: 10px; transition:all 0.3s; background: #ccc; display:flex; justify-content:center; align-items:center; }
#chk-box label span:after{ content:''; display:block; width: 11px; height: 11px; border-radius:50%; background: #fff; }
#chk-box input[type="checkbox"]:checked + label span{ background: var(--mainC); }
#chk-box input[type="checkbox"]:checked + label span:after{ background: #fff !important;}

#file-box input{ display:none; }
#file-box label{ display:inline-flex; align-items:center; cursor:pointer; }
#file-box label .txt{ width: 600px; height: 50px; border: 1px solid #DDD; display: flex; align-items: center; padding: 0 10px;}
#file-box label button{ pointer-events:none; }

#search{ margin-bottom: 60px; }
#search form { display:flex; justify-content:center; align-items:center; }
#search form > *{ height: 70px; border-bottom:2px solid #000; }
#search select{ background:url(/img/common/selectArrow.png) no-repeat top 50% right 30px; padding: 0 30px; width: 260px; font-weight: 500; color:#333; 
letter-spacing: -0.32px; }
#search input{ width: 450px; margin: 0 20px; color:#333; padding: 0 10px; }
#search input::placeholder{ color:#333; }
#search button{ width: 70px; background: var(--mainC); display:flex; justify-content:center; align-items:center; border-bottom:none; flex-shrink:0; }

#circle-box{ display:flex; gap:30px; }
#circle-box .item-box{ position: relative; width: calc((100% - 120px) / 5); }
#circle-box .item-box .circle-box{ position: relative; width: 100%; height: 240px; background: url(/img/sub/esgCircleBgG.png) no-repeat 50% 50%; background-size: contain; display:flex; justify-content:center; align-items:center; flex-direction:column; color:#fff;}
#circle-box .item-box:not(:last-child) .circle-box:before{ content:''; display:block; width: 11px; height: 16px; background: url(/img/sub/esgCircleArrow.png) no-repeat 50% 50%; 
position: absolute; transform:translateY(-50%); top: 50%; left: calc(100% + 10px);}
#circle-box .item-box .txt-box{ position: relative; border: 1px solid #DDD; padding: 40px 20px; max-height:140px; display:flex; justify-content:center; align-items:center; text-align: center; 
margin-top: 30px; }
#circle-box .item-box .txt-box .num{ position: absolute; transform:translate(-50%,-50%); top: 50%; left: 50%; -webkit-text-stroke-width: 1px; -webkit-text-stroke-color: rgba(0,0,0,0.1); font-family: var(--gan); text-transform: capitalize; font-weight: 900; color:transparent; z-index: -1;}
#circle-box .item-box .txt-box .txt{ color:#222; font-weight: 500; letter-spacing: -0.66px; }
#circle-box .item-box:last-child .circle-box{ background:url(/img/sub/esgCircleBgB.png) no-repeat 50% 50%; background-size: contain; }
#circle-box .item-box .title{ font-family: var(--gan); font-weight: 600; text-transform: capitalize; } 
#circle-box .item-box .txt{ letter-spacing: -0.6px; }

.scroll-custom{ overflow-y: scroll; }
.scroll-custom::-webkit-scrollbar{ width: 1px; background: #ddd; }
.scroll-custom::-webkit-scrollbar-thumb{ width: 3px; background: var(--mainC); }

.table-box{ border-top:1px solid #000; }
.table-box .item-box .title{ min-height:70px; display:flex; align-items:center;  }
.table-box .item-box > div{ width: 100%; display: flex; flex-direction: column; }
.table-box .item-box .input-box > *{ height: 50px; }
.table-box .item-box .input-box > div{ display:flex; align-items:center; }
.table-box .item-box .input-box > div:not(:last-of-type){ margin-bottom: 10px; }
.table-box .item-box .input-box input[type="text"]{ width: 600px; border: 1px solid #DDD; height: 50px; padding: 0 10px;}
.table-box .item-box .input-box button{ background: #000; color:#fff; min-width:160px; height: 100%; margin-left: 10px; letter-spacing: -0.54px; }
.table-box .item-box .input-box .btxt{ margin-top: 10px; color:#666; font-weight: 300; letter-spacing: -0.48px; height: auto;	min-height:auto; }
.table-box .item-box .input-box textarea{ width: 1200px; height: 300px; border: 1px solid #DDD; padding: 10px; resize:none; }
.table-box.grid .item-box.type2{ grid-row: auto / span 2; }
.table-box.grid .item-box.type2 .title{ height: 100%; }

.table-box.type2 .item-box{ display:flex; align-items: center; border-bottom: 1px solid #eee;}
.table-box.type2 .item-box p{ border-bottom:none; }
.table-box.type2 .item-box > div{ padding: 15px 20px; }
.table-box.type2 .item-box .title{ min-width:300px; flex-shrink:0; justify-content: center; color:#333; font-weight: 500; letter-spacing: -0.54px; }
.table-box.type2 .item-box .title em{ color:var(--mainC); margin-left: 3px;}
.table-box.type2 .item-box .txt{ display:flex; align-items:center; padding: 15px 20px; color:#666; font-weight: 300; letter-spacing: -0.54px; }
.table-box.type2 .item-box .txt.type2{ color:#333; font-weight: 500; }
.table-box.type2 .item-box .input-box input[type="text"]{ width: 600px; border: 1px solid #DDD; height: 50px; }
.table-box.type2 .item-box .status{ min-width:75px; height: 35px; border-radius:50px; display:inline-flex; justify-content:center; align-items:center; padding: 0 10px; background: #bbb; color:#fff; 
font-size:16px; font-weight: 500; letter-spacing: -0.48px; }
.table-box.type2 .item-box .status.on{ background: var(--mainC); }
.table-box.type2 .item-box .status.ing{ background: #000; }

#organ-box{ display:flex; justify-content:center; flex-direction:column; padding-bottom: 150px;}
#organ-box ul{ position: relative; position: absolute; padding: 30px; background: #F5F5F5; display:inline-block; top: 0; left: calc(100% + 80px); width: max-content; }
#organ-box ul:before{ content:''; display:block; width: 10px; height: 10px; border-radius:50%; background: #000; position: absolute; left: -85px; top: 36px;}
#organ-box ul:after{ content:''; display:block; width: 80px; height: 2px; background: url(/img/sub/historyLine.png); position: absolute; left: -80px; top: 40px;}
#organ-box ul li{ display:flex; color:#333; font-weight: 300; }
#organ-box ul li:not(:last-child){ margin-bottom: 10px; }
#organ-box ul li:before{ content:''; display:block; width: 5px; height: 5px; background: #333; margin-top: 10px; margin-right: 10px; flex-shrink:0; }
#organ-box ul.type2{ left: auto; right: calc(100% + 80px);}
#organ-box ul.type2:before{ left: auto; right: -85px; }
#organ-box ul.type2:after{ left: auto; right: -80px;}
#organ-box dt{ position: relative; margin: 0 auto; display:inline-block; }
#organ-box dt .circle{ position: relative; width: 240px; height: 240px; background: var(--mainC); border-radius:50%; display:flex; justify-content:center; align-items:center; color:#fff; font-family: var(--gan); margin-bottom: 80px; }
#organ-box dd p:before,
#organ-box dt .circle:after{ content:''; display:block; width: 1px; height: 40px; background: #ddd; position: absolute; transform:translateX(-50%); top: 100%; left: 50%;}
#organ-box dt ul{ transform:translateY(-50%); top: calc(50% - 40px);; }
#organ-box dt ul:before,
#organ-box dt ul:after{ transform:translateY(-50%); top: 50%; }
#organ-box dd{ position: relative; display:flex; gap:30px; }
#organ-box dd:before{ content:''; display:block; position: absolute; transform:translateX(-50%); top: -40px; left: 50%; width: 81.5%; height: 1px; background: #ddd;}
#organ-box dd > *{ position: relative; width: calc((100% - 120px) / 5);}
#organ-box dd p:before{ top: auto; bottom: 100%; }
#organ-box dd p{ position: relative; height: 80px; display:flex; justify-content:center; align-items:center; color:#111; border:1px solid #111; font-weight: 500; letter-spacing: -0.6px; text-align: center;}
#organ-box dd .title{ border:1px solid var(--mainC); color:var(--mainC); letter-spacing: -0.66px; }
#organ-box dd .btn-box div{ position: relative; margin-top: 40px;}

#str-box{ position: relative; padding: 60px 150px 60px; border: 1px solid #DDD; display:flex; justify-content:flex-end; align-items:center; }
#str-box .img-box{ }
#str-box .img-box .level-box{ position: absolute; transform:translate(-50%,-50%); top: 48.5%; left: 50%; width: 88%; border-bottom: 1px dashed #AAA; z-index: -1;}
#str-box .img-box .level-box p{ border-top: 1px dashed rgba(170,170,170,0.5); color:#666; letter-spacing: -0.6px; padding: 4.13% 0; }
#str-box .img-box .level-box p em{ font-family: var(--gan); letter-spacing: 0;}
#str-box .img-box.type2 .level-box{ display:none; }

/* sub */
.business .content{ display:flex; gap:100px 50px; flex-wrap:wrap; margin-bottom: 100px;}
.business .content .item-box{ width: calc((100% - 100px) / 3); cursor:pointer; }
.business .content .item-box .box .fit-box{ height: 400px; }
.business .content .item-box .box .fit-box img{ transition:all 0.7s; }
.business .content .item-box .box .txt-box{ padding: 30px 30px 0; display:flex; justify-content:space-between; }
.business .content .item-box .box .txt-box .title{ color:#222; font-weight: 500; letter-spacing: -0.72px; margin-bottom: 15px; text-overflow: ellipsis; overflow: hidden;  display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; }
.business .content .item-box .box .txt-box .txt{ color:#666; font-weight: 300; letter-spacing: -0.54px; }
.business .content .item-box .box .txt-box #viewbtn{ margin-left: 50px; flex-shrink:0; }
.business .content .item-box .box .txt-box #viewbtn figure{ margin-left: 0; }
.business .content .item-box:hover .box > .fit-box img{ transform:translate(-50%,-50%) scale(1.1); }
.business .content .item-box:hover .txt-box #viewbtn span:after{ width: 100%; }
.business .content .item-box:hover .txt-box #viewbtn figure .on{ opacity: 0; left: 100%; }
.business .content .item-box:hover .txt-box #viewbtn figure .off{ left: 50%; opacity: 1; }

.leisure .table-box{ display:grid; grid-template-columns: repeat(2, 1fr); }
.leisure .table-box .item-box{ display:flex; align-items:center; }
.leisure .table-box .item-box p{ display:flex; align-items:center; min-height: 70px; border-bottom:1px solid #eee; }
.leisure .table-box .item-box .title{ min-width:200px; padding: 0 30px; flex-shrink:0; color:#333; font-weight: 500; }
.leisure .table-box .item-box div{ width: 100%;}
.leisure .table-box .item-box .txt{ padding: 0 20px; width: 100%; color:#666; font-weight: 300; }
.leisure .table-box .item-box .txt span{ font-weight: 500; display:inline-block; margin-right: 10px; }
.leisure .table-box .item-box a{ font-family: var(--gan); display:flex; align-items:center; color:#666; }
.leisure .table-box .item-box a svg { margin-left:10px; width: 18px; height: 18px; }
.leisure .table-box .item-box a svg path{ stroke:#666; }
.leisure .img-box{ justify-content:space-between; gap:20px; } 

#club .img-box{ gap:100px; }
#club .img-box .item-box{ width: calc((100% - 100px) / 2); }
#club .img-box .item-box figure{ width: 100%; text-align: center; margin-bottom: 40px;}
#club .img-box .item-box dl{ display:flex; }
#club .img-box .item-box dt{ min-width:280px; flex-shrink:0; color:#111; font-weight: 500; letter-spacing: -0.96px;}
#club .img-box .item-box dd{ width: 100%; color:#333; font-weight: 300; line-height: 1.7; letter-spacing: -0.6px;}

#guide .order #icon-box .item-box{ padding: 40px; min-height:270px; }
#guide .order #icon-box .item-box .num{ width: 40px; height: 40px; background: url(/img/sub/circleBg.png) no-repeat 50% 50%; display:flex; justify-content:center; align-items:center;
color:#fff; font-weight: bold; font-family: var(--gan); margin-bottom: 10px; }
#guide .order #icon-box .item-box:last-child{ background: var(--mainC); }
#guide .order #icon-box .item-box:last-child .num{ color:var(--mainC); background: url(/img/sub/circleBg2.png) no-repeat 50% 50%; }
#guide .order #icon-box .item-box:last-child .txt{ color:#fff; }
#guide .order .table-box{ margin-top: 30px; display:grid; grid-template-columns: repeat(4, 1fr); text-align: center; }
#guide .order .table-box .item-box p{ justify-content:center; }
#guide .order .table-box .item-box .title{ color:#222; font-weight: 500; letter-spacing: -0.6px; }
#guide .order .table-box .item-box .txt{ color:#666; font-weight: 300; font-family: var(--gan);  }
#guide .order .table-box .item-box p{ display:flex; align-items:center; min-height: 70px; border-bottom:1px solid #eee; }
#guide .protect ul li{ display:flex; color:#666; font-weight: 300; letter-spacing: -0.6px; }
#guide .protect ul li:before{ content:''; display:block; width: 5px; height: 5px; background: #000; margin-top: 10.5px; margin-right: 10px; flex-shrink:0; }
#guide .protect ul li:not(:last-child){ margin-bottom: 15px; }
#guide .protect ul li em{ color:#333; font-weight: 500; }

#online .policy .privacy-wrap{ padding: 40px 45px; border:1px solid #ddd; color:#666; letter-spacing: -0.48px; font-weight: 300; line-height: 1.5; margin-bottom: 20px;}
#online .policy .privacy-wrap .scroll-custom{ height: 300px; padding-right: 40px; padding-left: 10px;} 
#online .policy .privacy-wrap .scroll-custom::-webkit-scrollbar{ width: 3px; background: transparent; }
#online .policy .privacy-wrap .title-box .title{ margin-bottom: 10px;}
#online .policy .privacy-wrap .title-box,
#online .policy .privacy-wrap dl:not(:last-of-type){ margin-bottom: 20px; }

#results .content{ padding: 120px 150px; border: 1px solid #DDD; }
#results .content #btn-box{ margin-top: 60px; }

#results_view .table-box .item-box .title{ min-height: 80px; }

#check .board-box table td:nth-child(2) p a{ font-weight: 500;}

#greeting > div{ position: relative; }
#greeting .bg{ position: absolute; bottom: 0; right: 0; z-index: 0;}
#greeting .content .title{ color:#222; font-weight: 500; line-height: 1.35; letter-spacing: -1.68px; }
#greeting .content .title em{ color:var(--mainC); }
#greeting .content .txt-box{ margin-top: 60px; color:#333; letter-spacing: -0.6px; line-height: 1.7; font-weight: 300; }
#greeting .content .txt-box p:not(:last-child){ margin-bottom: 30px;}
#greeting .content .txt-box p.last{ font-weight: 500; letter-spacing: -0.66px; }

#history > div{ position: relative; }
#history .tab-wrap{ position: relative; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 2; pointer-events: none;}
#history .tab-wrap ul{ margin-top: 0; position: sticky; top: 25px; left: 20px; pointer-events: all;}
#history .content section{ padding-top: 150px; }
#history .content section:first-child{ padding-top: 110px;}
#history .content .bg-box{ position: relative; width: 100%; height: 360px; display:flex; justify-content:center; align-items:center; }
#history .content .bg-box .fit-box{ position:absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1;}
#history .content .bg-box p{ font-family: var(--gan); color:rgba(255,255,255,0.3); font-weight: 500; letter-spacing: -30px; transition:all 0.7s; opacity: 0; filter:blur(10px); -webkit-filter: blur(10px);}
#history .content .bg-box p em{ font-family: var(--baseF);}
#history .content .bg-box.aos-animate p{ letter-spacing: -2.4px; opacity: 1; filter:blur(0px); -webkit-filter: blur(0px);}
#history .content .txt-box{ position: relative; padding-top: 60px;}
#history .content .txt-box .bar{ position: relative; position: absolute; top: 0; left: 185px; width: 1px; background: #ddd; height: 100%; z-index: -1; }
#history .content .txt-box .bar span{ position: absolute; top: 0; transform:translateX(-50%); left: 50%; background: var(--mainC); display:block; width: 3px; height: 100%; }
#history .content .txt-box .year-box .item-box{ display:flex; opacity: 1; }
#history .content .txt-box .year-box .item-box:not(:last-child){ margin-bottom: 100px; }
#history .content .txt-box .year-box .item-box .year{ position: relative; color:#aaa; font-family: var(--gan); font-weight: 500; min-width:185px; transition:all 0.5s; }
#history .content .txt-box .year-box .item-box .year span{ display:block; position: absolute; position: absolute; top: 33px; left: calc(100% - 7px); width: 95px; height: 2px;
background: url(/img/sub/historyLine-off.png); }
#history .content .txt-box .year-box .item-box .year span:before{ content:''; display:block; position: absolute; top: 0; left: 0; width: 0; height: 100%;
background: url(/img/sub/historyLine.png); transition:all 0.5s 0.1s; }
#history .content .txt-box .year-box .item-box .year span:after{ content:''; display:block; width: 15px; height: 15px; background: #aaa; position: absolute; transform:translateY(-50%); 
top: 50%; left: 0; transition:all 0.3s; }
#history .content .txt-box .year-box .item-box.on .year{ color:#222; }
#history .content .txt-box .year-box .item-box.on .year span:before{ width: 100%; }
#history .content .txt-box .year-box .item-box.on .year span:after{ background: var(--mainC); }
#history .content .txt-box .year-box .item-box dl{ display:flex; margin-top: 20px; margin-left: 120px; color:#666; }
#history .content .txt-box .year-box .item-box dl dt{ font-family: var(--gan); min-width:55px; margin-right: 30px;}
#history .content .txt-box .year-box .item-box dl dd{ letter-spacing: -0.6px; font-weight: 300; }
#history .content .txt-box .year-box .item-box dl dd figure{ margin-top: 10px; }

#location .map-box > div{ width: 100%; margin-bottom: 20px;}
#location .map-box .cont { display:none }
#location .content{ display:flex; gap:10px; }
#location .content .item-box{ width: calc((100% - 40px) / 5); padding: 50px; border: 1px solid #DDD; }
#location .content .item-box .title{ color:#222; font-weight: 500; letter-spacing: -0.66px; margin-top: 30px;}
#location .content .item-box .txt{ margin-top: 20px; line-height: 1.7; font-weight: 300; color:#333; letter-spacing: -0.6px; }
#location .content .item-box .txt.type2{ display:flex; }
#location .content .item-box .txt em{ width:48px; height: 30px; padding: 0 10px; margin-right: 10px;display:inline-flex; justify-content:center; align-items:center; background: #395CB3; color:#fff; border-radius:50px; font-weight: 500; letter-spacing: -0.48px; margin-top: 3px;}
#location .content .item-box .txt em.type2{ background: #4D9D30;}

#safety #icon-box .item-box .title{ color:#333; }
#safety #icon-box .item-box ul li{ display:flex; color:#666; font-weight: 300; letter-spacing: -0.6px; }
#safety #icon-box .item-box ul li:before{ content:''; display:block; width: 5px; height: 5px; background: #666; margin-right: 10px; margin-top: 10px; }
#safety #icon-box .item-box ul li:not(:last-child){ margin-bottom: 10px; }
#safety .order .txt-box{ margin-top: 60px;}
#safety .order .txt-box .item-box{ display:flex; align-items:center; border: 1px solid #DDD; padding: 50px 100px;}  
#safety .order .txt-box .item-box:not(:last-child){ margin-bottom: 20px;}
#safety .order .txt-box .item-box dt{ color:rgba(0,0,0,0.05); font-weight: bold; font-family: var(--gan); text-transform: capitalize; margin-right: 95px; flex-shrink:0; }
#safety .order .txt-box .item-box dd .title{ color:#222; font-weight: 500; letter-spacing: -0.72px; margin-bottom: 20px; }
#safety .order .txt-box .item-box dd ul li{ display:flex; color:#666; font-weight: 300; letter-spacing: -0.6px; }
#safety .order .txt-box .item-box dd ul li:before{ content:''; display:block; width: 5px; height: 5px; background: #666; margin-right: 10px; margin-top: 10px; }
#safety .order .txt-box .item-box dd ul li:not(:last-child){ margin-bottom: 10px;}
#safety .certification .flex-box{ align-items:center; }
#safety .certification .flex-box .img-box{ display:flex; margin-right: 100px; flex-shrink:0; }
#safety .certification .flex-box .img-box figure{ display:flex; flex-direction:column; }
#safety .certification .flex-box .img-box figure:not(:last-child){ margin-right: 10px; }
#safety .certification .flex-box .img-box span{ display:inline-block; margin: 20px auto 0; background: #111; padding: 0 20px; height: 40px; display:flex; justify-content:center; align-items:center; 
color:#fff; font-weight: 300; letter-spacing: -0.54px; border-radius:50px; }
#safety .certification .flex-box .txt{ color:#333; font-weight: 300; letter-spacing: -0.6px; line-height: 1.7; }
#safety .active #icon-box{ flex-wrap:wrap; }
#safety .active #icon-box .item-box{ width: calc((100% - 40px) / 3);}

.mp{ position: relative; padding-bottom: 200px; background: url(/img/sub/environmentMpBg.png) no-repeat 50% 50%; background-size:cover; }
.mp .bg{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.mp .content{ position: relative; z-index: 2; background: #fff; padding: 100px; }
.mp .content .title-box .stxt{ font-family: var(--gan); color:var(--mainC); margin-bottom: 20px; text-transform: capitalize; font-weight: 600; }
.mp .content .title-box .title{ color:#111; font-weight: 500; letter-spacing: -1.08px;  line-height: 1.4; }
.mp .content #icon-box{ margin: 60px 0; gap:10px; }
.mp .content #icon-box .item-box{ width: calc((100% - 40px) / 5); min-height:360px; padding: 40px; }
.mp .content #icon-box .item-box .title{ line-height: 1.5; margin-bottom: 15px;}
.mp .content #icon-box .item-box .txt{ color:#666; line-height: 1.57; }
.mp .content .txt-box{ color:#333; font-weight: 300; letter-spacing: -0.6px; line-height: 1.7;  }
.mp .content .txt-box em{ display:block; color:#222; font-weight: 500; margin-top: 30px; line-height: 1.3;}
.mp .content .txt-box em span{ display:block; margin-top: 10px; }

.system .intro #circle-box{ gap:120px; }
.system .intro #circle-box .item-box{ width: calc((100% - 360px) / 4);}
.system .intro #circle-box .item-box:not(:last-child) div:before{ left: calc(100% + 50px);}

.activity .table-box{ border-top:none; }
.activity .table-box:not(:last-of-type){ margin-bottom: 60px; }
.activity .table-box .title{ color:#333; font-weight: 500; letter-spacing: -0.66px; margin-bottom: 10px; }
.activity .table-box table{ border-top:1px solid #000; }
.activity .table-box tr{ border-bottom: 1px solid #EEE; }
.activity .table-box th{ height: 80px; color:#333; font-weight: 500; letter-spacing: -0.54px; }
.activity .table-box td:first-child{ font-weight: 500; }
.activity .table-box td{ padding: 20px; color:#333; font-weight: 300; letter-spacing: -0.54px; }
.activity .table-box td:not(:nth-child(2)){ text-align: center; }
.activity .table-box td ul li{ color:#666; display:flex; }
.activity .table-box td ul li:not(:last-child){ margin-bottom: 10px;}
.activity .table-box td ul li:before{ content:''; display:block; width: 3px; height: 3px; background: #666; margin-top: 10px; margin-right: 10px; flex-shrink:0; }

#quality-mp{ background: url(/img/sub/qualityMpBg.png) no-repeat 50% 50%; background-size:cover; }
#quality-mp .content #icon-box .item-box{ min-height: 295px; }

#quality-system .intro .chart-box{ position: relative; padding-top: 50px;}
#quality-system .intro .chart-box figure{ position: absolute; transform:translateX(-50%); top: 0; left: 50%; z-index: -1;}
#quality-system .intro .chart-box figure:before{ content:''; display:block; width: 940px; height: 940px; border-radius:50%; border: 1px dashed #000; opacity: 0.1; position: absolute; transform:translate(-50%,-50%); top: 50%; left: 50%; }
#quality-system .intro .chart-box .txt-box{ width: 100%; display:flex; flex-wrap:wrap; gap: 0 740px;  }
#quality-system .intro .chart-box .txt-box .item-box{ width: calc((100% - 740px) / 2);}
#quality-system .intro .chart-box .txt-box .item-box:first-child{ margin-bottom: 320px; }
#quality-system .intro .chart-box .txt-box .item-box:nth-child(2n-1){ text-align: right; }
#quality-system .intro .chart-box .txt-box .item-box span{ display:none; } 
#quality-system .intro .chart-box .txt-box .item-box .title{ color:#333; font-weight: 500; letter-spacing: -0.72px; line-height: 1.5; margin-bottom: 20px; }
#quality-system .intro .chart-box .txt-box .item-box .title em{ font-family: var(--gan); letter-spacing: 0;}
#quality-system .intro .chart-box .txt-box .item-box ul{ display:inline-grid; }
#quality-system .intro .chart-box .txt-box .item-box ul li{ display:inline-flex; color:#666; font-weight: 300; letter-spacing: -0.54px; width: max-content;}
#quality-system .intro .chart-box .txt-box .item-box ul li:not(:last-child){ margin-bottom: 10px;}
#quality-system .intro .chart-box .txt-box .item-box ul li:before{ content:''; display:inline-block; width: 5px; height: 5px; background: #666; margin-top: 9px; margin-right: 10px; flex-shrink:0; }
#quality-system .intro .chart-box .txt-box .item-box:nth-child(2n) ul{ grid-template-columns: repeat(2, 1fr); gap:0 30px; }

#regulations .manage .content{ display:flex; flex-wrap:wrap; gap:20px; }
#regulations .manage .content .item-box{ position: relative; width: calc((100% - 20px) / 2); height: 360px; padding: 60px; color:#fff; overflow: hidden;}
#regulations .manage .content .item-box *{ position: relative; z-index: 2;}
#regulations .manage .content .item-box:before{ content:''; display:block; position: relative; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: linear-gradient(180deg, rgba(0, 78, 162, 0.00) -23.88%, #004EA2 59.55%); z-index: 0; opacity: 0; transition:all 0.5s; }
#regulations .manage .content .item-box .bg{ position: absolute; transform:translate(-50%,-50%); top: 50%; left: 50%; z-index: -1; transition:all 0.5s; }
#regulations .manage .content .item-box .title{ margin: 30px 0 20px; font-weight: 500; letter-spacing: -0.78px; }
#regulations .manage .content .item-box .txt{ font-weight: 300; letter-spacing: -0.6px; }
#regulations .manage .content .item-box:hover:before{ opacity: 1; }
#regulations .manage .content .item-box:hover .bg{ transform:translate(-50%,-50%) scale(1.1); }
#regulations dl:not(:last-child){ margin-bottom: 30px;}
#regulations dl dt{ color:#333; font-weight: 500; margin-bottom: 10px; letter-spacing: -0.54px; }
#regulations dl dd{ color:#666; font-weight: 300; letter-spacing: -0.54px; line-height: 1.66;}

#practice{ background: url(/img/sub/practiceBg.png) no-repeat 50% 50%; background-size:cover; }
#practice .num-box{ margin-top: 40px;}
#practice .num-box .item-box{ border:1px solid #ddd; display:flex; padding: 40px 60px; color:#333; letter-spacing: -0.6px; font-weight: 300; line-height: 1.7; }
#practice .num-box .item-box:not(:last-child){ margin-bottom: 10px; }
#practice .num-box .item-box em{ flex-shrink:0; width: 40px; height: 40px; color:#fff; font-weight: bold; font-family: var(--gan); font-size:16px; margin-right: 30px;
background: url(/img/sub/circleBg.png) no-repeat 50% 50%; display:flex; justify-content:center; align-items:center; }

.social ul li{ display:flex; }
.social ul li:before{ content:''; display:block; width: 5px; height: 5px; background: #333; margin-top: 10px; margin-right: 10px; flex-shrink:0; }
.social #btn-box{ margin-top: 100px;}
.social #title-box{ margin-bottom: 150px; }
.social #title-box .title{ margin-bottom: 30px;}
.social #title-box .title em{ color:var(--mainC); }
.social #title-box ul{ padding: 60px; border:1px solid #ddd; color:#333;letter-spacing: -0.6px; font-weight: 300; }
.social #title-box ul li:not(:last-child){ margin-bottom: 15px; }
.social #tab-box{ margin-top: 0; }
.social .content .title-box{ margin: 60px 0;}
.social .content .title-box ul li{ color:#666; font-weight: 300; }
.social .content .title-box ul li:not(:last-child){ margin-bottom: 10px; }
.social .content .title-box ul li:before{ background: #666; }
.social .content .table-box table tr{ border-bottom: 1px solid #EEE; }
.social .content .table-box table tr *{ height: 80px; padding: 0 10px; }
.social .content .table-box table tr th{ color:#333; font-weight: 500; letter-spacing: -0.54px; }
.social .content .table-box table tr td{ color:#333; font-weight: 300; text-align: center; }
.social .content .table-box table tr td:first-child{ font-weight: 500; }
.social .content .table-box table tr td:nth-child(2){ color:#666; text-align: left; }
.social .content .graph-box{ border: 1px solid #DDD; padding: 60px; display:flex; align-items: flex-start; justify-content: space-between;}
.social .content .graph-box .txt-box{ border: 1px dashed #CCC; padding: 30px 40px; margin-right: 20px;}
.social .content .graph-box .txt-box .stxt{ display:inline-block; background: #111; border-radius:50px; color:#fff; display:inline-flex; justify-content:center; align-items:center; padding: 0 15px;
 height: 30px; margin-bottom: 20px; }
.social .content .graph-box .txt-box  ul li{ color:#222; letter-spacing: -0.54px; }
.social .content .graph-box .txt-box  ul li:before{ display:none; }
.social .content .graph-box .txt-box  ul li span{ display:flex; align-items:center; width: max-content;}
.social .content .graph-box .txt-box  ul li span:last-child{ color:#666; font-weight: 300; }
.social .content .graph-box .txt-box  ul li span:not(:last-child){ margin-right: 20px; }
.social .content .graph-box .txt-box  ul li span img,
.social .content .graph-box .txt-box  ul li span em{ margin-right: 10px; font-family: var(--gan); font-weight: 600; color:#222; }
.social .content .graph-box .graph{}
.social .content .graph-box .graph svg{ width: 100%; height: auto;}
.social .content .graph-box .graph rect{shape-rendering: auto ;}
.social .content .graph-box .graph .bar{ clip-path: inset(90% 0 0); transition:all 0.7s 0.2s; }
.social .content .graph-box .graph .info{ opacity: 0; transition:all 0.5s 0.7s;}
.social .content .graph-box.aos-animate .graph .bar{ clip-path: inset(0% 0 0); }
.social .content .graph-box.aos-animate .graph .info{ opacity: 1; }
.social .content .board-box{ border-top:1px solid #000; }
.social .content .board-box .item-box a{ display:flex; align-items:center; padding: 30px; border-bottom:1px solid #ddd; }
.social .content .board-box .item-box figure{ width: 500px; height: 320px; flex-shrink:0; margin-right: 100px; }
.social .content .board-box .item-box .txt-box .title{ color:#222; font-weight: 500; letter-spacing: -0.84px; }
.social .content .board-box .item-box .txt-box .txt{ color:#666; max-width:940px; width: 100%; font-weight: 300; letter-spacing: -0.6px; line-height: 1.7; text-overflow: ellipsis;  overflow: hidden; display: -webkit-inline-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; margin: 30px 0 75px; }
.social .content .board-box .item-box .txt-box .day{ color:#999; font-weight: 300; font-family: var(--gan); }

#foundation .content .graph-box{ padding-bottom: 100px;}
#foundation .content .graph-box .img-box{ display:flex; width: 100%; height: 310px; margin-top: 40px; }
#foundation .content .graph-box .img-box .item-box{ position: relative; width: calc(100% / 5); border-bottom:1px solid #000; }
#foundation .content .graph-box .img-box .item-box > div{ display:flex; align-items:flex-end; justify-content:center; height: 100%; }
#foundation .content .graph-box .img-box .item-box > div .bar{ position: relative; height: 0; width: 50px; transition:all 1s; }
#foundation .content .graph-box .img-box .item-box > div .bar span{ position: absolute; transform:translateX(-50%); left: 50%; bottom: calc(100% + 10px); display: inline-flex; height: 35px; padding: 0px 15px; justify-content: center; align-items: center; border: 2px solid #DDD; border-radius: 35px; background: #FFF; box-shadow: 0px 3px 10px 0px rgba(0, 0, 0, 0.15); color: #333; letter-spacing: -0.6px; width: max-content;}
#foundation .content .graph-box .img-box .item-box > div .bar1{ background: linear-gradient(180deg, #DDD 0%, #EEE 100%); margin-right: 10px; }
#foundation .content .graph-box .img-box .item-box > div .bar2{ background: linear-gradient(180deg, #004EA2 0%, #529DEF 100%); }
#foundation .content .graph-box .img-box .item-box > div .bar2 span{ border: 2px solid var(--main, #004EA2); }
#foundation .content .graph-box .img-box .item-box > div .bar span img{ margin-right: 5px; }
#foundation .content .graph-box .img-box .item-box > div .bar span em{ font-family: var(--gan); letter-spacing: 0; }
#foundation .content .graph-box .img-box .item-box p{ position: absolute; transform:translateX(-50%); left: 50%; top: calc(100% + 20px); color:#333; letter-spacing: -0.54px;}
#foundation .content .graph-box .img-box .item-box p em{ font-family: var(--gan); letter-spacing: 0; }

#foundation .content .graph-box .img-box.aos-animate .item-box > div .bar{ height: var(--bar);}

#pi .content{ display:grid; grid-template-columns: repeat(5, 1fr); gap:10px; }
#pi .content > *{ height: 335px; }
#pi .content .item-box{ position: relative; display:flex; flex-direction:column; justify-content:space-between; padding: 50px; border: 1px solid #DDD; }
#pi .content .item-box > .title{ color:var(--mainC); font-weight: 500; line-height: 1.5; letter-spacing: -0.72px; }
#pi .content .item-box:first-child{ border:none; }
#pi .content .item-box:first-child:after{ width: calc(100% - 6px); height: calc(100%  - 6px) ; aspect-ratio: 1; content: ""; position: absolute; top: 0px; left: 0px; padding: 3px; background: linear-gradient(-45deg, rgba(111, 186, 44, 1) , rgba(0, 78, 162, 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; }
#pi .content .item-box div .title{ color:#222; font-weight: 500; letter-spacing: -0.66px; margin-bottom: 20px;}
#pi .content .item-box div .day{ font-weight: 300; font-family: var(--gan); }
#pi .content .item-box div .day em{ font-family: var(--baseF); }
#pi .content .img-box{ grid-column: auto / span 2; }
#pi .btxt{ text-align: right; margin-top: 20px; color:#666; font-weight: 300; }

/*#fi .stxt{ text-align: right; margin-bottom: 10px; color:#999; font-weight: 300; letter-spacing: -0.54px; }*/
/*#fi .chart-box{ border: 1px solid #DDD; padding: 60px 100px 67px;}*/
/*#fi .chart-box svg{ width: 100%; height: 100%; }*/
/*#fi .chart-box .bar{ clip-path: inset(90% 0 0); transition:all 0.7s 0.2s; }*/
/*#fi .chart-box.aos-animate .bar{ clip-path: inset(0% 0 0); }*/

#fi .table-box table tr > *{ height: 80px; border-bottom:1px solid #eee; text-align: center; }
#fi .table-box table tr > *:first-child{ letter-spacing: -0.54px; }
#fi .table-box table tr th{ color:#333; font-weight: 500; }
#fi .table-box table tr td{ color: #666; font-family: var(--gan);}
#fi .table-box table tr td:first-child{ color:#333; font-family: var(--baseF); font-weight: 500; }
#fi .table-box table tr.grey td{ background: #F9F9F9;}
#fi .table-box table tr.grey td:first-child{ font-weight: 500; }
#fi .info{ display:flex; align-items:center; }
#fi .info .txt-box{ margin-left: 200px; }
#fi .info .txt-box .stxt{ font-family: var(--gan); color:var(--mainC); font-weight: 600; } 
#fi .info .txt-box .title{ color:#111; font-weight: 500; letter-spacing: -1.2px; margin: 20px 0 30px;}
#fi .info .txt-box .txt{ color:#333; font-weight: 300; line-height: 1.7; letter-spacing: -0.6px;}
#fi .evaluation #title-box{ margin-bottom: 30px; }
#fi .evaluation .txt-box{ display:flex; flex-wrap:wrap; gap:20px; margin-bottom: 60px;}
#fi .evaluation .txt-box .item-box{ width: calc((100% - 40px) / 3); height: 400px; padding: 60px; display:flex; flex-direction:column; justify-content:space-between; border: 1px solid #DDD;}
#fi .evaluation .txt-box .item-box:first-child{ background: var(--mainC); color:rgba(255,255,255,0.6); font-weight: 500; letter-spacing: -0.54px; text-align: center; border:none; }
#fi .evaluation .txt-box .item-box:first-child .btit{ color:#fff; font-size:200px; font-family: var(--gan); font-weight: bold; transform:translateY(10px); letter-spacing: 0;}
#fi .evaluation .txt-box .item-box .stxt{ color:#222; font-weight: 500; letter-spacing: -0.66px;}
#fi .evaluation .txt-box .item-box .num{ color:#aaa; font-family: var(--gan); display:flex; align-items:center; justify-content: flex-end; font-weight: bold; }
#fi .evaluation .txt-box .item-box .num span{ margin-right: 10px; color:#111; font-weight: 600; }
#fi .scale #stit{ display:flex; justify-content:space-between; align-items:flex-end; }
#fi .scale #stit span{ color:#999; font-weight: 300; letter-spacing: -0.54px; }
#fi .scale .table-box th:not(:first-child){ font-family: var(--gan); }
#fi .scale .chart-box{ padding: 40px 100px 60px; border: 1px solid #DDD; margin-top: 20px;}

.cibi .intro .content{ text-align: center; }
.cibi .intro .content > figure{ padding: 25px; margin-bottom: 60px;}
.cibi .intro .content .txt-box .title{ color:#333; font-weight: 500; letter-spacing: -0.38px; margin-bottom: 30px; }
.cibi .intro .content .txt-box .title em{ color:var(--mainC);  }
.cibi .intro .content .txt-box .txt{ color:#333; font-weight: 300; line-height: 1.7; letter-spacing: -0.6px;}
.cibi .intro .content #btn-box{ margin-top: 80px;}
.cibi .type #stit{ font-family: var(--gan); }
.cibi .type .content{ display:flex; gap: 60px 20px; flex-wrap:wrap; }
.cibi .type .content .item-box{ width: calc((100% - 20px) / 2); }
.cibi .type .content .item-box figure{ width: 100%; height: 300px; display:flex; justify-content:center; align-items:center; background: url(/img/sub/cibiBg.png) 50% 50%; border: 1px solid #DDD;}
.cibi .type .content .item-box .title{ text-align: center; margin-top: 20px; color:#222; letter-spacing: -0.6px; font-weight: 500; }
.cibi .type .content .item-box .title em{ font-family: var(--gan); }
.cibi .min .item-box{ height: 300px; background: url(/img/sub/cibiBg.png) 50% 50%; border: 1px solid #DDD; display:flex; align-items:center; padding-left: 350px;}
.cibi .min .item-box .txt{ margin-top: -23px; margin-left: 30px; color:#222; font-weight: 300; letter-spacing: -0.6px; }
.cibi .min .item-box .txt span{ font-weight: 600;}
.cibi .min .item-box .txt span em{ font-family: var(--gan);}

#bi .min .item-box figure{ margin-top: 20px;}
#bi .min .item-box .txt{ margin-top: 0; }

#character #title-box{ font-family: var(--gan); }
#character .content .item-box{ display:flex; border: 1px solid #DDD; align-items:center; padding: 20px 30px;}
#character .content .item-box:not(:last-child){ margin-bottom: 20px;}
#character .content .item-box .txt-box{ display:flex; align-items:center; }
#character .content .item-box .txt-box .title{ color:#222; font-weight: 500; letter-spacing: -0.72px; margin-right: 60px; }
#character .content .item-box .txt-box .title em{ font-family: var(--gan); letter-spacing: 0;}
#character .content .item-box .txt-box .txt{ color:#333; font-weight: 300; letter-spacing: -0.6px;}

#materials h4.title{ text-align: center; font-weight: 500; color:#222; letter-spacing: -1.2px; margin-bottom: 40px; }
#materials .main-swiper .swiper-slide{ text-align: center; }
#materials .main-swiper .swiper-slide > *{ max-width: 1000px; height: 560px; width: 100%; margin: 0 auto; }
#materials .sub-wrap{ border: 1px solid #DDD; padding: 40px 60px; overflow: hidden; display:flex; align-items:center; gap: 60px; } 
#materials .sub-wrap .arrow{ cursor:pointer; }
#materials .sub-swiper{ width: 100%; overflow: hidden; }
#materials .sub-swiper .swiper-slide{ position: relative; width: calc((100% - 150px) / 7); margin-right: 25px; cursor:pointer; }
#materials .sub-swiper .swiper-slide figure{ position: relative; width: 100%; height: 105px; }
#materials .sub-swiper .swiper-slide figure:before{ content:''; display:block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.60); z-index: 2; opacity: 0;
transition:all 0.5s;}
#materials .sub-swiper .swiper-slide figure:after{ content:''; display:block; background: rgba(0, 0, 0, 0.60); position: absolute; top: 0; left: 0; width: 100%; height: 100%; width: calc(100% - 4px); height: calc(100%  - 4px) ; aspect-ratio: 1; content: ""; position: absolute; top: 0px; left: 0px; padding: 2px; background: linear-gradient(-45deg, rgba(111, 186, 44, 1) , rgba(0, 78, 162, 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: 3; opacity: 0; transition:all 0.5s;}
#materials .sub-swiper .swiper-slide p{ color: #333; letter-spacing: -0.54px; text-overflow: ellipsis;  overflow: hidden; display: -webkit-inline-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; margin-top: 10px; text-align: center; width: 100%;}
#materials .sub-swiper .swiper-slide-thumb-active figure:before,
#materials .sub-swiper .swiper-slide-thumb-active figure:after{ opacity: 1; }

#philosophy .content{ background: url(/img/sub/philosophyBg.png) no-repeat 50% 50%; background-size:cover; padding: 200px 0;}
#philosophy .content .item-box{ display:flex; align-items:center; }
#philosophy .content .item-box:not(:last-child){ margin-bottom: 150px; }
#philosophy .content .item-box .txt-box{ padding-left: 90px; color:#fff; filter:blur(10px); -webkit-filter: blur(10px); transition:all 1s 0.2s; }
#philosophy .content .item-box .txt-box .title{ font-weight: 500; letter-spacing: -1.5px; margin-bottom: 30px; }
#philosophy .content .item-box .txt-box .txt{ font-weight: 300; line-height: 1.7; letter-spacing: -0.6px; }
#philosophy .content .item-box figure{ transition:all 1.5s; flex-shrink:0; }
#philosophy .content .item-box.item01 .txt-box{ margin-right: 210px; color:#111; }
#philosophy .content .item-box.item01 .txt-box .txt{ color:#333; }
#philosophy .content .item-box.item02{ margin-left: 150px; }
#philosophy .content .item-box.item02 .txt-box{ margin-left: 190px;}
#philosophy .content .item-box.item03 .txt-box{ margin-right: 185px;}
#philosophy .content .item-box .txt-box.aos-animate{ filter:blur(0px); -webkit-filter: blur(0px);  }

#organization{ position: relative; }
#organization .txt{ position: absolute; transform:translateX(-50%); left: 50%; top: 30px; }
#organization .txt img{ max-width: max-content; }