@charset "UTF-8";
/**********************
*　header
***********************/
.header { background-color: transparent; }

@media print, screen and (min-width:681px) {
	.header { position: fixed; top: 36px; left: 44px; width: auto; }
	.header__logo img { width: 305px; }
}

/**********************
*　Main Visual
***********************/
.mv { position: relative; width: 100%; height: 100%; background: url("../common/img/bg_noise.jpg") repeat center/1400px auto; overflow: hidden; }
.mv::before,
.mv::after { position: absolute; content: ""; pointer-events: none; }
.mv::after { top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; background: url("../common/img/bg_circle.svg") no-repeat center/748px auto; z-index: 1; mix-blend-mode: multiply; }
.mv::before { top: 0; left: 0; width: 100%; height: 100%; background: radial-gradient(ellipse at center, rgba(254,255,255,1) 0%,rgba(239,239,239,1) 59%,rgba(200,200,200,1) 100%); opacity: .9; z-index: 0; }

.mv__inner { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%; opacity: 0; transition: .4s ease-out; z-index: 100; }
.mv__cont { width: 100%; margin-bottom: 30px; text-align: center; }
.mv__cont__ttl { font-size: 1.7rem; font-weight: 700; line-height: 1.647; letter-spacing: 0.2em; text-indent: 0.2em; }
.mv__cont__ttl strong { font-weight: 700; color: #ff662e; }
.mv__cont__logo { margin: 14px auto  32px; }
.mv__cont__logo img { width: 340px; }
.mv__cont__txt { font-size: 1.4rem; font-weight: 700; line-height: 1; letter-spacing: 0.2em; text-indent: 0.2em; }

.mv__btn { position: relative; display: flex; justify-content: center; align-items: center; min-width: 250px; height: 60px; background: linear-gradient(90deg, rgba(255,191,124,1) 3%, rgba(255,102,46,1) 100%); border-radius: 30px; border: none; padding-right: 15px; transition: all .3s ease; font-size: 1.2rem; font-weight: 500; line-height: 1; letter-spacing: 0.08em; color: #fff; }
.mv__btn::after { position: absolute; right: 20px; top: 50%; transform: translateY(-50%) rotate(45deg); width: 6px; height: 6px; border-right: 1px solid #fff; border-top: 1px solid #fff; content: ""; }

.mv__obj { position: absolute; opacity: 0; transition: .4s ease-out; z-index: 10; pointer-events: none; }
.mv__obj--circle_1,
.mv__obj--circle_2,
.mv__obj--circle_3,
.mv__obj--circle_4 { display: block; background: linear-gradient(125deg, rgba(255,191,124,1) 3%, rgba(255,102,46,1) 100%); border-radius: 50%; }
.mv__obj.is-visible,
.mv__inner.is-visible { opacity: 1; }
/*  for short Android  */
@media screen and (max-width: 374px) {
	.mv__cont__logo img { width: 320px; }
}
@media screen and (max-width: 374px) and (max-height: 600px) {
	
}

@media print, screen and (max-width:680px) {
	.header { display: none; }/*トップページSPのみなし*/
	.mv__btn:not(:last-of-type) { margin-bottom: 20px; }
	
	.mv__obj--chart_1,
	.mv__obj--chart_2,
	.mv__obj--circle_4,
	.mv__obj--mesh_1,
	.mv__obj--mesh_2 { display: none; }
	
	.mv__obj--book { top: 45px; left: 50%; transform: translateX(-134%); width: 164px; z-index: 20; }
	.mv__obj--cha_k { top: 10px; left: 50%; transform: translateX(-120%); width: 74px; z-index: 20; }
	.mv__obj--cha_t { top: 50px; right: 50%; transform: translateX(242%); width: 70px; z-index: 20; }
	.mv__obj--cha_c { bottom: 46px; left: 50%; transform: translateX(-183%); width: 80px; }
	
	.mv__obj--circle_1 { top: 95px; right: 50%; transform: translateX(557%); width: 20px; height: 20px; }
	.mv__obj--circle_2 { top: 50%; left: 50%; transform: translate(-1150%, 480%); width: 14px; height: 14px; }
	.mv__obj--circle_3 { bottom: 105px; right: 50%; transform: translateX(1450%); width: 10px; height: 10px; }
	
	.mv__obj--mesh_3 { top: 50%; right: 50%; transform: translate(175%, -30%); width: 110px; }
	.mv__obj--mesh_4 { top: 86px; left: 50%; transform: translateX(-123%);width: 145px; }
	.mv__obj--magni { bottom: -5px; right: 50%; transform: translateX(97%); width: 211px; }
	.mv__obj--measure { top: -40px; left: 50%; transform: translateX(-50%); width: 196px; }
	.mv__obj--pen { top: 85px; right: 50%; transform: translateX(187%); width: 134px; }
	.mv__obj--scissors { bottom: 50px; left: 50%; transform: translateX(-270%); width: 71px; }
	
}
@media print, screen and (min-width:681px) {
	.mv::after { background-size: 1698px auto; }
	.mv__inner { justify-content: flex-end; padding-bottom: 9vh; }
	.mv__cont { width: 100%; margin-bottom: 20vh; text-align: center; }
	.mv__cont__ttl { font-size: 2.4rem; line-height: 1; }
	.mv__cont__logo { margin: 36px auto 53px; }
	.mv__cont__logo img { width: 775px; }
	.mv__cont__txt { font-size: 2.5rem; }

	.mv__btn-wrap { display: flex; justify-content: center; align-items: center; }
	.mv__btn { min-width: 420px; height: 80px; background: #fff; border-radius: 40px; padding-right: 0; font-size: 1.8rem; letter-spacing: 0.15em; text-indent: 0.15em; color: #231815; }
	.mv__btn:nth-of-type(1) { padding-right: 10px; }
	.mv__btn:first-of-type { margin-right: 40px; }
	.mv__btn:hover { background: linear-gradient(90deg, rgba(255,191,124,1) 3%, rgba(255,102,46,1) 100%); color: #fff; }
	
	.mv__btn::after { right: 38px; width: 10px; height: 10px; border-right: 1px solid #231815; border-top: 1px solid #231815; transition: .3s; }
	.mv__btn:hover::after { border-color: #fff; }
	
	.mv__btn::before { position: absolute; top: 0; left: 0; right: 0; bottom: 0; border: 1px solid transparent; border-radius: 40px;　transition: transform 0.3s linear, border-width 0.3s linear, border-radius 0.3s linear, filter 0.6s linear; background-image: linear-gradient(90deg, rgba(255,191,124,1) 0%, rgba(255,102,46,1) 100%); background-origin: border-box; background-clip: border-box; -webkit-mask-image: linear-gradient(#fff 0 0), linear-gradient(#fff 0 0); -webkit-mask-clip: padding-box, border-box; -webkit-mask-composite: destination-out; mask-image: linear-gradient(#fff 0 0), linear-gradient(#fff 0 0); mask-clip: padding-box, border-box; -webkit-mask-composite: xor; mask-composite: exclude; content: ""; }
	
	.mv__obj--book { top: 50%; left: 50%; transform: translate(-160%, -110%); width: 416px; z-index: 20; }
	.mv__obj--cha_k { top: 50%; left: 50%; transform: translate(-233%, -241%); width: 147px; }
	.mv__obj--cha_t { top: 50%; right: 50%; transform: translate(769%, -93%); width: 70px; }
	.mv__obj--cha_c { top: 50%; left: 50%; transform: translate(-390%, 123%); width: 145px; }
	.mv__obj--chart_1 { top: 50%; right: 50%; transform: translate(200%, -314%); width: 123px; }
	.mv__obj--chart_2 { top: 50%; left: 50%; transform: translate(-160%, 243%); width: 194px; }
	.mv__obj--circle_1 { top: 165px; left: 50%; transform: translateX(-550%); width: 22px; height: 22px; }
	.mv__obj--circle_2 { top: 50%; left: 50%; transform: translate(-415%, -30%); width: 138px; height: 138px; }
	.mv__obj--circle_3 { top: 50%; left: 50%; transform: translate(248%, 303%); width: 62px; height: 62px; }
	.mv__obj--circle_4 { top: 50%; left: 50%; transform: translate(5800%, -300%); width: 10px; height: 10px; }
	.mv__obj--mesh_1 { top: 50%; right: 50%; transform: translate(220%, -135%); width: 252px; }
	.mv__obj--mesh_2 { top: 50%; left: 50%; transform: translate(-305%, 55%); width: 244px; }
	.mv__obj--mesh_3 { top: 50%; right: 50%; transform: translate(565%, 10%); width: 118px; }
	.mv__obj--mesh_4 { top: 50%; left: 50%; transform: translate(-234%, -268%); width: 244px; }
	.mv__obj--magni { top: 50%; right: 50%; transform: translate(160%, 26%); width: 491px; }
	.mv__obj--measure { top: 50%; right: 50%; transform: translate(214%, -130%); width: 345px; }
	.mv__obj--pen { top: 50%; left: 50%; transform: translate(-12%, -252%); width: 389px; }
	.mv__obj--scissors { top: 50%; left: 50%; transform: translate(-437%, 12%); width: 145px; }
}
@media print, screen and (min-width:1451px) {
	.mv__obj--magni { top: auto; bottom: 0; right: 0; transform: none; }
}
/*
.mv__cont { position: absolute; left: 20px; top: 50%; margin-bottom: -80%; }
.mv__cont__ttl { width: 238px; margin-bottom: 8px; }
.anittl--mv { display: inline-block; }
.anittl--mv:before { background: linear-gradient(to right, rgba(49,103,199,1) 0%, rgba(74,166,233,1) 100%); }
.anittl--mv__list__item { display: inline-flex; }
.anittl--mv .anittl__txt { color: #fff; }
.mv .anittl { display: inline-flex; align-items: center; height: 30px; padding: 0 8px; font-size: 2.2rem; font-weight: 300; line-height: 1; color: #fff; }
.mv .anittl:not(:last-of-type) { margin-bottom: 10px; }
.mv .anittl strong { font-weight: 900; }

.mv .anittl:before { animation: anittlbg .5s 1 0.5s ease-out forwards; }
.mv .anittl__txt { animation: anittltxt .5s 1 1.0s ease-out forwards; }

.mv .anittl:nth-of-type(1):before { animation-delay: 0.5s; }
.mv .anittl:nth-of-type(2):before { animation-delay: 1.2s; }
.mv .anittl:nth-of-type(3):before { animation-delay: 1.9s; }
.mv .anittl:nth-of-type(1) .anittl__txt { animation-delay: 1.0s; }
.mv .anittl:nth-of-type(2) .anittl__txt { animation-delay: 1.7s; }
.mv .anittl:nth-of-type(3) .anittl__txt { animation-delay: 2.4s; }

.top-mv__sp{ width: 100%; height: 100%; border: none; position: absolute;}
.top-mv__pc{ display: none;}


.mv__scroll { position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); display: flex; justify-content: center; align-items: flex-end; width: 3px; 	height: 57px; overflow: hidden; opacity: 0; transition: .5s;}
.mv__scroll.on{ opacity: 1;}
.mv__scroll span { display: inline-block; position: absolute; top: 0; width: 1px; height: 100%; background-color: #000; margin-left: auto; margin-right: auto; }
.mv__scroll span:before { content:''; display:block; width: 3px; height: 3px; background-color: #000; border-radius: 50%; position:absolute; left:50%; transform: translateX(-50%); top:0; -webkit-animation:indicate 2s infinite ease-in-out; animation:indicate 2s infinite ease-in-out }
*/


@keyframes indicate {
	from {
		transform: translate(-50%, -102%)
	}
	to {
		transform: translate(-50%, 5000%)
	}
}



.sec--mission { overflow: hidden; padding-top: 0; padding-bottom: 0; }

.video-box { position: absolute; top: 0; overflow: hidden; width: 100%; height: 100%; }
.video { position: absolute; top: 50%; left: 50%; min-width: 100%; min-height: 100%; transform: translate(-50%, -50%); }
.overlay::after { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; content: ""; background: url("/common/img/pattern_blue.svg") repeat 0 0/2px 2px; mix-blend-mode: multiply; opacity: 0.9; }
.mission__cont { position: relative; width: calc(100% - 40px); margin: 55px auto 45px; z-index: 5; color: #fff; }
.mission__cont__ttl { margin-bottom: 50px; font-size: 2.2rem; font-weight: 300; line-height: 1.3; text-shadow: 0px 0px 5px rgba(7, 88, 155, 0.75); mix-blend-mode: multiply; }
.mission__cont__ttl strong { font-weight: 900; }
.mission__cont__txt { font-size: 1.3rem; font-weight: 500; line-height: 2; text-shadow: 0px 0px 5px rgba(7, 88, 155, 0.75); mix-blend-mode: multiply; }
.mission__cont__txt p:not(:last-of-type) { margin-bottom: 25px; }

@media print, screen and (max-width:374px) {
	.mission__cont__txt { font-size: 1.2rem; }
}
@media print, screen and (min-width:681px) {
	.mission__cont { display: flex; justify-content: center; align-items: center; margin-top: 80px; margin-bottom: 80px; }
	.mission__cont__ttl { font-size: 2.7rem; letter-spacing: 0.3em; }
	.mission__cont__txt { width: 420px; margin-left: 140px; font-size: 1.5rem; }
	.mission__cont__txt:before { display: block; width: 250px; height: 175px; background: url("../img/bg_misson_cont_txt.svg") no-repeat 0 0/100% auto; margin-bottom: 35px; content: ""; }
}


/**********************
*　Business
***********************/
.business-wrap { margin-top: 42px; }

.business__img { position: relative; }
.business__img img { position: relative; z-index: 5; }
.business .business__cont { position: relative; padding-top: 35px; }
.business .business__cont:before { position: absolute; display: block; background: no-repeat 0 0/ 100% auto; content: ""; z-index: 0; }
.business:nth-child(1) .business__cont:before { top: -2px; left: -25px; width: 239px; height: 187px; background-image: url("../img/bg_business_1.svg"); }
.business:nth-child(2) .business__cont:before { top: -15px; left: -25px; width: 374px; height: 282px; background-image: url("../img/bg_business_2.svg"); }
.business:nth-child(3) .business__cont:before { top: 25px; left: -25px; width: 373px; height: 256px; background-image: url("../img/bg_business_3_sp.svg"); }
.business:nth-child(3) .business__cont { padding-top: 0; }
.business__cont__label { padding: 7px 14px 8px; position: relative; z-index: 5;}
.business__cont__label:before { background: #006cb2; }
.business__cont__label__txt { font-size: 1.5rem; font-weight: 900; line-height: 1.3; letter-spacing: 0.12em; color: #e6f53f; }


.business__cont__ttl { position: relative; margin-top: 20px; font-size: 2.0rem; font-weight: 700; line-height: 1.65; letter-spacing: 0.15em; color: #006cb2; z-index: 5; }
.business__cont__txt { position: relative; margin-top: 24px; font-size: 1.4rem; font-weight: 400; line-height: 2; text-align: justify; z-index: 5;}
.btn--business-wrap { margin-top: 25px; }
.btn--business { position: relative; background: #e6f53f; max-width: 250px; height: 60px; border-radius: 30px; font-size: 1.2rem; font-weight: 500; line-height: 1; letter-spacing: 0.15em; text-indent: 0.15em; color: #000; text-align: center; z-index: 5;}
.btn--business:not(:last-of-type) { margin-bottom: 20px; }
.btn--ktdc { position: relative; display: flex; justify-content: center; align-items: center; height: 80px; border-radius: 10px; margin-top: 15px; box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.05); text-align: center; }
.btn--ktdc img { width: 290px; }

@media print, screen and (max-width:374px) {
	.business__cont__label__txt { font-size: 1.4rem; }
}

@media print, screen and (max-width:680px) {
	.business:not(:last-of-type) { margin-bottom: 50px; }
	.business .business__cont:before { opacity: 0.5; }
	.business:nth-child(1) .business__img { margin-left: -20px; }
	.business:nth-child(2) .business__img { margin-right: -20px; }
	.btn--business { margin-left: auto; margin-right: auto; }
	.btn--ktdc { background: #ff662e; }
	.btn--ktdc ._color { display: none; }
}

@media print, screen and (min-width:681px) {
	.business { display: flex; }
	.business:nth-child(1) { justify-content: space-between; align-items: flex-start; }
	.business:nth-child(1) .business__img { order: 2; width: 510px; margin-left: 80px; }
	.business:nth-child(1) .business__img:before { position: absolute; right: -60px; bottom: -60px; width: 136px; height: 136px; background: linear-gradient(to right,  rgba(49,103,199,1) 0%,rgba(74,166,233,1) 100%); content: ""; }
	
	.business__cont { order: 1; flex: 1; }
	.business:nth-child(1) .business__cont:before { top: -90px; left: -207px; width: 446px; height: 335px; }
	.business:nth-child(3) .business__cont:before { top: auto; bottom: 50px; left: 0; width: 465px; height: 167px; background-image: url("../img/bg_business_3_pc.svg"); z-index: 1; }
	.business:nth-child(3) .business__cont:after { position: absolute; left: -30px; bottom: 0; width: 80px; height: 80px; background: linear-gradient(to right,  rgba(49,103,199,1) 0%,rgba(74,166,233,1) 100%); content: ""; z-index: 0; }
	
	.business:nth-child(2) { position: relative; justify-content: center; align-items: center; margin-top: 65px; margin-bottom: 55px; padding-bottom: 90px; }
	.business:nth-child(2) .business__img { position: absolute; left: 0; top: 120px; width: 460px; height: 440px; }
	.business:nth-child(2) .business__cont { position: relative; padding-left: 315px; padding-right: 275px; z-index: 5; }
	.business:nth-child(2) .business__cont:before { top: 155px; left: auto; right: 0; width: 380px; height: 280px; }
	
	
	.business:nth-child(3) .business__cont { padding-left: 630px; }
	.business:nth-child(3) .business__cont__txt { letter-spacing: 0.02em; }
	
	.business__cont__label { width: 100%; padding: 9px 14px 10px; }
	.business__cont__label__txt { font-size: 1.7rem; }
	.business__cont__ttl { margin-top: 28px; font-size: 2.6rem; }
	.business__cont__txt { font-size: 1.5rem; }
	
	.btn--business-wrap { margin-top: 43px; }
	.btn--business { position: relative; max-width: 310px; font-size: 1.4rem; overflow: hidden; transition: all .3s; }
	.btn--business:not(:last-of-type) { margin-bottom: 25px; }
	.btn--business span { position: relative; z-index: 5; }
	.btn--business:before { position: absolute; top: 0; left: -130%; transform: skewX(-45deg); width:120%; height: 100%; background: #006CB3; content: ""; transition: all .3s;}
	.btn--business:hover { background: #f5f9aa; }
	.btn--business:hover span{ color: #fff;}
	.btn--business:hover:before { left: -10%; }
	.btn--ktdc { height: 90px; background: rgba(255,255,255,0.8); transition: .4s; }
	.btn--ktdc img { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 305px; transition: .4s; }
	.btn--ktdc ._white { opacity: 0; }
	.btn--ktdc:hover { background: #ff662e; }
	.btn--ktdc:hover ._white { opacity: 1; }
	.btn--ktdc:hover ._color { opacity: 0; }
	
}

.aos-animate .anibtn{ animation: anibtntxt .8s 1 1s ease-out; }
.aos-animate .anibtn:before{ animation: anibtnbg .8s 1 1s ease-out; }
@keyframes anibtntxt {
	0% { color: #000; }
	50% { color: #fff; }
	100% {  color: #000; }
}
@keyframes anibtnbg {
	0% { left: -130%; }
	50% { left: -10%; }
	100% { left: 130%; }
}


/**********************
*　Business
***********************/
.sec--company { padding-bottom: 75px; }
.sec--company .cont-wrap { position: relative; z-index: 5; }
.company { background-color: rgba(255,255,255,0.8); box-shadow: 10px 10px 10px 5px rgba(0, 0, 0, 0.1); padding-top: 35px; padding-bottom: 25px; }
.company__cont { margin-top: 50px; }
.company__ttl { margin-bottom: 17px; }
.company__ttl .main-ttl__jp { font-size: 1.8rem; }
.company__ttl .main-ttl__en { font-size: 0.9rem; }


@media print, screen and (max-width:680px) {
	.company:nth-child(1) { margin-bottom: 14px; }
}

@media print, screen and (min-width:681px) {
	.company__cont { display: flex; justify-content: space-between; }
	.company { width: 475px; padding-top: 90px; padding-bottom: 65px; }
	.company__ttl { margin-bottom: 25px; }
	.company__ttl .main-ttl__jp { font-size: 2.5rem; }
	.company__ttl .main-ttl__en { font-size: 1.2rem; }
}
