﻿/* .emp {} */
.emp {background-color: #1d1d29;font-family:Freesentation; }
.emp.emp_06 .hero, .emp.emp_07 .hero, .emp.emp_08 .hero {background-color: #1d1d29 ;width:100%;position:relative;overflow:hidden;}
.emp .hero_wrapper {display:flex;justify-content: center;align-items: center;margin: 0 auto;width:100%;max-width:600px;position:relative;z-index:3;}

.emp .hero .gif {max-width:50%;/* transform: rotateZ(-44deg); */}
.emp .hero h2 {width:50%;transform:scale(1.05);}
.emp .hero .title {width:100%;margin:0 auto;}
.emp .hero .wrapper {background-color: #111119;padding:18% 2% 18% 4%;overflow:hidden;border-radius: 0 0 40px 40px;}
.emp .hero .text_wrapper {width:100%;height:100%;position:absolute;top:0;left:0;z-index:1;overflow:hidden;border-radius: 0 0 40px 40px;background-color:transparent;}
.emp .back_text {position:absolute;z-index:2;font-weight: 900;font-size: 106px;letter-spacing:-4px;color: rgba(255,255,255,0.02);text-transform:uppercase;left:50%;transform:translateX(-50%);overflow:hidden;width: 100%;text-align:center;}
.emp .back_text.text01 {top:-45px;}
.emp .back_text.text02 {bottom:-52px;}
.emp .hero .overlay {position:absolute;height:60px;width:100%;bottom:10px;left:0;z-index:}

.emp main {display:flex;justify-content: center;flex-wrap:wrap;flex-direction: column;padding:8% 5% 20% 5%;position:relative;z-index:2;background-color: #1d1d29;}
.emp main div img {display:block;margin: 0 auto;max-width:100%;}
.emp main div img.sm , .emp img.sm {max-width:70%}
.emp main div img.ttl {max-width:70%}
.emp .div, .emp .img {display:block;margin:0 auto;max-width:100%}
.emp main div {position:relative;z-index:2;}
.emp main div img.num {width:50%;position:absolute;z-index:1;top:0;left:50%;transform:translate(-50%, -41%);}

.mt-3 {margin-top:-3% !important;}
.mt2 {margin-top:2% !important;}
.mt3 {margin-top:3% !important;}
.mt4 {margin-top:4% !important;}
.mt5 {margin-top:5% !important;}
.mt6 {margin-top:6% !important;}
.mt7 {margin-top:7% !important;}
.mt8 {margin-top:8% !important;}
.mt9 {margin-top:9% !important;}
.mt10 {margin-top:10% !important;}
.mt12 {margin-top:12% !important;}
.mt15 {margin-top:15% !important;}
.mt20 {margin-top:20% !important;}
.mt30 {margin-top:30% !important;}

.w30 {width:30%;}
.w40 {width:40%;}
.w50 {width:50%;}
.w60 {width:60%;}
.w70 {width:70%;}
.w80 {width:80%;}
.w85 {width:85%;}
.w90 {width:90%;}
.w100 {width:100%;}

.des-icon {width:32% !important;}
.ok-icon {width:9% !important;margin-top:-1% !important;}
.mo-icon {width:32% !important;}
.emp-div {width:10% !important;}
.des-icon {width:32% !important;}
.web-icon {width:9% !important;}
.heart-icon {width:9% !important;}
.vfx-icon {width:54% !important;}
.laugh-icon {width:9% !important;}
.uiux-icon {width:23% !important;}
.inter-icon {width:20% !important;}
.aa-icon {width:9% !important;}
.hdes-icon {width:52% !important;}
.plus-icon {width:7% !important;}
.emp_08 .plus-icon {width:8% !important;}

.emp_ser {padding:15% 0 15% 0;background-image: url('/2022/img/employ/m/emp_06_service_bg_m.png');background-repeat: no-repeat;background-position: center; background-size: 100% 100%;}
.emp_ser .cards_wrapper {display:flex;justify-content:center;flex-direction:column;flex-wrap:wrap;align-items:center;margin-top:10%;}
.emp_ser .cards_wrapper div {position:relative;overflow:hidden;max-width:90%;margin-bottom:20px;}
.emp_ser .cards_wrapper div img {display:block;margin: 0 auto;width:100%;}
.emp_cour .ttl {max-width:50%}
.emp_cour {padding:15% 0 15% 0;background-color: #1d1d29;}
.emp_cour .icons_wrapper {display:flex;justify-content:flex-start;flex-wrap:wrap;flex-direction:row;width:90%;margin: 0 auto;margin-top:12%;position:relative;}
.emp_cour .icons_wrapper .star {position:absolute;transition: .1s all ease;animation: star 1s .5s infinite;} 
.emp_cour .icons_wrapper .star01 {top: -80px ;left: 15px;width:10px;height:10px;} 
.emp_cour .icons_wrapper .star02 {top: -60px ;left:50px;width:20px;height:20px;} 
.emp_cour .icons_wrapper .star03 {top: -40%;right:0;animation: star01 2s 1s infinite;width:30px;height:30px;} 
.emp_cour .icons_wrapper .star04 {width:12% !important;bottom: -17% ;right: 0%;animation: star02 5s .5s infinite;} 
.emp_cour .icons_wrapper .div {transition: .1s all ease;margin-bottom:20px;margin-left:2%;cursor:pointer;}
.emp_cour .icons_wrapper .div.no-click {cursor:auto; }
.emp_cour .icons_wrapper .div:has(img:not(.star)) {animation: icons 3s .5s infinite; width:100%;}
.emp_cour .icons_wrapper .div:has(img:not(.star)) img {width:100%;margin: 0 auto;display:block;}
.emp_cour .icons_wrapper .div .aa {object-fit: cover;transform: scale(1.4);}

.emp_05 {background:#ffffff;padding-bottom:15%;font-family:Freesentation;}
.emp_05 .hero {background-image: url('/2022/img/employ/emp_05_hero.png');background-repeat: no-repeat;background-position: center; background-size: 100% 100%;padding:18% 2% 20%;color:#ffffff;text-align:center;}
.emp_05 h2 {margin-bottom:4%;font-family: Noto Sans CJK;font-size: 26px;font-weight: 700;line-height:34px;letter-spacing: -2px;}
.emp_05 h3 {font-size: 14px;font-weight: 400;}
.emp_05 h4 {color: #252525;font-weight:700;font-size:24px;line-height:30px;}
.emp_05 h5 {color: #0668b2;font-weight:600;font-size:14px;}
.emp_05 p {font-weight:300;font-size:14px;color:#959595;}
.emp_05 .pgs {width:100%;}
.emp_05 .pgs_wr {/* width:100%;display:flex;justify-content:flex-start;flex-wrap:wrap;flex-direction:row; */}
.emp_05 .pg {width:80%;height:350px;background-repeat: no-repeat;background-position: center; background-size: cover;border-radius:15px;padding:8% 0 0 6%;margin: 0 2% 2% 0;}
.emp_05 .pg_01 {background-image: url('/2022/img/employ/emp_05_page01.png');}
.emp_05 .pg_02 {background-image: url('/2022/img/employ/emp_05_page02.png');}
.emp_05 .pg_03 {background-image: url('/2022/img/employ/emp_05_page03.png');}
.emp_05 .pgs_wr h6 {font-weight:600;font-size:20px;color: #ffffff;margin-bottom:3%;line-height:26px;}
.emp_05 .pgs_wr p {font-weight:500;font-size:13px;color: #ffffff;}
/* .emp_05 .cur_wr {width:100%;display:flex;justify-content:flex-start;flex-wrap:wrap;flex-direction:row;margin: 3% auto 0 auto;}
.emp_05 .cur {width:33.33%;height:130px;background-repeat: no-repeat;background-position: center; background-size: 100% 100%;border-radius:15px;display:flex;justify-content:center;align-items: center;}
.emp_05 .cur_01 {background-image: url('/2022/img/employ/emp_05_cur01.png');}
.emp_05 .cur_02 {background-image: url('/2022/img/employ/emp_05_cur02.png');}
.emp_05 .cur_03 {background-image: url('/2022/img/employ/emp_05_cur03.png');}
.emp_05 .cur_04 {background-image: url('/2022/img/employ/emp_05_cur04.png');}
.emp_05 .cur_05 {background-image: url('/2022/img/employ/emp_05_cur05.png');}
.emp_05 .cur_wr h6 {font-weight:700;font-size:14px;text-align:center;color:#ffffff;} */
.emp_05 main {padding:0 10px;overflow-x: hidden;}
.emp_05 .hash {color: #0668b2;font-weight:600;font-size:14px;}

.emp_07 .circle02 {width: 67% !important;margin-top:-4.5% !important;}
.emp_07 .emp_cour, .emp_08 .emp_cour {background-color: #111119;}
.emp.emp_07 .hero .gif {width: 44%;}
.emp.emp_07 .hero h2 {width:55%;transform:scale(1.05);}

/* .emp_nav {display:flex;width:100%;justify-content:center;margin: 0 auto;}
.emp_nav a {display:block;text-decoration:none;color: rgba(255,255,255,0.6);position:relative;font-size:14px;margin-right:5%;}
.emp_nav a:last-of-type {margin-right:0px !important;}
.emp_nav a:after {position:absolute;bottom:-5px;left:50%;transform:translateX(-50%);content: '';width:110%;height:1px;background: #8e8e94;}
.emp_nav a.on {color:#ffffff;} */

/* .emp_nav {display:flex;width:100%;justify-content:center;margin: 0 auto;}
.emp_nav a {display:block;text-decoration:none;color: rgba(255,255,255,0.6);padding:2% 2%; border: 1px solid rgba(255,255,255,0.3);border-radius: 22px;position:relative;background-color:transparent;font-size:13px;margin-right:1.5%;width:34%;text-align:center;}
.emp_nav a:last-of-type {margin-right:0px !important;}
.emp_nav a.on {border: 1px solid rgba(255,255,255,0.5);background-color: #111119;color: #daf560;font-weight:500;} */

.emp_nav {display:flex;width:100%;justify-content:center;margin: 0 auto;border-top: 1px solid rgba(17, 17, 25,0.3);}
.emp_nav a {display:block;text-decoration:none;margin-right:1.5%;font-size:13px;color: rgba(17, 17, 25,0.8);padding: 2%;position:relative;background-color:transparent;width:34%;text-align:center;transition: 0.5s color ease;}
.emp_nav a:last-of-type {margin-right:0px !important;}
.emp_nav a:hover,  .emp_nav a.on {font-weight:600;color: #111119;transition: 0.5s color ease;}

/* Shine */
.emp_ser .cards_wrapper div:after {
  content: "";
  position: absolute;
  top: -30%;
  left: -200%;
  width: 20%;
  height: 200%;
  opacity: 0;
  transform: rotate(-30deg);
  background: rgba(255, 255, 255, 0.13);
  background: linear-gradient( to left, rgba(255, 255, 255, 0.13) 0%, rgba(255, 255, 255, 0.13) 77%, rgba(255, 255, 255, 0.3) 92%, rgba(255, 255, 255, 0.00) 100%);
  animation: shine 2.5s 0.5s infinite;
  box-shadow: rgba(255, 255, 255, 0.3) 0px 7px 29px 0px;
}

@keyframes shine {  to {opacity: 1;left: 210%;} }
@keyframes star01 { 0% {transform: scale(0) rotate(0)} 50% {transform: scale(1) rotate(180deg)} 100% {transform: scale(0) rotate(0)} }
@keyframes star02 { from { transform: scale(0) } to {transform: scale(1)} }
@keyframes star { from { transform: rotate(0) scale(0) } to {transform: rotate(180deg) scale(1.3)}}
@keyframes icons { 0% { transform: translate(0, 0)  } 50% { transform: translate(0, 5px) } 100% { transform: translate(0, 0)  } }



@media(max-width: 500px) {
	.emp .hero .wrapper {padding: 90px 10px 90px 30px;}
	.emp .back_text {/* font-size:90px; */font-size:90px;bottom:-40px;}
	.emp .back_text.text02 {bottom:-45px;}
	.emp .back_text.text01 {top:-40px;}
}

@media(max-width: 420px) {
	.emp_nav a {font-size:13px;padding:1% 2%;}
	.emp .back_text {font-size:72px;}
	.emp .back_text.text02 {bottom:-40px;}
	.emp .back_text.text01 {top:-33px;}
	.emp .hero .wrapper {padding: 80px 10px 80px 30px;}
}