@charset "utf-8";
/*--------------------------------------------------

	MAIN VISUAL │ メインビジュアル

--------------------------------------------------*/
#mv {position: relative;margin-top: 5%;}
#mv .container {position: relative;width: 77%;margin: 0 auto;}
#mv .container .bg {position: relative}
#mv .container .wrap {position: absolute;right: 10%;bottom: 0;width: 51.12%;}
#mv .container .wrap h1 {position: absolute;top: 0;right: 82%;width: 41%;}
#mv .container p {position: absolute;top: 16%;left: 7%;width: 16.7%;}
#mv p.en {
	position: absolute;
	bottom: 5.5%;
	left: 50%;
	transform: translateX(-50%);
	width: 100vw;
    color: #8ECAFF;
    font-size: 8.1vw;
	line-height: 1;
}
@media only screen and ( max-width : 767px ) {
	#mv .container {width: 85%;margin-bottom: 42%;}
	#mv .container .wrap {right: 12%;width: 53.12%;}
	#mv .container .wrap h1 {right: 92%;width: 60%;}
	#mv .container p {top: 88%;left: 50%;transform: translateX(-50%);width: 65%;}
	#mv p.en {position: initial;transform: none;margin: 0 calc(50% - 50vw);width: 102vw;color: #CCE7FF;font-size: 13.3vw;}
}
/*--------------------------------------------------

	ENTRY

--------------------------------------------------*/
#entry_fix {position: sticky;bottom: 5%;left: 0;z-index: 10;}
#entry_fix a {
	width: 100%;
	padding: clamp(16px, calc(16px + 10 * ((100vw - 375px) / 1545)), 26px);
	border-radius: 100px;
	background: #F51404;
	color: #fff;
	font-size: clamp(32px, calc(32px + 17 * ((100vw - 375px) / 1545)), 49px);
	letter-spacing: .1em;
	text-align: center;
}
#entry_fix a span{display:block;width:100%;text-align:center;font-size: .6em;margin:0 auto .4em;letter-spacing: 0;}
/*--------------------------------------------------

	Message

--------------------------------------------------*/
#message {padding-top: 15%;}
#message .container {
	position: relative;
	padding: clamp(35px, calc(35px + 135 * ((100vw - 375px) / 1545)), 170px) clamp(20px, calc(30px + 70 * ((100vw - 375px) / 1545)), 100px) clamp(30px, calc(30px + 70 * ((100vw - 375px) / 1545)), 100px);
	border-radius: clamp(20px, calc(20px + 40 * ((100vw - 375px) / 1545)), 60px);
	box-shadow: 0 3px 30px rgba(185, 199, 216, .3);
	background: #fff;
}
#message .container .title_common {
	position: absolute;
	top: 0;
	left: -7%;
	transform: translateY(-50%);
	margin-bottom: 0;
	width: clamp(144px, calc(144px + 387 * ((100vw - 375px) / 1545)), 531px);
	padding: 10% 3vw 10% 0;
	background: url(../img/front/message/title_bg.png) no-repeat center / 100%;
}
#message .container .title_common h2 {color: #fff;font-size: clamp(18px, calc(18px + 52 * ((100vw - 375px) / 1545)), 70px);letter-spacing: .04em;}
#message .container .title_common h2 div {text-align: center;}
#message .container .content p {
	margin-bottom: clamp(30px, calc(30px + 40 * ((100vw - 375px) / 1545)), 70px);
	color: #258FEA;
	font-weight: 500;
	font-size: clamp(14px, calc(14px + 16 * ((100vw - 375px) / 1545)), 30px);
	line-height: 2;
}
#message .container .content p:last-child {margin-bottom: 0;}
/*--------------------------------------------------

	OUR BUSINESS

--------------------------------------------------*/
#business .title_common {margin-bottom: clamp(15px, calc(15px + 25 * ((100vw - 375px) / 1545)), 40px);}
#business .title_common h2 {color: #4E99FF;font-size: clamp(30px, calc(30px + 40 * ((100vw - 375px) / 1545)), 70px);}
#business .title_common h2 div {text-align: center;}
#business .container {
	padding: clamp(30px, calc(30px + 30 * ((100vw - 375px) / 1545)), 60px) 0 clamp(30px, calc(30px + 70 * ((100vw - 375px) / 1545)), 100px);
	border-radius: clamp(20px, calc(20px + 40 * ((100vw - 375px) / 1545)), 60px);
	box-shadow: 0 3px 30px rgba(185, 199, 216, .3);
	background: #fff;
}
#business .container figure {
	margin-bottom: clamp(30px, calc(30px + 30 * ((100vw - 375px) / 1545)), 60px);
	padding: clamp(17px, calc(17px + 43 * ((100vw - 375px) / 1545)), 60px) clamp(10px, calc(10px + 40 * ((100vw - 375px) / 1545)), 50px);
	background: #5DA1FF;
}
#business .container .wrap h3 {
	margin-bottom: clamp(10px, calc(10px + 40 * ((100vw - 375px) / 1545)), 50px);
	color: #3081F0;
	font-weight: 700;
	font-size: clamp(20px, calc(20px + 28 * ((100vw - 375px) / 1545)), 48px);
	text-align: center;
}
#business .container .wrap p {
	font-weight: 500;
	font-size: clamp(16px, calc(16px + 14 * ((100vw - 375px) / 1545)), 30px);
	line-height: 2;
	text-align: center;
}
/*--------------------------------------------------

	What’s Chance Making?

--------------------------------------------------*/
#chance_making {background: linear-gradient(#F7FAFF, #90D5FA, #65E1FF);}
#chance_making .title_common {margin-bottom: 5%;}
#chance_making .title_common h2 {color: #246CD0;font-size: clamp(36px, calc(36px + 60 * ((100vw - 375px) / 1545)), 96px);}
#chance_making .title_common h2 div {text-align: center;}
#chance_making .title_common h2 div:nth-of-type(2) {color: #EA2538;}
#chance_making .title_common h2 span {line-height: 1;}
#chance_making .container {margin-bottom: 50px;}
#chance_making .container .title_wrap h3 {margin-bottom: clamp(13px, calc(13px + 8 * ((100vw - 375px) / 1545)), 21px);text-align: center;}
#chance_making .container .title_wrap h3 span {
	position: relative;
	padding: clamp(8px, calc(8px + 6 * ((100vw - 375px) / 1545)), 14px) clamp(15px, calc(15px + 25 * ((100vw - 375px) / 1545)), 40px);
	border-radius: 40px;
	background: #6FBCFF;
	color: #fff;
	font-weight: 700;
	font-size: clamp(16px, calc(16px + 20 * ((100vw - 375px) / 1545)), 36px);
	text-align: center;
}
#chance_making .container .title_wrap h3 span::before {
	content: '';
	position: absolute;
	top: 99%;
	left: 50%;
	transform: translateX(-50%);
	width: clamp(15px, calc(15px + 10 * ((100vw - 375px) / 1545)), 25px);
	height: calc(tan(60deg) * clamp(13px, calc(13px + 8 * ((100vw - 375px) / 1545)), 21px) / 2);
	clip-path: polygon(0 0, 100% 0, 50% 100%);
	background: #6FBCFF;
}
#chance_making .container .title_wrap figure {max-width: 654px;margin: 0 auto;}
#chance_making .container ul li {
	margin-bottom: 50px;
	padding: clamp(30px, calc(30px + 30 * ((100vw - 375px) / 1545)), 60px) clamp(20px, calc(20px + 30 * ((100vw - 375px) / 1545)), 50px) 0;
	border-radius: clamp(20px, calc(20px + 40 * ((100vw - 375px) / 1545)), 60px);
	background: #fff;
}
#chance_making .container ul li:last-child {margin-bottom: 0;}
#chance_making .container ul li h4 {
	display: flex;
	align-items: center;
	gap: clamp(10px, calc(10px + 8 * ((100vw - 375px) / 1545)), 18px);
	margin-bottom: clamp(20px, calc(20px + 10 * ((100vw - 375px) / 1545)), 30px);
	color: #0081F0;
	font-weight: 700;
	font-size: clamp(18px, calc(18px + 22 * ((100vw - 375px) / 1545)), 40px);
}
#chance_making .container ul li h4 img {width: clamp(60px, calc(60px + 40 * ((100vw - 375px) / 1545)), 100px);}
#chance_making .container ul li h4 span {position: relative;padding-left: clamp(22px, calc(22px + 28 * ((100vw - 375px) / 1545)), 50px);line-height: 1.4;}
#chance_making .container ul li h4 span::before {content: 'Q. ';position: absolute;left: 0;}
#chance_making .container ul li .wrap {margin-bottom: 20px;text-align: right;}
#chance_making .container ul li .wrap h5 {color: #205091;font-weight: 700;font-size: clamp(20px, calc(20px + 8 * ((100vw - 375px) / 1545)), 28px);}
#chance_making .container ul li .wrap .content {margin-bottom: clamp(10px, calc(10px + 10 * ((100vw - 375px) / 1545)), 20px);}
#chance_making .container ul li .wrap .content p {
	margin-bottom: clamp(30px, calc(30px + 30 * ((100vw - 375px) / 1545)), 60px);
	color: #205091;
	font-weight: 500;
	font-size: clamp(15px, calc(15px + 13 * ((100vw - 375px) / 1545)), 28px);
}
#chance_making .container ul li .wrap .content p:last-child {margin-bottom: 0;}
#chance_making .container ul li .wrap .content p span {background: linear-gradient(#fff 50%, #feffa7 50%);}
#chance_making .container ul li .wrap small {
	position: relative;
	color: #205091;
	font-weight: 700;
	font-size: clamp(13px, calc(13px + 7 * ((100vw - 375px) / 1545)), 20px);
}
#chance_making .container ul li .wrap small::before {
	content: '';
	position: absolute;
	top: 50%;
	right: 120%;
	transform: translateY(-50%);
	width: 200px;
	height: 1px;
	background: #205091;
}
#chance_making .container ul li dl {display: flex;justify-content: center;align-items: flex-start;}
#chance_making .container ul li:nth-child(even) dl {flex-direction: row-reverse;}
#chance_making .container ul li:last-child dl {flex-direction: column;align-items: center;gap: clamp(10px, calc(10px + 20 * ((100vw - 375px) / 1545)), 30px);}
#chance_making .container ul li dl dt {
	padding: 10px clamp(10px, calc(10px + 30 * ((100vw - 375px) / 1545)), 40px);
	border-radius: clamp(10px, calc(10px + 30 * ((100vw - 375px) / 1545)), 40px);
	background: #88D5FF;
	color: #fff;
	font-weight: 700;
	font-size: clamp(18px, calc(18px + 22 * ((100vw - 375px) / 1545)), 40px);
	line-height: 1.3;
}
#chance_making .container ul li:nth-child(odd) dl dt {border-bottom-right-radius: 0;}
#chance_making .container ul li:nth-child(2) dl dt {border-bottom-left-radius: 0;}
#chance_making .container ul :last-child dl dt {text-align: center;}
#chance_making .container ul li dl dd {flex: 1;max-width: clamp(100px, calc(100px + 100 * ((100vw - 375px) / 1545)), 200px);}
#chance_making .container ul :last-child dl dd {max-width: clamp(250px, calc(250px + 250 * ((100vw - 375px) / 1545)), 500px);}
#chance_making .movie {position: relative;width: 100%;padding-top: 56.25%;}
#chance_making .movie video {position: absolute;top: 0;right: 0;width: 100%;height: 100%;}
/*--------------------------------------------------

	DATA

--------------------------------------------------*/
#data .title_common h2 {color: #3ECCFF;}
#data ul {display: grid;grid-template-columns: repeat(2, 1fr);gap: clamp(15px, calc(15px + 30 * ((100vw - 375px) / 1545)), 45px);}
#data ul li {position: relative;border-radius: clamp(10px, calc(10px + 30 * ((100vw - 375px) / 1545)), 40px);background: #6FBCFF;}
#data ul li.skyblue {background: #69D8FF;}
#data ul li::before {content: '';display: block;padding-top: 100%;}
#data ul li .wrap {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	position: absolute;
	top: 9%;
	left: 50%;
	transform: translateX(-50%);
	width: 90%;
	height: 82%;
}
#data ul li .wrap h3 {margin-bottom: 5%;color: #fff;font-weight: 700;font-size: clamp(18px, calc(18px + 24 * ((100vw - 375px) / 1545)), 42px);text-align: center;}
#data ul li .wrap figure {margin: 0 auto;}
#data ul li:nth-child(1) .wrap figure {width: 35%;}
#data ul li:nth-child(2) .wrap figure {width: 50%;}
#data ul li:nth-child(3) .wrap figure {width: 30%;}
#data ul li:nth-child(4) .wrap figure {width: 20%;}
#data ul li:nth-child(5) .wrap figure {width: 70%;}
#data ul li:nth-child(6) .wrap figure {width: 30%;}
#data ul li:nth-child(7) .wrap figure {width: 35%;}
#data ul li:nth-child(8) .wrap figure {width: 30%;}
#data ul li:nth-child(9) .wrap figure {width: 20%;}
#data ul li:nth-child(10) .wrap figure {width: 30%;}
#data ul li .wrap p {
	display: flex;
	justify-content: center;
	align-items: baseline;
	gap: clamp(5px, calc(5px + 10 * ((100vw - 375px) / 1545)), 15px);
	color: #fff;
	font-weight: 700;
	font-size: clamp(20px, calc(20px + 35 * ((100vw - 375px) / 1545)), 55px);
	text-align: center;
}
#data ul li:nth-child(2) .wrap p,
#data ul li:nth-child(5) .wrap p {gap: 0;}
#data ul li .wrap p span {font-size: 1.8em;}
/*--------------------------------------------------

	CAREER

--------------------------------------------------*/
#career .title_common h2 {color: #3EDFF4;}
#career ul {max-width: clamp(335px, calc(335px + 348 * ((100vw - 375px) / 1545)), 683px);margin: 0 auto;}
#career ul li {text-align: center;}
#career ul li .wrap {
	padding: clamp(20px, calc(20px + 20 * ((100vw - 375px) / 1545)), 40px) clamp(10px, calc(10px + 10 * ((100vw - 375px) / 1545)), 20px);
	border-radius: 20px;
}
#career ul li:nth-child(1) .wrap {background: #8AE4F5;}
#career ul li:nth-child(2) .wrap {background: #7DD9FA;}
#career ul li:nth-child(3) .wrap {background: #58BCFA;}
#career ul li:nth-child(4) .wrap {background: #4BA0F5;}
#career ul li .wrap h3 {
	margin-bottom: clamp(20px, calc(20px + 20 * ((100vw - 375px) / 1545)), 40px);
	font-weight: 700;
	font-size: clamp(20px, calc(20px + 20 * ((100vw - 375px) / 1545)), 40px);
	text-align: center;
}
#career ul li:nth-child(3) .wrap h3,
#career ul li:nth-child(4) .wrap h3 {color: #fff;}
#career ul li .wrap p {
	margin-bottom: clamp(20px, calc(20px + 20 * ((100vw - 375px) / 1545)), 40px);
	font-size: clamp(15px, calc(15px + 15 * ((100vw - 375px) / 1545)), 30px);
	text-align: center;
}
#career ul li:nth-child(3) .wrap p,
#career ul li:nth-child(4) .wrap p {color: #fff;}
#career ul li .wrap figure {max-width: clamp(150px, calc(150px + 156 * ((100vw - 375px) / 1545)), 306px);margin: 0 auto;}
#career ul li h4 {
	display: inline-block;
	padding: clamp(3px, calc(3px + 7 * ((100vw - 375px) / 1545)), 10px) clamp(30px, calc(30px + 30 * ((100vw - 375px) / 1545)), 60px);
	color: #fff;
	font-size: clamp(20px, calc(20px + 20 * ((100vw - 375px) / 1545)), 40px);
}
#career ul li:nth-child(1) h4 {background: #8AE4F5;}
#career ul li:nth-child(2) h4 {background: #7DD9FA;}
#career ul li:nth-child(3) h4 {background: #58BCFA;}
#career ul li:nth-child(4) h4 {background: #4BA0F5;}
#career ul li h4 span {font-size: 1.5em;}
/*--------------------------------------------------

	Challenges are Exciting!

--------------------------------------------------*/
#challenges .title_common h2 {color: #4E99FF;}
#challenges .wrap p {margin-bottom: clamp(25px, calc(25px + 35 * ((100vw - 375px) / 1545)), 60px);line-height: 2;}
#challenges .wrap h3 {text-align: center;}
#challenges .wrap h3 span {
	display: inline-block;
	margin-bottom: 12px;
	padding: 10px clamp(20px, calc(20px + 30 * ((100vw - 375px) / 1545)), 50px);
	border-radius: clamp(10px, calc(10px + 10 * ((100vw - 375px) / 1545)), 20px);
	background: #7CB3FF;
	color: #fff;
	font-weight: 700;
	font-size: clamp(22px, calc(22px + 20 * ((100vw - 375px) / 1545)), 42px);
	line-height: 1.4;
}
#challenges .wrap h3 span.sub{margin-bottom: 0;background: none;color: #444;padding:.3em;font-size: 1em;}
#challenges .wrap h3 span:last-child {margin-bottom: 0;}
@media only screen and ( max-width : 767px ) {
	#challenges .wrap h3 span,#challenges .wrap h3 span.sub {font-size: 3.5vw;}
}