@charset 'utf-8';
/* company */
.company-logo { display: block; width: 200px; margin: 0 auto; } 
.company-int { padding: 1.5rem 0px; } 
.company-int li { font-size: 20px; line-height: 1.6; padding-bottom: 1rem; color: #133269; } 
.company-int li span { font-weight: var(--font-bold); } 

.ceo-set { display: flex; flex-flow: row wrap; justify-content: flex-end; margin-top: 2.5rem; } 
.ceo-set .ceo-text { display: flex; flex-flow: column wrap; } 
.ceo-set .ceo-text span { font-size: 1rem; margin-top: auto; text-align: right; } 
.ceo-set .ceo-text .name { font-size: 2rem; font-weight: var(--font-bold); text-align: right; } 
.ceo-set .ceo-photo { margin: 0px; display: block; width: 160px; } 


.cont-img { width: 100%; margin: 0 auto; margin-bottom: 30px; } 


/* Service */
.service-pack{width: 100%; margin-bottom: 40px; flex-wrap: wrap; gap: 24px;}
.service-pack .service{background-color: var(--bg-white-1); flex:1 0 calc(50% - 12px); overflow: hidden; border-radius: 8px;}
.service-pack .service-header{width: 100%; height: 330px; margin-bottom: 1.25rem; background-position: center center; background-size: cover;}

.service-pack .service-header .contents{opacity:0; background-color: rgba(0, 0, 0, 0.75); width: 100%; height: 100%; padding: 40px 16px 16px; transition: opacity 0.3s;}
.service-pack .service-header:hover .contents{opacity:1; z-index: 10;}
.service-pack .service-header .contents *{color: var(--bg-white-1); font-size: 12px; text-align: left; line-height: 1.4;}
.service-pack .service-header .contents .card-title{font-weight: var(--font-bold); margin-top: 32px; padding-bottom: 4px;}
.service-pack .service-header .contents .card-text{margin-bottom: 8px;}
.service-pack .service-header .contents .card-summary{font-size: 8px; letter-spacing: -0.8px;}


.service-pack .service-body{height: 156px;}
.service-pack .service-body .tag{display: block; line-height: 20px; margin: 0 auto 16px; width: 60px; height: 20px; color: #949494; border: 1px solid #949494; border-radius: 10px; text-align: center; font-size: 12px;}
.service-pack .service-body .tag.hi{color: #ffffff; font-weight: bold; background-color: var(--color-main); border: none;}
.service-pack .service-body .text{font-size: 12px; line-height: 140%; letter-spacing: -0.2px ;text-align: center; padding: 0px 16px 1.25rem; word-break: keep-all;}



.service-header.service-1{background-image: url('../img/service/service-1.jpg');}
.service-header.service-2{background-image: url('../img/service/service-2.jpg');}
.service-header.service-3{background-image: url("../img/service/service-3.png");}
.service-header.service-4{background-image: url("../img/service/service-4.png");}
.service-header.service-5{background-image: url("../img/service/service-5.png");}
.service-header.service-6{background-image: url("../img/service/service-6.png");}
.service-header.service-7{background-image: url("../img/service/service-7.png");}

/* Recrute */
.rec-guide {display: flex; flex-flow: column; margin-top: 60px; gap: 4rem;}
.rec-guide .rec-pack{display: flex; justify-content: space-between; align-items: flex-start; gap: 2rem;}
.rec-guide .rec-pack .rec-box {flex: 1 0 176px; height: 64px; border-radius: 32px; text-align: center; display: flex; flex-flow: column wrap; justify-content: center; gap: 4px; margin-top: 0px; color: var(--bg-white-1); font-weight: var(--font-bold);}
.rec-guide .rec-pack .rec-box span{font-weight: var(--font-regular);}
.rec-guide .rec-pack .rec-content {display: flex; flex-flow: column wrap; gap: 16px;}
.rec-guide .rec-pack .rec-content dt{font-weight: var(--font-bold); letter-spacing: -1px;}
.rec-guide .rec-pack .rec-content dd{letter-spacing: -1px;}

.rec-fam{display: flex; flex-flow: column;}
.rec-fam .text{margin-bottom: 2.5rem; letter-spacing: -1px; line-height: 1.4;}

.rec-rull{display:flex; align-items:flex-start; padding-bottom: 40px; margin-bottom:40px; gap: 32px; border-bottom: 1px solid var(--border-1);}

.rec-rull .rull-title{font-size: 1.25rem; color: var(--color-point); font-weight: var(--font-bold); letter-spacing: -1px; flex: 0 0 72px;}
.rec-rull .rull-text p{font-size: 1rem; margin-bottom: 2rem; line-height: 1.4; flex: 1;}
.rec-rull .rull-text p:last-of-type{margin-bottom: 0px;}

.rec-rull-fin .rull-title{color: var(--color-main); letter-spacing: -1px; text-align: center; margin: 80px auto; line-height: 1.6;}
.rec-rull-fin .rull-text{display: flex; flex-flow: row wrap; justify-content: center; gap: 32px;}
.rec-rull-fin .rull-text .button{flex: 1 1 auto;}
.rec-rull-fin .rull-text .summary{flex: 1 0 100%; font-size: 0.75rem;}

/* board */
.nav-board{display: flex; margin: 1rem 0px 1rem;}
.nav-board .nav-board-item{cursor: pointer; color: var(--color-main); padding: 1rem 2rem;}
.nav-board .nav-board-item.active{cursor: pointer; font-weight: bold; background-color: var(--color-main); color: white;}
.nav-board .nav-board-item:hover{font-weight: bold; background-color: var(--color-point); color: white;}
.nav-board .nav-board-item:last-of-type:after{content: '';}
.sub.board{display: none; justify-content: center; align-items: center; height: 100%; padding-top: 2rem; background-color: #f3f3ff;}
.sub.board iframe{background-color: #f3f3ff;}
.sub.board.active{display: flex;}