@charset "utf-8";
/** |READ ME| **********************************************************************************************************

"Training"

Cascading Style Sheet Setting File

Ver.20251122

------------------------------------------------------------------------------------------------------------------------ **/

.tra-dat{position: relative;padding:100px 0 180px;}
.tra-dat-tit{font-size:20px;font-weight: bold;padding: 0 0 60px;}
.tra-dat-list{display: flex;gap: 20px;justify-content: center;flex-wrap: wrap;}
.tra-dat-list li{position: relative;padding:30px 20px;width: calc(100% / 4 - 20px * 3 / 4);box-sizing: border-box;box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1);display: flex;flex-direction: column;justify-content: space-between;border-radius:20px;}
.tra-dat-list h3{font-size: 18px;font-weight: bold;padding:0 0 30px;}
.tra-dat-list div{font-weight: bold;color:#FF0033;line-height: 1;letter-spacing:0;}
.tra-dat-list li:nth-child(2) div{display: block;}
.tra-dat-list div strong{display:inline-block;font-size:80px;vertical-align: bottom;font-family:'Oswald', sans-serif;font-weight:500;}
.tra-dat-list div em{display:inline-block;font-size:18px;vertical-align: bottom;}
.tra-dat-list div b{display:inline-block;font-size:30px;vertical-align: bottom;}
.tra-dat-list div span{display: flex;flex-direction: column;justify-content: end;display: inline-block;text-align: left;}
.tra-dat-list div span em{padding:0 0 3px;}
.tra-dat-list div span b{width: 100%;}
.tra-dat-list p{font-size:13px;line-height:1.8;padding:30px 0 0;}
.tra-dat-list img{width:100%;max-width:100px;display: block;margin:0 auto 10px;}
.tra-pro{background: #FFF7F7;position: relative;padding:100px 0 0;overflow: hidden;}
.tra-pro-hed{display: flex;flex-wrap: wrap;align-items: center;padding:0 0 80px;}
.tra-pro-hed-tit{font-size: 80px;font-weight: bold;font-family:"Poppins", sans-serif;font-weight:600;}
.tra-pro-hed-sub{margin: 0 0 0 auto;font-size: 18px;font-weight: bold;color: #f03;}
.tra-pro-men{padding:0 0 120px;}
.tra-pro-men-list{display: flex;gap: 80px;justify-content: center;flex-wrap: wrap;}
.tra-pro-men-list li{width: calc(50% - 80px / 2);text-align: left;}
@media (max-width:1000px) and (min-width:641px){
    .tra-pro-men-list{row-gap: 40px;column-gap: 30px;}
    .tra-pro-men-list li{width: calc(50% - 30px / 2);}
}
.tra-pro-men-list img{width:100%;height:auto;border-radius:10px;}
.tra-pro-men-list h4{padding:20px 0 10px;font-size: 18px;font-weight: bold;}
.tra-pro-flo{margin:0 auto 120px;}
.tra-pro-flo h3{font-size: 28px;font-weight: bold;text-align: left;padding: 0 0 50px;}
.tra-pro .swiper{overflow:visible;position:static;text-align:left;padding:0 0 20px 20px;}
.tra-pro-flo-list .swiper img{width:100%;height:auto;}
.tra-pro-flo-list .swiper-wrapper{overflow:visible;}
.tra-pro-flo-list .swiper-slide{padding:0 0 0 0;box-sizing:border-box;border-radius:10px;height: auto;}
.tra-pro-flo-list .swiper-item{height: 100%;background: #fff;margin:0;width:calc(100% - 30px);border-radius:5px;}
.tra-pro-flo-list .swiper-button-wrap{position:absolute;bottom:0;left:0;width:100%;}
.tra-pro-flo-list .swiper-button-next{display:block !important;top: auto;background:#333;width:40px;height:40px;border:none;bottom:0;right:20px;left:auto;position:absolute;border-radius:50%;margin:0;z-index:0;transition:all 0.3s ease-out;box-sizing: border-box;}
.tra-pro-flo-list .swiper-button-next::after{content:none;}
.tra-pro-flo-list .swiper-button-next::before{content:" ";display:block;position:absolute;right:17px;top:50%;width:6px;height:6px;border-bottom:2px solid #fff;border-right:2px solid #fff;transform:rotate(-45deg);margin:-4px 0 0 0;transition:all 0.3s ease-out;}
.tra-pro-flo-list .swiper-button-prev{display:block !important;top: auto;background:#333;width:40px;height:40px;border:none;bottom:0;right:75px;left:auto;position:absolute;border-radius:50%;margin:0;z-index:0;transition:all 0.3s ease-out;box-sizing: border-box;}
.tra-pro-flo-list .swiper-button-prev::after{content:none;}
.tra-pro-flo-list .swiper-button-prev::before{content:" ";display:block;position:absolute;left:17px;top:50%;width:6px;height:6px;border-bottom:2px solid #fff;border-right:2px solid #fff;transform:rotate(135deg);margin:-4px 0 0 0;transition:all 0.3s ease-out;}
.tra-pro-flo-list .swiper-button-next:hover{border:1px #222 solid;background:#222;}  
.tra-pro-flo-list .swiper-button-next:hover::before{border-bottom:2px solid #fff;border-right:2px solid #fff;}
.tra-pro-flo-list .swiper-button-prev:hover{border:1px #222 solid;background:#222;}
.tra-pro-flo-list .swiper-button-prev:hover::before{border-bottom:2px solid #fff;border-right:2px solid #fff;}
.tra-pro-flo-list-box{position: relative;}
.tra-pro-flo-list-hed{text-align: left;padding:0 0 20px;line-height:20px;min-height:20px;font-weight: bold;background: #FFF7F7;position: relative;}
.tra-pro-flo-list-hed::before{content:" ";width:20px;height:20px;background: #fff;position: absolute;bottom:0;left:0;border-radius:10px 0 0 0;transform: translate(0 , 100%);box-shadow: -10px -10px 0 #FFF7F7;}
.tra-pro-flo-list-hed::after{content:" ";width:20px;height:20px;background: #fff;position: absolute;bottom:0;right:0;border-radius:0 10px 0 0;transform: translate(0 , 100%);box-shadow: 10px -10px 0 #FFF7F7;}
.tra-pro-flo-list-box span{width:30px;height:30px;line-height: 30px;background: #000;color:#fff;text-align: center;position: absolute;top:20px;left:20px;border-radius:5px;font-weight: bold;}
.tra-pro-flo-list-box h4{padding:0 10px;min-height: 250px;display: flex;justify-content: center;flex-direction: column;font-size: 20px;font-weight: bold;color:#FF0033;line-height: 1.5;text-align: center;}
.tra-pro-flo-list-box p{text-align: left;font-size:15px;line-height:1.8;padding:0 30px 30px;}
.swiper-horizontal > .swiper-scrollbar{height:2px;overflow:hidden;position:relative;left:auto;bottom:auto;width:calc(100% - 140px);margin:60px 0 0;}
.swiper-scrollbar-drag{display:block !important;overflow: visible;border-radius: 0;background: #000;}
.swiper-scrollbar-drag::before{content:" ";display:block;height:100%;width:9000px;top:0;left:0;transform: translate(-100%,0);background:#000;}
.tra-pro-bel{width:100%;height:320px;background: url("/recruit/renew/img/training/tra_img_bel.jpg") repeat-x;background-size: auto 320px;background-position:0 0;animation-name:beltAct;animation-duration: 24s;animation-iteration-count: infinite;animation-timing-function: linear;}
@media (max-width:1000px) and (min-width:641px){
    .tra-pro-flo-list .swiper-item{width:calc(100% - 15px);}
    .tra-pro-flo-list-box h4{font-size:16px;}
}
@keyframes beltAct{0%{background-position:0 0;}100%{background-position:-1940px 0;}}
@keyframes beltActSp{0%{background-position:0 0;}100%{background-position:-1091px 0;}}
.tra-msg{padding:100px 0 0;}
.tra-msg-hed{display: flex;flex-wrap: wrap;align-items: center;padding:0 0 80px;}
.tra-msg-hed-tit{font-size: 80px;font-weight: bold;font-family:"Poppins", sans-serif;font-weight:600;}
.tra-msg-hed-sub{margin: 0 0 0 auto;font-size: 18px;font-weight: bold;color: #f03;}
.tra-msg-men-list{text-align: left;padding: 0 0 160px;}
.tra-msg-men-list li{position: relative;padding: 0 0 100px;display: grid;grid-template-columns:30% 70%;grid-template-rows: auto 1fr;}
.tra-msg-men-list li:last-child{padding: 0;}
.tra-msg-men-list h4{padding: 0 0 20px 60px;font-size: 24px;line-height: 1.5;font-weight: bold;grid-row: 1 / 2;grid-column: 2 / 3;}
.tra-msg-men-list p{padding: 0 0 0 60px;font-size: 16px;line-height: 2;grid-row: 2 / 3;grid-column: 2 / 3;}
.tra-msg-men-list div{grid-row: 1 / 3;grid-column: 1 / 2;}
.tra-msg-men-list img{width:100%;height:auto;}
.tra-msg-men-list small{display: block;padding: 5px 0 0;}
.tra-msg-aca{position: relative;padding: 0 0 160px;display: grid;grid-template-columns:60% 40%;grid-template-rows: auto 1fr;text-align: left;}
.tra-msg-aca h4{padding: 0 0 60px;font-size: 24px;line-height: 1.5;font-weight: bold;grid-row: 1 / 2;grid-column: 1 / 3;}
.tra-msg-aca p{padding: 0 0 0 60px;font-size: 16px;line-height: 2;grid-row: 2 / 3;grid-column: 2 / 3;}
.tra-msg-aca-mov{grid-row: 2 / 3;grid-column: 1 / 2;}
.tra-msg-aca-mov-wrap{aspect-ratio: 16 / 9;}
.tra-msg-aca-mov-wrap iframe{width: 100%;height: 100%;}
.tra-msg-aca img{width:100%;height:auto;}
.tra-msg-tea{padding:0;}
.tra-msg-tea img{width:540px;display:block;margin:0 0 0 auto;}
.tra-sup{background: #f03;padding:180px 0 180px;color:#fff;}
.tra-sup-hed{padding: 0 0 120px;}
.tra-sup-hed-tit{font-size: 32px;font-weight: bold;padding: 0 0 10px;}
.tra-sup-hed-tit br{display:none;}
.tra-sup-hed-sub{font-size: 16px;line-height: 2;}
.tra-sup-ico{padding: 0 0 120px;}
.tra-sup-ico-tit{font-size: 20px;font-weight: bold;padding: 0 0 30px;}
.tra-sup-ico-list{gap:40px;display: flex;justify-content: center;}
.tra-sup-ico-list li{max-width: 84px;width:20%;position: relative;padding: 0 0 10px;}
.tra-sup-ico-list img{width:100%;height:auto;border-radius:10px;}
.tra-sup-ico-list b{white-space:nowrap;display: block;padding:10px 0 0;}
.tra-sup-ico-list small{white-space:nowrap;display: block;font-size:10px;line-height:10px;position: absolute;bottom:0;left: 50%;transform: translate(-50%, 0);}
.tra-sup-ico-car{padding: 30px 0 0;}
.tra-sup-ico-car img{max-width: 430px;height:auto;width:100%;}
.tra-sup-list{text-align: left;padding:0;}
.tra-sup-list li{position: relative;padding: 0 0 40px;display: grid;grid-template-columns:30% 70%;grid-template-rows: auto 1fr;}
.tra-sup-list li:last-child{padding:0;;}
.tra-sup-list h4{padding: 0 0 20px 60px;font-size: 24px;line-height: 1.5;font-weight: bold;grid-row: 1 / 2;grid-column: 2 / 3;}
.tra-sup-list p{padding: 0 0 0 60px;font-size: 16px;line-height: 2;grid-row: 2 / 3;grid-column: 2 / 3;}
.tra-sup-list div{grid-row: 1 / 3;grid-column: 1 / 2;}
.tra-sup-list img{width:100%;height:auto;border-radius:10px;}
@media (max-width:640px){
    .tra-dat{padding: 10% 0 20%;}
    .tra-dat-tit{padding: 0 0 20px;font-size: 18px;}
    .tra-dat-list{display: block;}
    .tra-dat-list li{padding:20px 0 20px 20px;width:100%;border-radius: 10px;display: grid;grid-template-columns:45% 55%;}
    .tra-dat-list li + li{margin:15px 0 0;}
    .tra-dat-list h3{font-size: 16px;padding:0;grid-row: 1 / 2;grid-column:1 / 2;text-align: left;min-height: 30px;line-height: 30px;}
    .tra-dat-list p{font-size: 12px;line-height: 1.5;padding:0;text-align:center;letter-spacing: 0;grid-row: 2 / 3;grid-column:1 / 2;text-align: left;}
    .tra-dat-list p br{display:none;}
    .tra-dat-list div{grid-row:1 / 3;grid-column:2 / 3;}
    .tra-dat-list div strong{font-size:60px;}
    .tra-dat-list div em{font-size:16px;}
    .tra-dat-list div b{font-size:20px;}
    .tra-pro{padding: 15% 0 0;}
    .tra-pro-hed{display: block;text-align: left;align-items: center;padding: 0 0 40px;}
    .tra-pro-hed-tit{font-size: 45px;}
    .tra-pro-hed-sub{font-size: 15px;}
    .tra-pro-men{padding:0 0 20%;}
    .tra-pro-men-list{display: block;}
    .tra-pro-men-list li{width:100%;padding:0 0 10%;}
    .tra-pro-men-list li:last-child{padding:0;}    
    .tra-pro-men-list h4{padding: 15px 0 0;}
    .tra-pro-flo{margin:0 auto 20%;}
    .tra-pro-flo h3{font-size: 24px;padding: 0 0 30px;}
    .tra-pro .swiper{padding:0 0 15px;}
    .tra-pro-flo-list .swiper-item{width: calc(100% - 20px);}
    .tra-pro-flo-list-hed{padding: 0 0 15px;}
    .tra-pro-flo-list-box p{padding: 0 20px 20px;}
    .tra-pro-flo-list-box span{top:10px;left:10px;}
    .tra-pro-flo-list-box h4{min-height:180px;font-size:18px;}
    .tra-pro-flo-list-box p{line-height:1.5;}
    .tra-pro-flo-list .swiper-button-next{width:30px;height:30px;right:0;}
    .tra-pro-flo-list .swiper-button-next::before{right:13px;}
    .tra-pro-flo-list .swiper-button-prev{width:30px;height:30px;right:43px;}
    .tra-pro-flo-list .swiper-button-prev::before{left:13px;}
    .swiper-horizontal > .swiper-scrollbar{width: calc(100% - 90px);margin: 40px 0 0;}
    .tra-pro-bel{width:100%;height:180px;background: url("/recruit/renew/img/training/tra_img_bel.jpg") repeat-x;background-size: auto 180px;background-position:0 0;animation-name:beltActSp;animation-duration: 24s;animation-iteration-count: infinite;animation-timing-function: linear;}    
    .tra-msg{padding: 15% 0 0;}
    .tra-msg-hed{display: block;text-align: left;align-items: center;padding: 0 0 40px;}
    .tra-msg-hed-tit{font-size: 45px;}
    .tra-msg-hed-sub{font-size: 15px;}
    .tra-msg-men-list{padding: 0 0 20%;}
    .tra-msg-men-list li{display: block;padding: 0 0 15%;}
    .tra-msg-men-list h4{padding:25px 0 0;font-size:18px;}
    .tra-msg-men-list p{padding:5px 0 0;}
    .tra-msg-men-list small{font-size: 14px;}
    .tra-msg-aca{padding: 0 0 15%;}
    .tra-msg-aca h4{padding:0 0 20px;font-size: 18px;}
    .tra-msg-aca{display: block;}
    .tra-msg-aca p{padding:20px 0 0;}
    .tra-msg-tea img{width:100%;}
    .tra-sup{padding:15% 0 20%;}
    .tra-sup-hed{padding: 0 0 10%;}
    .tra-sup-hed-tit{font-size: 20px;}
    .tra-sup-hed-tit br{display:inline;}
    .tra-sup-hed-sub{text-align: left;}
    .tra-sup-ico{padding: 0 0 20%;}
    .tra-sup-ico-tit{font-size: 18px;}
    .tra-sup-ico-list{flex-wrap: wrap;gap:0;}
    .tra-sup-ico-list li{width: 38%;max-width: none;padding: 0 15px 42px;box-sizing: border-box;}
    .tra-sup-ico-list small{bottom:30px;}
    .tra-sup-ico-car img{width:80%;}
    .tra-sup-list li{display: block;padding: 0 0 15%;}
    .tra-sup-list h4{padding:25px 0 5px;font-size: 18px;}
    .tra-sup-list p{padding:0;}
}