@charset "utf-8";
/* Loading */
.loading{position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 99999; background: url("../img/common/bg.jpg"); line-height: 1;}
.loading-logo{position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);}
.loading-mask{position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(to bottom, #00458D, #002246); transform: translateY(100%); transition: 1s;}
.loading-mask.is-show{transform: translateY(0);}
.loading.is-hide{transform: translateY(-100%); transition: 1s;}

body.homepage{color: #00458d;}
body.h-fixed{height: 100vh; overflow: hidden;}
body.h-fixed header{opacity: 0;}
header{opacity: 1; transition: 1.5s ease .5s;}

@media (max-width: 767px){
	.loading{background-size: 22px auto;}
}

/* Hero */
.hero{position: relative; height: calc(200vh + 380px); margin: 0 0 250px;}
.hero-img{width: 100%; height: 100vh; position: absolute; left: 0; right: 0; top: 0; margin: 0 auto; transition: 1s; z-index: 1;}
.hero-inner{max-width: 1004px; width: 80%; margin: 0 auto; position: absolute; top: 150px; left: 0; right: 0; z-index: 10;}
.hero-tit{margin: 0 0 16px; opacity: 0; transition: 3s ease 1s !important;}
.hero-txt{font-size: 2.4rem; line-height: 1.67; font-weight: bold; font-family: 'Zen Kaku Gothic New', sans-serif; opacity: 0; transition: 2.5s ease 1.5s !important;}

.intro{min-height: 100vh; position: absolute; bottom: 0; left: 0; width: 100%; z-index: 100; padding: 0 0 200px;}
.intro:before{content: ''; position: absolute; top: 0; left: 50px; right: 50px; bottom: 0; background: rgba(255,255,255,.76); border-radius: 100px; z-index: -1;}
.intro-building{position: absolute; top: -125px; right: 100px;}
.intro-candidate{position: absolute; bottom: -250px; left: 0; z-index: 10; width: 60%;}
.intro-tit{font-weight: 300; font-family: 'Zen Kaku Gothic New', sans-serif;}
.intro-txt{font-weight: 500;}

.hero .car1,
.hero .car2{position: absolute; z-index: 1; opacity: 0; transition: 1.2s linear 0.8s;}
.hero .car1{top: 340px; left: 37%; transform: rotate(-20deg);}
.hero .car2{top: 670px; right: 10px; transform: rotate(10deg);}

.hero.is-show .car1,
.hero.is-show .car2{opacity: 1;}

@media (min-width: 768px){
    .intro-inner{text-align: center;}
	.intro-tit{padding: 50px 80px 40px; max-width: 1160px; margin: 0 auto; font-size: min(5.6vw,5.6rem); line-height: 1.57; letter-spacing: 0.1em;}
	.intro-txt{display: inline-block; text-align: left;}
	.intro-txt p:not(:last-of-type){padding-bottom: 1em;}
	.hero-img{background: url("../img/top/hero-img.jpg") no-repeat top center/cover;}
	
	.hero.is-show .hero-img{border-radius: 100px; width: calc(100% - 100px); top: 380px;}
	
	.hero .lineD-green1{top: -19px; left: 38%;}
	.hero .lineD-green2{top: -47px; left: 76%;}
	.hero .lineD-yellow1{top: 310px; left: 50%;}
	.hero .lineD-yellow2{top: 800px; right: 2.4%;}
	.hero .lineD-pink{top: -80px; left: 11%;}
	.hero .linelD-green{top: 160px; right: -38px;}

	.hero .lineL-lblue1{top: -120px; left: 68.75%; width: 177px; height: 177px;}
	.hero .lineL-lblue2{top: 720px; left: -153px; width: 189px; height: 189px;}
	.hero .lineL-lblue3{top: 340px; right: -100px;}

	.hero .lineL-blue1{top: 750px; left: 20.3%; width: 137px; height: 137px;}
	.hero .lineL-blue2{top: 115px; left: -140px;}
	.hero .lineL-blue3{bottom: -45px; left: 58%; width: 137px; height: 137px;}

	.hero .line2-green{top: -25px; left: 60%;}
	.hero .lineS-lblue{top: 90px; left: 48.6%;}
	.hero .lineS-dblue1{top: 370px; left: 15%;}
	.hero .lineS-dblue2{top: -30px; right: calc(9% + 500px);}
	.hero .lineS-pink{top: 345px; left: 62%;}
	.hero .lineS-purple{top: 360px; right: 25px;}
	.hero .lineS-yellow{bottom: -130px; left: 72%;}

	.hero .lineL-yellow1{top: 180px; left: -180px;}
	.hero .lineL-yellow2{top: 275px; left: 43%;}
	.hero .lineL-yellow3{top: 350px; right: -10px; width: 137px; height: 137px;}
	.hero .lineL-yellow4{top: 600px; left: -20px; width: 137px; height: 137px;}

	.hero .lineR-blue{top: 310px; right: 160px;}
	.hero .lineR-lblue{top: -125px; left: 21%;}
}

@media (max-width: 767px){
	.hero{height: calc(200vh + 330px); margin: 0 0 200px;}
	.hero-inner{top: 135px; width: 100%;}
	.hero-tit{text-align: center;}
	.hero-txt{text-align: center; font-size: 2rem;}
	.hero-img{background: url("../img/top/hero-img_sp.jpg") no-repeat top center/cover;}
	.hero.is-show .hero-img{border-radius: 64px; width: 100%; top: 330px;}
	
	.intro{padding: 50px 30px 100px;}
	.intro:before{left: 0; right: 0; border-radius: 64px;}
	.intro-building{max-width: 340px; width: 94%; left: 0; right: 0; margin: 0 auto; top: -87px; height: 87px; display: flex; align-items: flex-end;}
	.intro-candidate{width: 265px; bottom: -140px;}
	.intro-tit{font-size: min(7vw,3rem); line-height: 1.5; max-width: 340px; margin: 0 auto 20px;}
	.intro-txt{font-size: min(3.5vw,1.4rem); line-height: 2; max-width: 340px; margin: 0 auto;}
	
	.hero .car1,
	.hero .car2{width: 84px;}
	.hero .car1{top: 315px; left: -5px;}
	.hero .car2{top: calc(200vh + 150px); right: -10px;}
	
	.hero .lineD-green1{top: 50px; right: -50px;}
	.hero .lineD-green2{top: 360px; right: -50px;}
	.hero .lineS-purple{top: 400px; right: 70px;}
	.hero .lineS-purple2{top: 315px; right: 50px;}
	
	.hero .lineS-lblue{top: 85px; left: 30px;}
	.hero .lineS-dblue1{top: 79px; right: 120px;}
	.hero .lineL-blue3{bottom: -280px; left: -65px;}
	.hero .lineL-green{bottom: -100px; right: -30px;}
	
	.hero .lineL-yellow1{top: 195px; left: -35px;}
	.hero .lineL-yellow2{top: 120vh; left: -45px;}
	.hero .lineL-lblue1{top: -60px; left: 60%;}
	.hero .line2-green{top: 80px; right: -75px;}
	.hero .lineR-green{top: 350px; right: -5px;}
	
	.hero .lineM-green{top: 113vh; left: -35px;}
}

.hero.is-show .hero-tit{opacity: 1;}
.hero.is-show .hero-txt{opacity: 1;}

.hero.is-fixed .hero-img{position: fixed; top: auto; bottom: 0;}
.hero.not-fixed .hero-img{top: auto; bottom: 0; position: absolute;}

/* Top Common */
.container{position: relative;}

.t-btn{max-width: 230px; width: 100%;}
.t-btn a{height: 64px; width: 100%; border-radius: 64px; border: 2px solid #00458d; color: #00458d; background: #fff; position: relative; display: flex; align-items: center; padding: 0 28px; letter-spacing: 0.1em; font-size: 2rem; line-height: 1.3; font-weight: bold; font-family: 'Zen Kaku Gothic New', sans-serif; overflow: hidden; z-index: 10;}
.t-btn a:after{content: ''; position: absolute; top: 50%; right: 26px; width: 7px; height: 12px; display: block; margin-top: -6px; transition: .4s cubic-bezier(0.23, 1, 0.32, 1); will-change: transform; background: #00458d;
mask: url("../img/common/ic-arrow.svg") no-repeat right center/100% auto; -webkit-mask: url("../img/common/ic-arrow.svg") no-repeat right center/100% auto;}
.t-btn a:before{content: ''; width: 100%; height: 100%; top: 0; left: -115%; position: absolute; background: #e6ff1d; transition: all .8s cubic-bezier(0.23, 1, 0.32, 1); transform: scale(1.2); border-radius: 64px; z-index: -1;}
.t-btn a:hover:before{left: 0;}
.t-btn a:hover:after{transform: scale(1.2); right: 23px;}

@media (max-width: 767px){	
	.t-btn{margin: 30px auto 0;}
	.t-btn a{font-size: 1.6rem; height: 48px; border-radius: 48px;}
	.t-btn a:before{border-radius: 48px;}
}

.t-lbtn:before{content: ''; width: 100%; height: 1px; background: url("../img/common/dash.png") repeat-x bottom left/auto 100%; display: block;}
.t-lbtn li{background: #fff;}
.t-lbtn li:after{content: ''; width: 100%; height: 1px; background: url("../img/common/dash.png") repeat-x bottom left/auto 100%; display: block;}

.t-lbtn a{height: 120px; width: 100%; display: flex; align-items: center; position: relative; padding: 0 90px 0 20px; font-size: 2.4rem; line-height: 1.3; letter-spacing: 0.1em; font-weight: bold; font-family: 'Zen Kaku Gothic New', sans-serif; overflow: hidden; z-index: 10;}
.t-lbtn a:after{content: ''; width: 56px; height: 56px; background: url("../img/common/ic-circle-arrow.svg") no-repeat top left/100% 100%; position: absolute; top: 50%; right: 15px; margin-top: -28px; transition: .4s cubic-bezier(0.23, 1, 0.32, 1); will-change: transform;}
.t-lbtn a:before{content: ''; width: 100%; height: 100%; top: 0; left: -115%; position: absolute; background: #e6ff1d; transition: all .8s cubic-bezier(0.23, 1, 0.32, 1); transform: scale(1.2); border-radius: 120px; z-index: -1;}
.t-lbtn a:hover:before{left: 0;}
.t-lbtn a:hover:after{background: url("../img/common/ic-circle-arrow_yellow.svg") no-repeat top left/100% 100%; transform: scale(1.15);}
.t-lbtn a.exlink:after{background: url("../img/common/ic-circle-exlink.svg") no-repeat top left/100% 100%;}
.t-lbtn a.exlink:hover:after{background: url("../img/common/ic-circle-exlink_yellow.svg") no-repeat top left/100% 100%;}

@media (max-width: 767px){
	.t-lbtn{margin: 30px auto 0;}
	.t-lbtn a{height: 90px; padding: 0 0 0 15px; font-size: min(5vw,2rem);}
	.t-lbtn a:after{width: 48px; height: 48px; margin-top: -24px;}
}

/* Company */
.company{position: relative;}
.company-img img{object-fit: cover; width: 100%; object-position: center;}
.company-inner{position: relative;}
.company-illus{position: absolute; bottom: 0; left: 0; width: 100%;}
.company .t-lbtn{position: relative; z-index: 10;}

@media (min-width: 768px){
    .company{display: flex; justify-content: flex-end; margin: 0 0 100px; padding: 0 0 30px;}
	.company-img{width: calc(50% - 180px); margin: 0 0 0 110px; position: relative;}
	.company-img figure{overflow: hidden; border-radius: 64px 0 0 0; position: relative; z-index: 6;}
	.company-img img{height: 552px;}
	.company-img .line{z-index: 7;}
	.company-inner{width: 570px;}
	.company-inner h2{margin: 70px 0 80px;}
	
	.company .lineR-green{top: -30px; left: 450px; width: 174px; height: 175px;}
	.company .lineL-yellow{top: 350px; left: -120px;}
	.company .lineD-blue{top: -76px; right: 7px;}
	.company .lineD-blue2{bottom: -80px; left: 45px;}
}

@media (max-width: 1060px) and (min-width: 768px){	
	.company-img{width: 36%; margin: 0 0 0 30px;}
	.company-inner{width: calc(64% - 60px);}
	.company-illus{width: calc(64% - 60px);}
}

@media (max-width: 767px){
	.company{margin: 0 0 80px;}
    .company-img{width: calc(100% - 30px); border-radius: 32px 0 0 0; margin: 0 0 0 30px; overflow: hidden;}
	.company-img img{height: 200px;}
	.company .t-lbtn{width: calc(100% - 60px);}
	
	.company .lineL-yellow{top: -15px; left: 50%;}
	.company .lineS-blue{bottom: -50px; right: 100px;}
}

/* Jobs */
.jobs{margin: 0 0 100px; position: relative;}
.jobs-wrap{position: relative; max-width: 1280px; margin: 0 auto;}
.jobs-slider{position: relative;}

.jobs-slide_inner{font-weight: 500; line-height: 1.5;}
.jobs-slide_num{position: absolute; z-index: 15;}
.jobs-slide_photoN{width: 76%; margin: 0 0 0 15%; border: 8px solid #fff; border-radius: 64px; box-shadow: 8px 8px 3px 0px rgba(0, 0, 0, 0.06); overflow: hidden; background: #e6ff1d;}
.jobs-slide_photo{width: 76%; margin: 0 0 0 15%; border: 8px solid #fff; border-radius: 64px; box-shadow: 8px 8px 3px 0px rgba(0, 0, 0, 0.06); overflow: hidden; background: #e6ff1d; position: absolute; top: 140px; left: 0; z-index: 10;}
.jobs-slide_photo img{transition: opacity .5s;}
.jobs-slide_pos{margin: 0 0 10px;}
.jobs-slide_pos span{display: block; opacity: 0; transform: translateY(15px);}
.jobs-slide_pos:after{content: ''; width: 0; height: 1px; background: url("../img/common/dash.png") repeat-x bottom left/auto 100%; display: block; margin-top: 13px;}
.jobs-slide_mess{font-size: min(2.5vw,2.4rem); line-height: 1.6; font-weight: bold; font-family: 'Zen Kaku Gothic New', sans-serif; letter-spacing: 0.1em; margin: 0 0 30px; opacity: 0; transform: translateY(15px);}
.jobs-slide a:hover .jobs-slide_photo img{opacity: 0.76;}
.jobs-slide_name{opacity: 0;}

.jobs-slider .swiper-slide-active .jobs-slide_pos span,
.jobs-slider .swiper-slide-active .jobs-slide_mess{opacity: 1; transform: translateY(0); transition: .5s ease 1.2s;}
.jobs-slider .swiper-slide-active .jobs-slide_name{opacity: 1; transition: .5s ease 1.2s;}
.jobs-slider .swiper-slide-active .jobs-slide_pos:after{width: 100%; transition: .5s ease 1s;}

.jobs-slider .swiper-slide-prev .jobs-slide_inner{visibility: hidden;}
.jobs-slider .swiper-slide-active .jobs-slide_inner{visibility: visible !important;}

.jobs-slider .swiper-slide-prev{animation: slickStarted 1s forwards; opacity: 1; z-index: 1000;}
.jobs-slider .swiper-slide-prev .jobs-slide_photo{animation: slickPhoto 1s forwards;}
.jobs-slider .swiper-slide-active{animation: none !important; opacity: 1 !important; z-index: 999 !important;}
.jobs-slider .swiper-slide-active .jobs-slide_photo{animation: none !important;}

.jobs-slider-next,
.jobs-slider-prev{width: 56px; height: 56px; background: url("../img/common/ic-circle-arrow.svg") no-repeat top left/100% 100%; text-indent: -9999px; cursor: pointer; z-index: 10; position: absolute; bottom: 105px;}
.jobs-slider-prev{transform: rotateY(-180deg);}
.jobs-slider-next:hover,
.jobs-slider-prev:hover{background: url("../img/common/ic-circle-arrow_yellow.svg") no-repeat top left/100% 100%;}

.jobs-slider-pagination{display: flex; justify-content: center; z-index: 10;}
.jobs-slider-pagination .swiper-pagination-bullet{width: 16px; height: 16px; border: 1px solid #00458d; border-radius: 100%; background: #fff; margin: 0 5px; text-indent: -9999px; cursor: pointer; opacity: 1 !important;}
.jobs-slider-pagination .swiper-pagination-bullet:hover,
.jobs-slider-pagination .swiper-pagination-bullet-active{background: #00458d;}

.jobs-slider_btn{width: 93px; height: 93px; display: flex; justify-content: center; align-items: center; background: #fff !important; border: 2px solid #00458d; position: absolute; top: 43%; left: 3%; right: auto !important; margin-left: calc(50% - 500px); z-index: 100; border-radius: 100%; cursor: pointer; text-indent: 0;}
.jobs-slider_btn:hover{background: #e6ff1d !important;}

@media (max-width: 767px){
	.jobs-slider-next,
	.jobs-slider-prev{width: 48px; height: 48px;}
	.jobs-slider-pagination .swiper-pagination-bullet{width: 10px; height: 10px;}
}

@keyframes slickStarted {
	0%{opacity: 1; z-index: 1000;}
	20%{opacity: 1; z-index: 1000;}
	70%{opacity: 1; z-index: 999;}
	100%{opacity: 0; z-index: 998;}
}
@keyframes slickPhoto {
    0% {transform: translate(0,0);}
    50% {transform: translate(110%,-120px) rotate(5deg);}
    100% {transform: translate(0,0) rotate(0deg);}
}

@media (min-width: 768px){
	.jobs-slide_wrap{display: flex; justify-content: center; position: relative; width: 100%;}
	.jobs-slide_wrap:before{content: ''; width: 64%; max-width: 640px; height: 100%; position: absolute; top: 80px; left: calc(50% - 500px); background: url("../img/top/jobs-slide-bg.png") no-repeat top center/100% auto; display: block;}
	.jobs-slide_img{width: 64%; max-width: 640px; position: relative; padding: 140px 0 15px; margin: 0 30px 0 0;}
	.jobs-slide_num{top: 110px; left: 0;}
	.jobs-slide_inner{width: 33%; max-width: 330px; margin: 190px 0 0 0;}
		
	.jobs-slider-prev{right: calc(50% - 224px);}
	.jobs-slider-next{right: calc(50% - 500px);}
	.jobs-slider-pagination{position: absolute; bottom: 125px !important; right: calc(50% - 500px) !important; left: auto !important; width: 33% !important; max-width: 330px;}
	
	.jobs-illus{position: absolute; top: -5px; left: 540px;}
	.jobs .lineL-pink1{top: -70px; left: -57px;}    
	.jobs .lineL-pink2{top: 420px; right: -110px;}    
	.jobs .line2-blue{top: 120px; left: 81.5%;}
	.jobs .lineR-green{top: 680px; left: -60px;}
	.jobs .lineS-blue{bottom: -80px; left: 45.5%;}
	.jobs .line2-yellow{bottom: -200px; left: 37%;}
}

@media (min-width: 768px) and (max-width: 1060px){
	.jobs-wrap{width: calc(100% - 60px); margin: 0 auto;}
	.jobs-slide_wrap{justify-content: space-between;}
	.jobs-slide_wrap:before{left: 0;}
	.jobs-slider_btn{margin-left: 0;}
	.jobs-slide_img{margin: 0;}
	
	.jobs-slider-pagination{right: 0 !important;}	
	.jobs-slider-prev{right: calc(33% - 56px);}
	.jobs-slider-next{right: 0;}
}

@media (min-width: 768px) and (max-width: 1023px){
	.jobs-slide_inner{margin: 150px 0 0 0;}
	
	.jobs-slider-pagination{bottom: 65px !important;}	
	.jobs-slider-prev,
	.jobs-slider-next{bottom: 45px;}
}

@media (max-width: 767px){
	.jobs{margin: 0 0 70px;}
		
	.jobs-illus{width: 86px; margin: 0 auto 10px;}
	.jobs .title{margin: 0 -20px 20px;}
	
	.jobs-wrap{max-width: 502px; width: calc(100% - 60px); margin: 0 auto;}
	.jobs-slide_wrap:before{content: ''; height: 50px; position: absolute; top: 32px; left: 0; background: url("../img/top/jobs-slide-bg_sp.png") no-repeat top center/100% auto; display: block; box-shadow: 8px 8px 3px 0px rgba(0, 0, 0, 0.1); overflow: hidden; border-radius: 32px 32px 0 0; width: calc(100% - 8px);}
	.jobs-slide_img{position: relative; padding: 60px 8px 0 0;}
	.jobs-slide_num{left: 0; top: 40px;}
	.jobs-slide_num img{height: 43px; width: auto;}	
	.jobs-slide_photoN{width: 100%; border-radius: 32px; margin: 0;}
	.jobs-slide_photo{width: calc(100% - 8px); border-radius: 32px; margin: 0; top: 60px;}
	
	.jobs-slide_inner{padding: 25px 0 85px;}
	.jobs-slide_mess{font-size: 2rem; line-height: 1.6; letter-spacing: 0;}
	.jobs-slide_mess br{display: none;}
	
	.jobs-slider-pagination{position: absolute; bottom: 20px !important; left: 0 !important; width: 100% !important;}	
	.jobs-slider-prev{bottom: 0; left: calc(50% - 105px);}
	.jobs-slider-next{bottom: 0; right: calc(50% - 105px);}
	
    .jobs .lineL-pink2{top: 195px; right: -50px;}	
	.jobs .lineL-yellow{top: 0; left: -50px;}
	.jobs .lineR-green{top: 520px; left: -30px;}
	.jobs .line2-yellow{bottom: 50px; right: -65px;}
	.jobs .lineL-dblue{bottom: -110px; left: -55px;}
}

/* Project */
.gear{position: absolute; width: 39px;}
.gearM{position: absolute; width: 70px;}
.gearS{position: absolute; width: 98px;}
.gearT{position: absolute; width: 96px;}

@media (max-width: 767px){
	.gearM{width: 42px;}
}

/* Story */
.story-wrap{background: #e5f6ff; border-radius: 100px; padding: 0 0 120px;}
.story-head{padding: 110px 0 50px; position: relative; text-align: center;}
.story-head_illus{position: absolute; top: -26px; left: 50%; transform: translateX(-50%);}
.story-head .title{display: inline-block; position: relative;}
.story-head .title:before,
.story-head .title:after{content: ''; width: 57px; height: 50px; background: url("../img/common/quote.svg") no-repeat top left/100% auto; position: absolute; top: -24px;}
.story-head .title:before{left: -75px;}
.story-head .title:after{right: -75px; transform: rotate(-180deg);}

.story-item{position: relative;}
.story-item_num{position: absolute; top: 15px; left: 15px; z-index: 5;}
.story-item_num img{height: 42px; width: auto;}
.story-item_img{border-radius: 64px; overflow: hidden; background: #e6ff1d;}
.story-item_img img{transition: transform 1s, opacity .5s;}
.story-item_txt{font-size: 2.4rem; font-weight: bold; line-height: 1.3; font-family: 'Zen Kaku Gothic New', sans-serif; background: #e5f6ff; border-radius: 0 64px 0 0; padding: 25px 60px 0 25px; min-width: 66%; position: absolute; bottom: 0; left: 0;}
.story-item_txt span{display: block; font-size: 2.8rem; margin-left: -0.5em;}
.story-item a:hover .story-item_img img{transform: scale(1.1); opacity: .76;}
	
@media (min-width: 768px){
	.story{position: sticky; top: 0; padding: 26px 0 0 0;}
    
	.story-list{display: flex; justify-content: space-between; flex-wrap: wrap;}
	.story-item{width: 48.6%;}
	.story-item:nth-of-type(1){z-index: 6;}
	
	.story .gear{top: 35px; left: 64%;}
	.story .gearM{top: 350px; left: 98%;}
	.story .lineS-purple{top: -25px; right: 70px;}
	.story .lineR-green{top: 185px; right: -30px;}
	.story .lineL-yellow{top: 460px; left: -50px; width: 180px; height: 180px}
}

@media (min-width: 768px) and (max-width: 1023px){
	.story-item_txt{padding: 25px 25px 0 25px; font-size: 2rem;}
	.story-item_txt span{font-size: 2.4rem;}
}

@media (max-width: 767px){
	.story{padding: 40px 0 0 0;}
	.story-wrap{border-radius: 64px; position: relative; padding: 0 0 50px;}
	.story-head{padding: 50px 0 30px; margin: 0 -20px;}
	.story-head_illus{width: 85px; top: -40px;}
	.story-head .title img{height: auto; max-width: 388px; width: 94%;}
	.story-head .title:before,
	.story-head .title:after{width: 24px; height: 22px; top: -21px;}
	.story-head .title:before{left: -3px;}
	.story-head .title:after{right: -3px;}
	
	.story-list{max-width: 486px; margin: 0 auto;}
	.story-item:nth-of-type(1){margin: 0 0 50px;}
	.story-item_img{border-radius: 32px;}
	.story-item_txt{padding: 15px 30px 0 15px; font-size: 1.6rem; border-radius: 0 32px 0 0;}
	.story-item_txt span{font-size: 2rem;}
	
	.story .gear{top: 150px; left: 69%;}
	.story .gearM{top: 515px; right: -28px;}
	.story .lineS-purple{top: 230px; right: -11px;}
	.story .lineR-green{top: 415px; right: -36px;}
	.story .lineL-yellow{top: 243px; left: -20px; width: 106px; height: 106px}
}

/* Crosstalk */
.talk{background: #00458d; color: #fff; border-radius: 100px; z-index: 5; position: relative; margin: 200px 0 0 0;}
.talk .container{padding: 0 0 150px;}
.talk-head{padding: 140px 0 50px; position: relative; text-align: center;}
.talk-head_illus{position: absolute; top: -47px; left: 50%; transform: translateX(-50%);}
.talk-head .title{display: inline-block; position: relative;}
.talk-head .title:before,
.talk-head .title:after{content: ''; width: 57px; height: 50px; background: url("../img/common/quote_white.svg") no-repeat top left/100% auto; position: absolute; top: -24px;}
.talk-head .title:before{left: -79px;}
.talk-head .title:after{right: -79px; transform: rotate(-180deg);}

.talk-item{position: relative;}
.talk-item_num{position: absolute; top: 15px; left: 15px; z-index: 5;}
.talk-item_num img{height: 42px; width: auto;}
.talk-item_img{border-radius: 64px; overflow: hidden; background: #e6ff1d;}
.talk-item_img img{transition: transform 1s, opacity .5s;}
.talk-item_txt{font-size: 2.4rem; font-weight: bold; line-height: 1.3; font-family: 'Zen Kaku Gothic New', sans-serif; background: #00458d; border-radius: 0 64px 0 0; padding: 30px 25px; max-width: 316px; width: 100%; position: absolute; bottom: 0; left: 0;}
.talk-item a:hover .talk-item_img img{transform: scale(1.1); opacity: .76;}

@media (min-width: 768px){
	.talk-list{display: flex; justify-content: space-between; flex-wrap: wrap;}
	.talk-item{width: 48.6%; margin: 0 0 80px;}
	.talk-item.is-full{width: 100%; margin: 0; position: relative; z-index: 6;}	
	
	.talk .lineS-purple{top: 215px; left: -70px;}
	.talk .lineL-yellow{top: 170px; right: -90px; width: 180px; height: 180px;}
	.talk .lineR-green{top: 735px; left: -40px;}
	.talk .lineR-green2{top: 375px; right: -100px;}
	
	.talk .gear1{top: 50px; right: 80%;}
	.talk .gear2{top: 298px; right: 18%;}
	.talk .gearM{top: 140px; right: 88%;}
	.talk .gearS{top: 45px; right: 4%;}
	.talk .gearT{bottom: 40px; left: -60px;}
	.talk .fork{position: absolute; bottom: 85px; right: -85px;}
	.talk .car{position: absolute; bottom: -38px; right: 7.5%;}
}

@media (max-width: 767px){
	.talk{margin: 86px 0 0 0; border-radius: 64px;}
	.talk .container{padding: 0 0 1px;}
	.talk-head{padding: 50px 0 25px;}
	.talk-head_illus{width: 200px; top: -68px;}	
	.talk-head .title:before,
	.talk-head .title:after{width: 24px; height: 22px; top: -15px;}
	.talk-head .title:before{left: -26px;}
	.talk-head .title:after{right: -26px;}
	
	.talk-list{max-width: 486px; margin: 0 auto;}
	.talk-item{margin: 0 0 50px;}
	.talk-item_img{border-radius: 32px;}
	.talk-item_txt{font-size: 2rem; padding: 20px 15px; max-width: 200px; border-radius: 0 32px 0 0;}
	
	.talk .lineS-purple{top: 385px; left: -15px;}
	.talk .lineL-blue{top: 135px; right: -70px;}
	.talk .lineR-green{top: 755px; left: -30px;}
	.talk .lineR-yellow{top: 605px; right: -15px; width: 88px; height: 89px;}
	.talk .gear2{top: 140px; right: 5px;}
	.talk .gearM{top: 85px; left: -20px;}
	
	.talk .fork{position: absolute; bottom: -17px; right: -10px; width: 60px;}
	.talk .car{position: absolute; bottom: -17px; left: 15px; width: 86px;}
}

/* Special */
.special{position: relative; z-index: 6;}
.special-wrap{padding: 150px 0;}
.special-item a{display: block; overflow: hidden; position: relative;}
.special-item .txt{position: absolute; line-height: 1;}
.special-item .txt span{font-weight: bold; font-family: 'Zen Kaku Gothic New', sans-serif; letter-spacing: 0.1em; color: #000;}

.special-item:nth-of-type(1) a{border: 2px solid #E6FF1D;}
.special-item:nth-of-type(2) a{border: 2px solid #FFC3C3;}
.special-item:nth-of-type(3) a{border: 2px solid #72C3C8;}

@media (min-width: 768px){
	.special-head{display: flex; justify-content: space-between; align-items: flex-end; margin: 0 0 50px;}
	.special-head .title{margin: 0;}
	.special-build{margin: 0 -50px 10px 0; max-width: calc(100% - 500px); position: relative; z-index: 10;}
	
	.special-img{position: absolute; bottom: 25px; left: -78px; z-index: 2;}
	
	.special-list{display: flex; justify-content: space-between;}
	.special-item{width: 32.1%; transition: .5s;}
	.special-item a{border-radius: 64px; height: 360px;}
	.special-item .txt{top: 40px; left: 40px; width: 185px;}
	.special-item .txt span{font-size: 2.4rem; line-height: 1.4; display: inline-block; background: #fff;}
	.special-item .img{position: absolute; top: 0; left: 50%; width: 486px; transform: translateX(-50%);}
	
    .special-list:hover .special-item:hover{width: 48.6%;}
	.special-list:hover .special-item:not(:hover){width: 23.1%;}
	
	.special .lineL-blue{top: -110px; left: 15%;}
	.special .lineS-dblue{top: 110px; left: 64%;}
	.special .lineL-yellow{top: 90px; right: -180px;}
	.special .lineR-green{top: 23px; right: -200px;}
}

@media (max-width: 1199px) and (min-width: 768px){
    .special-img{left: -30px; bottom: 5px;}
}

@media (max-width: 1060px) and (min-width: 768px){
	.special-item .txt{left: 20px;}
	.special-item a{height: 34vw;}
	.special-item .img{width: 45.9vw;}	
}

@media (max-width: 767px){
	.special-wrap{padding: 65px 0 110px;}
	.special-img{width: 112px; margin: 0 auto 8px; position: relative; z-index: 6;}
	.special-head{text-align: center; padding: 0 0 10px;}
	.special-list{max-width: 486px; margin: 0 auto; width: 100%;}
	.special-item:not(:last-of-type){margin: 0 0 25px;}
	.special-item a{border-radius: 32px;}
	.special-item img{width: 100%;}
	.special-item .txt{background: #fff; top: 25px; left: 25px; padding: 1px 3px;}
	.special-item .txt span{font-size: 2rem; line-height: 1.4;}
	
	.special .lineL-blue{top: 40px; right: 30px; opacity: 0.5;}
	.special .lineS-dblue{top: 90px; left: 10px;}
	.special .lineL-yellow{top: 240px; right: -55px;}
	.special .lineR-dblue{bottom: 60px; right: 55px; width: 92px; height: 93px;}
	.special .lineR-purple{top: 450px; left: -76px; width: 92px; height: 93px;}
	.special .lineS-lblue{top: 660px; right: -45px; width: 34px; height: 34px;}
}

/* Internship */
.internship{color: #fff; background: linear-gradient(to bottom, #9fd9f6, #00458d);}

@media (min-width: 768px){
	.internship-wrap{padding: 90px 0 80px;}
    .internship-inner{width: 54%; max-width: 495px;}
	.internship-img{width: 41.7%; position: absolute; top: -58px; right: 0;}
	.internship .t-btn{position: absolute; top: 265px; right: 0;}
	
	.internship .lineR-yellow{top: -95px; left: 45%;}
	.internship .lineS-purple{top: -30px; right: -66px;}
}

@media (max-width: 767px){
    .internship-wrap{padding: 90px 0 45px;}
	.internship-img{position: absolute; top: -57px; right: 0; width: 100%; text-align: center;}
	.internship .title img{margin: 0 auto;}
	
	.internship .lineR-yellow{top: -40px; left: -50px;}
	.internship .line2-pink{bottom: -30px; right: 0; width: 82px; height: 83px;}
	.internship .lineS-yellow{bottom: -10px; left: 40px; width: 34px; height: 34px;}
}

/* Benefits */
.benefits{position: relative;}
.benefits-inner{overflow: hidden; position: relative; background: #fff;}

@media (min-width: 768px){
	.benefits{padding: 145px 0 195px;}
	.benefits-head{position: relative;}
	.benefits-img{border-radius: 100px 0 0 0; overflow: hidden;}
	.benefits-img a{background: #e6ff1d; display: block;}
	.benefits-img img{transition: transform 1s, opacity .5s;}
	.benefits-img a:hover img{transform: scale(1.1); opacity: .76;}
	.benefits-illus{position: absolute; top: 65%; right: -10.5%;}
	.benefits-inner{border-radius: 0 100px 0 0; width: 650px; padding: 80px 40px 80px 80px; margin: -115px 0 0 -80px;}
	.benefits .t-btn{position: absolute; bottom: 80px; right: 0;}
	
	.benefits .lineL-yellow{top: 35px; left: -140px;}
	.benefits .lineR-green{bottom: 35px; left: 57%;}
}

@media (max-width: 1199px) and (min-width: 768px){
	.benefits-illus{right: -30px; width: 36%;}
	.benefits-inner{padding: 80px 30px; margin: -115px 0 0 -30px; width: 60%;}
}

@media (max-width: 767px){
	.benefits{padding: 50px 0 70px;}
	.benefits .title{text-align: left;}
	.benefits-img{border-radius: 64px 0 0 0; overflow: hidden;}
	.benefits-img img{object-fit: cover; height: 230px; width: 100%; object-position: right;}
	.benefits-inner{border-radius: 0 64px 0 0; padding: 30px 20px; margin: -45px 0 0 0;}
	
	.benefits .lineS-green{top: 130px; left: 10px; width: 34px; height: 34px;}
	.benefits .lineR-lblue{bottom: 170px; right: -60px;}
}

/* Recruit */
.recruit{position: relative; margin: 0 0 100px;}
.recruit-img{overflow: hidden;}
.recruit-img img{object-fit: cover; width: 100%; object-position: center;}
.recruit-inner{position: relative;}
.recruit-illus{position: absolute; z-index: 6;}

@media (min-width: 768px){
    .recruit{display: flex;}
	.recruit-img{width: calc(50% - 180px); margin: 0 110px 0 0; border-radius: 0 64px 64px 0;}
	.recruit-img img{height: 552px;}
	.recruit-inner{width: 570px;}
	.recruit-inner h2{margin: 70px 0 80px;}
	.recruit-illus{top: -25px; left: 0; margin-left: 350px;}
	
	.recruit .line2-yellow{top: -50px; right: -10px;}
	.recruit .lineR-purple{top: -80px; right: -90px;}
	.recruit .lineS-dblue{bottom: -30px; right: 15%;}
}

@media (max-width: 1060px) and (min-width: 768px){
	.recruit-img{width: 36%; margin: 0 30px 0 0;}
	.recruit-inner{width: calc(64% - 60px);}
	.recruit-illus{height: 171px; display: flex; align-items: flex-end; right: -30px;}
}

@media (max-width: 767px){
	.recruit .title{text-align: center; padding: 0 0 0 30px; margin: 0 0 28px;}
    .recruit-img{width: calc(100% - 30px); border-radius: 0 32px 32px 0;}
	.recruit-img img{height: 200px;}
	.recruit-illus{top: -15px; left: 0; width: calc(50% - 87px); text-align: right;}
	.recruit-illus img{width: 81px; transform: rotateY(-180deg);}
	.recruit .t-lbtn{width: calc(100% - 60px);}
	
	.recruit .line2-yellow{top: -65px; left: -70px;}
	.recruit .lineS-dblue{bottom: -80px; right: 60px;}
	.recruit .lineS-purple{top: 250px; left: 50%;}
	.recruit .lineL-green{top: -3px; right: 20px; width: 77px; height: 77px;}
}
