@charset "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=Sorts+Mill+Goudy&display=swap');


/* common
------------------------------------------------- */
.eng-mill {
	font-family: "Sorts Mill Goudy", serif;
    font-weight: 400;
    font-style: normal;
}
.character {
    position: absolute;
}
.bgwiz {
    position: fixed;
    right: 1.5em;
    bottom: 1.5em;
    z-index: -1;
}
.bgwiz p {
    font-weight: 400;
    line-height: 0.85;
	color: #fff;
    text-align: right;
    position: absolute;
    right: 0.2em;
    bottom: -0.2em;
    z-index: 2;
}
.bgwiz p span {
    display: block;
	font-weight: 400;
    padding-right: 0.2em;
}
.bgwiz p span i.ls1 {
	letter-spacing: -0.08em;
}
.bgwiz p span i.ls2 {
	letter-spacing: -0.035em;
}
@media only screen and (max-width:750px){
.bgwiz {
    display: none;
}
}


/* mainvisual
------------------------------------------------- */
.mainvisual {
	width: 100%;
	background-color: #fff;
	padding: 7.5em 0 6em;
    margin-bottom: 8.875em;
    position: relative;
    z-index: 2;
}
.mainvisual .mainimg {
	height: 30em;
	border-radius: 0.75em;
	padding: 0 4.5em;
    margin-bottom: 6em;
	display: flex;
	align-items: center;
	box-sizing: border-box;
    position: relative;
    overflow: hidden;
}
.mainvisual .mainimg h1 {
    width: 16.75em;
    position: relative;
    z-index: 2;
}
.mainvisual .mainimg p {
	font-weight: 400;
    line-height: 0.85;
	color: #fff;
    text-align: right;
    position: absolute;
    right: 0.2em;
    bottom: -0.2em;
    z-index: 2;
}
.mainvisual .mainimg p span {
    display: block;
	font-weight: 400;
    padding-right: 0.2em;
}
.mainvisual .mainimg p span i.ls1 {
	letter-spacing: -0.08em;
}
.mainvisual .mainimg p span i.ls2 {
	letter-spacing: -0.035em;
}
.mainvisual .mainimg .main-slider {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
}
/*.mainvisual .mainimg .main-slider::before {
    content: '';
    width: 100%;
    height: 100%;
    background: url("../img/wizard/mainimg_bg1.png") center center no-repeat;
    background-size: 100% 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 2;
}*/
.mainvisual .mainimg .main-slider::after {
    content: '';
    width: 35.715%;
    height: 100%;
    background: url("../img/wizard/mainimg_bg2.png") center center no-repeat;
    background-size: 100% 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    mix-blend-mode: multiply;
}
.mainvisual .mainimg .main-slider .swiper-slide {
    width: 100%;
    height: 100%;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}
.mainvisual .mainimg .main-slider .swiper-slide.main1 {
    background-image: url("../img/wizard/mainimg1.jpg");
}
.mainvisual .mainimg .main-slider .swiper-slide.main2 {
    background-image: url("../img/wizard/mainimg2.jpg");
}
.mainvisual .mainimg .main-slider .swiper-slide.main3 {
    background-image: url("../img/wizard/mainimg3.jpg");
}
.mainvisual .mainimg .main-slider .swiper-slide.main4 {
    background-image: url("../img/wizard/mainimg4.jpg");
}
.mainvisual .mainimg .main-slider .swiper-slide.main5 {
    background-image: url("../img/wizard/mainimg5.jpg");
}
.mainvisual .ttlbox {
    width: 50%;
    position: relative;
}
.mainvisual .ttlbox h2 {
    font-weight: 400;
    line-height: 0.85;
    color: #0057AA;
    padding: 0.3em 0 0 0.5em;
}
.mainvisual .ttlbox h2 span {
    display: block;
	font-weight: 400;
    padding-left: 1.075em;
}
.mainvisual .ttlbox h2 i.ls1 {
	letter-spacing: -0.08em;
}
.mainvisual .ttlbox h2 i.ls2 {
	letter-spacing: -0.035em;
}
.mainvisual .ttlbox p {
    font-weight: 500;
    line-height: 1.6;
    letter-spacing: 0.04em;
    color: #0057AA;
    padding: 1em 0 0 7.6em;
}
.mainvisual .ttlbox p span {
    display: inline-block;
    padding-left: 0.5em;
}
.mainvisual .ttlbox .chara002 {
    left: 0;
    bottom: 2.15em;
}
.mainvisual .ttlbox .chara002 img {
    top: auto;
    bottom: 0;
}
.mainvisual .ttlbox .chara002 .frame1 {
	animation: wf1anime-1 4s infinite;
	animation-timing-function: steps(1, end);
}
.mainvisual .ttlbox .chara002 .frame2 {
	animation: wf1anime-2 4s infinite;
	animation-timing-function: steps(1, end);
}
.mainvisual .con {
    width: 50%;
    margin-top: 1em;
}
.mainvisual .con p {
    line-height: 2;
    white-space: nowrap;
}
.mainvisual .wiznav {
    padding-top: 4em;
}
.mainvisual .wiznav ul li {
	width: 31.624%;
}
.mainvisual .wiznav ul li a {
	display: flex;
	align-items: center;
	border-bottom: 1px solid rgba(42,54,62,0.2);
	line-height: 4rem;
	font-weight: 500;
	position: relative;
}
.mainvisual .wiznav ul li a::before {
	content: '';
	width: 0;
	height: 1px;
	background-color: #029098;
	position: absolute;
	left: 0;
	bottom: -1px;
	transition: 0.4s;
}
.mainvisual .wiznav ul li a span {
	width: 2rem;
	height: 2rem;
	position: absolute;
	right: 1rem;
	top: 1rem;
	overflow: hidden;
}
.mainvisual .wiznav ul li a span::before,
.mainvisual .wiznav ul li a span::after {
	content: '';
	width: 0.8rem;
	height: 0.4rem;
	background: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2213.414%22%20height%3D%227.207%22%20viewBox%3D%220%200%2013.414%207.207%22%3E%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_48775%22%20data-name%3D%22%E3%83%91%E3%82%B9%2048775%22%20d%3D%22M-16464.352-9661.47l6%2C6%2C6-6%22%20transform%3D%22translate(16465.059%209662.177)%22%20fill%3D%22none%22%20stroke%3D%22%23029098%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221%22%2F%3E%3C%2Fsvg%3E') center center no-repeat;
	background-size: cover;
	position: absolute;
	left: 50%;
	bottom: 50%;
	margin: 0 0 -0.2rem -0.4rem;
	transition: 0.4s;
}
.mainvisual .wiznav ul li a span::after {
	margin: 0 0 2rem -0.4rem;
}
@media only screen and (min-width:751px){
.mainvisual .wiznav ul li a:hover,
.mainvisual .wiznav ul li a:hover b {
	color: #029098;
}	
.mainvisual .wiznav ul li a:hover::before {
	width: 100%;
}
.mainvisual .wiznav ul li a:hover span::before {
	margin-bottom: -2rem;
}
.mainvisual .wiznav ul li a:hover span::after {
	margin-bottom: -0.2rem;
}
}
@media only screen and (max-width:750px){
.mainvisual {
	padding: 23.466vw 0 0;
	margin-bottom: 13.85vw;
}
.mainvisual .mainimg {
	height: 51.2vw;
	border-radius: 3.2vw;
	padding: 0 6.4vw;
	margin-bottom: 12.8vw;
}
.mainvisual .mainimg h1 {
	width: 35.733vw;
}
.mainvisual .mainimg p {
    display: none;
}
/*.mainvisual .mainimg .main-slider::before {
    background-image: url("../img/wizard/mainimg_bg1_sp.png");
}*/
.mainvisual .mainimg .main-slider::after {
    width: 50%;
}
.mainvisual .mainimg .main-slider .swiper-slide.main1 {
    background-image: url("../img/wizard/mainimg1_sp.jpg");
}
.mainvisual .mainimg .main-slider .swiper-slide.main2 {
    background-image: url("../img/wizard/mainimg2_sp.jpg");
}
.mainvisual .mainimg .main-slider .swiper-slide.main3 {
    background-image: url("../img/wizard/mainimg3_sp.jpg");
}
.mainvisual .mainimg .main-slider .swiper-slide.main4 {
    background-image: url("../img/wizard/mainimg4_sp.jpg");
}
.mainvisual .mainimg .main-slider .swiper-slide.main5 {
    background-image: url("../img/wizard/mainimg5_sp.jpg");
}
.mainvisual .ttlbox {
    width: 100%;
}
.mainvisual .ttlbox h2 {
    display: none;
}
.mainvisual .ttlbox p {
    font-size: 4.8vw;
    line-height: 1.5;
    letter-spacing: normal;
    padding: 0.5em 0 0 7.5em;
}
.mainvisual .ttlbox .chara002 {
    bottom: 0;
}
.mainvisual .con {
    width: 100%;
    margin-top: 8vw;
}
.mainvisual .con p {
    line-height: 1.8;
    white-space: normal;
}
.mainvisual .wiznav {
    width: 100vw;
    background-color: #F1F2F3;
    margin: 12vw 0 0 -5.2vw;
    padding: 12.8vw 0 1vw;
}
.mainvisual .wiznav ul li {
	width: 89.2%;
    margin: 0 auto 2.66vw;
}
.mainvisual .wiznav ul li a {
	background-color: #fff;
    border: none;
    border-radius: 3.2vw;
    box-shadow: 0 0 0.55vw 0 rgba(0,0,0,0.2);
    line-height: 14.933vw;
    padding: 0 5.866vw;
    margin-bottom: 3.2vw;
    box-sizing: border-box;
}
.mainvisual .wiznav ul li a::before {
	content: '';
	width: 0;
	height: 1px;
	background-color: #029098;
	position: absolute;
	left: 0;
	bottom: -1px;
	transition: 0.4s;
}
.mainvisual .wiznav ul li a::before {
	display: none;
}
.mainvisual .wiznav ul li a span::after {
	display: none;
}
}


/* cont1
------------------------------------------------- */
.cont1 {
	width: 96.55%;
	margin: 0 auto;
	padding-bottom: 9em;
	position: relative;
    z-index: 2;
}
.cont1 h4 {
    width: 100%;
    height: 3.84em;
    background-color: #4D5D67;
    border-radius: 0.5em;
	font-weight: 700;
    text-align: center;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 4em;
    position: relative;
    z-index: 3;
}
.cont1 h4::before,
.cont1 h4::after {
    content: '';
    width: 0.25rem;
    height: 2rem;
    background-color: #4D5D67;
    border-radius: 0.5rem;
    position: absolute;
    left: 13.375rem;
    top: 99%;
}
.cont1 h4::after {
    left: auto;
    right: 13.375rem;
}
.cont1 .sec {
    width: 100%;
    height: 52em;
    background-color: #fff;
    border-radius: 0.75em;
    margin-top: -3em;
    position: relative;
    z-index: 2;
}
.cont1 .sec::before {
    content: '';
    width: 3.12em;
    height: 3.12em;
    background: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2250.828%22%20height%3D%2250.829%22%20viewBox%3D%220%200%2050.828%2050.829%22%3E%20%3Cg%20id%3D%22%E3%82%B0%E3%83%AB%E3%83%BC%E3%83%97_62666%22%20data-name%3D%22%E3%82%B0%E3%83%AB%E3%83%BC%E3%83%97%2062666%22%20transform%3D%22translate(-649.586%20-2122.586)%22%3E%20%3Cline%20id%3D%22%E7%B7%9A_2175%22%20data-name%3D%22%E7%B7%9A%202175%22%20x2%3D%2248%22%20y2%3D%2248%22%20transform%3D%22translate(651%202124)%22%20fill%3D%22none%22%20stroke%3D%22%234d5d67%22%20stroke-linecap%3D%22round%22%20stroke-width%3D%222%22%2F%3E%20%3Cline%20id%3D%22%E7%B7%9A_2176%22%20data-name%3D%22%E7%B7%9A%202176%22%20y1%3D%2248%22%20x2%3D%2248%22%20transform%3D%22translate(651%202124)%22%20fill%3D%22none%22%20stroke%3D%22%234d5d67%22%20stroke-linecap%3D%22round%22%20stroke-width%3D%222%22%2F%3E%20%3C%2Fg%3E%3C%2Fsvg%3E') center center no-repeat;
    background-size: cover;
    position: absolute;
    left: 50%;
    top: 24.75em;
    margin-left: -1.56em;
    z-index: 3;
}
.cont1 .sec::after {
    content: '';
    width: 50%;
    height: 100%;
    background: linear-gradient(180deg, #0057AA, #009098);
    border-radius: 0.75em;
    opacity: 0.7;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1;
}
.cont1 .sec .con {
	width: 28em;
    padding-top: 6em;
    position: relative;
    z-index: 2;
}
.cont1 .sec .con h5 {
    font-weight: 500;
    line-height: 1.15;
    color: #0057AA;
    text-align: center;
    margin-bottom: 2.45em;
}
.cont1 .sec .con h5 span {
    display: block;
    font-weight: 500;
    line-height: 1.4;
    letter-spacing: 0.04em;
}
.cont1 .sec .con1 ul {
	width: 13.1em;
	height: 12.7em;
	margin: 0 4.8em 0 4.6em;
	position: relative;
}
.cont1 .sec .con1 ul li,
.cont1 .sec .con1 ul li span {
	width: 6em;
	height: 6em;
	background-color: #36526C;
	border-radius: 50%;
	color: #fff;
	display: flex;
	justify-content: center;
	align-items: center;
	font-weight: 500;
	position: relative;
}
.cont1 .sec .con1 ul li::after,
.cont1 .sec .con1 ul li::before,
.cont1 .sec .con1 ul li span::after,
.cont1 .sec .con1 ul li span::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
	background-color: rgba(0,87,170,0.3);
    width: 100%;
    height: 100%;
    border-radius: 50%;
    opacity: 1;
    animation: 4s circleanime linear infinite;
	z-index: -1;
}
.cont1 .sec .con1 ul li::before {
    animation-delay: 1s; 
}
.cont1 .sec .con1 ul li span::after {
    animation-delay: 2s; 
}
.cont1 .sec .con1 ul li span::before {
    animation-delay: 3s; 
}
@keyframes circleanime {
	0%{
		transform: scale(0.6);
	}
	100%{
		transform: scale(1.9);
		opacity: 0;
	}
}
.cont1 .sec .con1 ul li:nth-child(1) {
	margin-left: 4.45em;
}
.cont1 .sec .con1 ul li:nth-child(2) {
	position: absolute;
	left: 0;
	top: 5.65em;
}
.cont1 .sec .con1 ul li:nth-child(3) {
	margin: 0.7em 0 0 7.1em;
}
.cont1 .sec .con .chara1 {
    left: 1.625em;
    top: 24.8em;
}
.cont1 .sec .con .txt {
    line-height: 1.8;
    border-top: 1px solid rgba(0,0,0,0.2);
    padding-top: 2rem;
    margin-top: 3.3rem;
}
.cont1 .sec .con2 h5 {
    color: #fff;
    margin-bottom: 0;
    position: relative;
    z-index: 2;
}
.cont1 .sec .con2 ul {
    width: 20.8rem;
    margin: -1em auto 1.25rem;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}
.cont1 .sec .con2 ul li {
    width: 6.5rem;
    height: 6.5rem;
    margin: 0 0.3125rem;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}
.cont1 .sec .con2 ul li:nth-child(1),
.cont1 .sec .con2 ul li:nth-child(6){
    margin-left: 3.375rem;
}
.cont1 .sec .con2 ul li:nth-child(2),
.cont1 .sec .con2 ul li:nth-child(7){
    margin-right: 3.375rem;
}
.cont1 .sec .con2 ul li:nth-child(3),
.cont1 .sec .con2 ul li:nth-child(5){
    margin: 0;
}
.cont1 .sec .con2 ul li p {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    z-index: 2;
}
.cont1 .sec .con2 ul li span {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    z-index: 3;
}
.cont1 .sec .con2 ul li span b {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    z-index: 4;
}
.cont1 .sec .con2 ul li span b i {
    font-weight: 500;
    line-height: 1.4;
    text-align: center;
    color: #fff;
    position: relative;
    z-index: 5;
}
.cont1 .sec .con2 ul li p::before,
.cont1 .sec .con2 ul li p::after {
    content: '';
    width: 6.5rem;
    height: 6.5rem;
    background-color: rgba(255,255,255,0.1);
    border-radius: 50%;
    position: absolute;
    left: 50%;
    top: 50%;
    margin: -3.25rem 0 0 -3.25rem;
    z-index: 2;
    transform: scale(0.69);
    opacity: 0;
}
.cont1 .sec .con2 ul li::before,
.cont1 .sec .con2 ul li::after {
    content: '';
    width: 5.25rem;
    height: 5.25rem;
    border-radius: 50%;
    border: 1px solid rgba(255,255,255,0.4);
    position: absolute;
    left: 50%;
    top: 50%;
    margin: -2.625rem 0 0 -2.625rem;
    box-sizing: border-box;
    z-index: 2;
    transform: scale(0.69);
    opacity: 0;
}
.cont1 .sec .con2 ul li span::before,
.cont1 .sec .con2 ul li span::after,
.cont1 .sec .con2 ul li span i::before {
    content: '';
    width: 4.5rem;
    height: 4.5rem;
    background-color: rgba(255,255,255,0.1);
    border-radius: 50%;
    position: absolute;
    left: 50%;
    top: 50%;
    margin: -2.25rem 0 0 -2.25rem;
    z-index: 3;
    transform: scale(0.69);
    opacity: 0;
}
.cont1 .sec .con2 ul li p::before,
.cont1 .sec .con2 ul li::before,
.cont1 .sec .con2 ul li span::before {
    animation: 1.8s circleanime1 linear infinite;
}
.cont1 .sec .con2 ul li p::after,
.cont1 .sec .con2 ul li::after,
.cont1 .sec .con2 ul li span::after {
    animation: 1.8s circleanime1 linear 0.9s infinite;
}
@keyframes circleanime1 {
    0% {
        transform: scale(0.69);
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
    100% {
        transform: scale(1.44);
        opacity: 0;
    }
}
@keyframes circleanime2 {
    0% {
        transform: scale(0.6);
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
    100% {
        transform: scale(1.2);
        opacity: 0;
    }
}
.cont1 .sec .con2 h6 {
    font-weight: 500;
    line-height: 1.4;
    color: #fff;
    position: absolute;
    left: 10.625rem;
    top: 27.5rem;
}
.cont1 .sec .con2 .chara001 {
    left: 0;
    top: 25.3em;
    z-index: 5;
}
.cont1 .sec .con2 .txt {
    border-color: rgba(255,255,255,0.4);
    color: #fff;
}
.cont1 .box {
    width: 100%;
    height: 16em;
    background-color: #4D5D67;
    border-radius: 0.75em;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: -3.5em;
    position: relative;
    z-index: 2;
}
.cont1 .box p {
    text-align: center;
    color: #fff;
    line-height: 2;
}
.cont1 .box .img {
    width: 8em;
    height: 8em;
    background: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2264%22%20height%3D%2264%22%20viewBox%3D%220%200%2064%2064%22%3E%20%3Cdefs%3E%20%3CclipPath%20id%3D%22clip-path%22%3E%20%3Crect%20id%3D%22%E9%95%B7%E6%96%B9%E5%BD%A2_39859%22%20data-name%3D%22%E9%95%B7%E6%96%B9%E5%BD%A2%2039859%22%20width%3D%2264%22%20height%3D%2264%22%20transform%3D%22translate(-1.476%20-1.27)%22%20fill%3D%22none%22%20stroke%3D%22%23fff%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%223%22%2F%3E%20%3C%2FclipPath%3E%20%3C%2Fdefs%3E%20%3Cg%20id%3D%22%E3%82%B0%E3%83%AB%E3%83%BC%E3%83%97_64831%22%20data-name%3D%22%E3%82%B0%E3%83%AB%E3%83%BC%E3%83%97%2064831%22%20transform%3D%22translate(1.476%201.27)%22%20clip-path%3D%22url(%23clip-path)%22%3E%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_50004%22%20data-name%3D%22%E3%83%91%E3%82%B9%2050004%22%20d%3D%22M7.874%2C17.607A30.152%2C30.152%2C0%2C1%2C0%2C26.484%2C4.576%22%20transform%3D%22translate(-2.695%20-3.309)%22%20fill%3D%22none%22%20stroke%3D%22%23fff%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%222%22%2F%3E%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_50005%22%20data-name%3D%22%E3%83%91%E3%82%B9%2050005%22%20d%3D%22M60.517%2C69.306a19.142%2C19.142%2C0%2C1%2C0%2C14.321-10.02%22%20transform%3D%22translate(-46.93%20-47.54)%22%20fill%3D%22none%22%20stroke%3D%22%23fff%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%222%22%2F%3E%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_50006%22%20data-name%3D%22%E3%83%91%E3%82%B9%2050006%22%20d%3D%22M114.53%2C118.649a8.09%2C8.09%2C0%2C1%2C0%2C5.965-4.183%22%20transform%3D%22translate(-91.147%20-91.76)%22%20fill%3D%22none%22%20stroke%3D%22%23fff%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%222%22%2F%3E%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_50007%22%20data-name%3D%22%E3%83%91%E3%82%B9%2050007%22%20d%3D%22M195.362%2C10.892l2.542%2C3.64%2C1.919%2C2.748%2C8.951.942%2C2.351-8.834L209.205%2C6.64%2C206.664%2C3l-2.72%2C8.143Z%22%20transform%3D%22translate(-188.854%20-2.654)%22%20fill%3D%22none%22%20stroke%3D%22%23fff%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%222%22%2F%3E%20%3Cline%20id%3D%22%E7%B7%9A_2769%22%20data-name%3D%22%E7%B7%9A%202769%22%20x2%3D%2210.587%22%20y2%3D%2215.162%22%20transform%3D%22translate(19.92%2015.567)%22%20fill%3D%22none%22%20stroke%3D%22%23fff%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%222%22%2F%3E%20%3C%2Fg%3E%3C%2Fsvg%3E') center center no-repeat #4D5D67;
    background-size: 4em auto;
    border-radius: 50%;
    position: absolute;
    left: 50%;
    top: -4em;
    margin-left: -4em;
}
@media only screen and (max-width:750px){
.cont1 {
	width: 100%;
	padding-bottom: 11.5vw;
}
.cont1 h4 {
    height: 34.133vw;
    border-radius: 3.2vw;
    font-size: 4.8vw;
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: 0.048em;
    margin-top: 13.866vw;
}
.cont1 h4::before {
    width: 1vw;
    height: 6.4vw;
    border-radius: 2vw;
    left: 50%;
    top: 99%;
    margin-left: -0.5vw;
}
.cont1 h4::after {
    display: none;
}
.cont1 .sec {
    height: auto;
    border-radius: 3.2vw;
    margin-top: -13.866vw;
}
.cont1 .sec::before {
    width: 8.533vw;
    height: 8.533vw;
    background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2234.828%22%20height%3D%2234.829%22%20viewBox%3D%220%200%2034.828%2034.829%22%3E%20%3Cg%20id%3D%22%E3%82%B0%E3%83%AB%E3%83%BC%E3%83%97_62666%22%20data-name%3D%22%E3%82%B0%E3%83%AB%E3%83%BC%E3%83%97%2062666%22%20transform%3D%22translate(-649.586%20-2122.586)%22%3E%20%3Cline%20id%3D%22%E7%B7%9A_2175%22%20data-name%3D%22%E7%B7%9A%202175%22%20x2%3D%2232%22%20y2%3D%2232%22%20transform%3D%22translate(651%202124)%22%20fill%3D%22none%22%20stroke%3D%22%234d5d67%22%20stroke-linecap%3D%22round%22%20stroke-width%3D%222%22%2F%3E%20%3Cline%20id%3D%22%E7%B7%9A_2176%22%20data-name%3D%22%E7%B7%9A%202176%22%20y1%3D%2232%22%20x2%3D%2232%22%20transform%3D%22translate(651%202124)%22%20fill%3D%22none%22%20stroke%3D%22%234d5d67%22%20stroke-linecap%3D%22round%22%20stroke-width%3D%222%22%2F%3E%20%3C%2Fg%3E%3C%2Fsvg%3E');
    top: 165.33vw;
    margin-left: -4.2665vw;
}
.cont1 .sec::after {
    width: 100%;
    height: 190vw;
    border-radius: 0 0 0.75em 0.75em;
    top: 170vw;
}
.cont1 .sec .con {
	width: 100%;
    box-sizing: border-box;
}
.cont1 .sec .con1 {
    height: 170vw;
    padding-top: 28.8vw;
}
.cont1 .sec .con h5 {
    line-height: 1.15;
    text-align: left;
    margin-bottom: 49.75vw;
}
.cont1 .sec .con h5 span {
    font-size: 8vw;
    line-height: 1.4;
}
.cont1 .sec .con1 ul {
	width: 52.4vw;
	height: 50.8vw;
	margin: 0;
	position: absolute;
	right: 7.2vw;
	top: 35.733vw;	
}
.cont1 .sec .con1 ul li b {
	font-size: 5.866vw;
}
.cont1 .sec .con1 .chara1 {
	width: 25.6vw;
	left: 6.4vw;
	top: 68.8vw;
}
.cont1 .sec .con .txt {
    padding-top: 6.4vw;
    margin-top: 0;
}
.cont1 .sec .con2 {
    height: 190vw;
    padding-top: 17.5vw;
}
.cont1 .sec .con2 h5 {
    margin-bottom: 52vw;
}
.cont1 .sec .con2 ul {
    width: 66.133vw;
    margin: 0;
    position: absolute;
    right: 0;
    top: 19vw;
}
.cont1 .sec .con2 ul li {
    width: 21.33vw;
    height: 21.33vw;
    margin: -2vw 0.5vw 0;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}
.cont1 .sec .con2 ul li:nth-child(1),
.cont1 .sec .con2 ul li:nth-child(6){
    margin-left: 10.5vw;
}
.cont1 .sec .con2 ul li:nth-child(2),
.cont1 .sec .con2 ul li:nth-child(7){
    margin-right: 10.5vw;
}
.cont1 .sec .con2 ul li:nth-child(3),
.cont1 .sec .con2 ul li:nth-child(5){
    margin: 0;
}
.cont1 .sec .con2 ul li span i {
    font-size: 3.733vw;
    line-height: 1.21;
}
.cont1 .sec .con2 ul li p::before,
.cont1 .sec .con2 ul li p::after {
    transform: scale(0.6);
}
.cont1 .sec .con2 ul li::before,
.cont1 .sec .con2 ul li::after {
    transform: scale(0.6);
}
.cont1 .sec .con2 ul li span::before,
.cont1 .sec .con2 ul li span::after {
    transform: scale(0.6);
}
.cont1 .sec .con2 ul li span i::before {
    width: 4rem;
    height: 4rem;
    margin: -2rem 0 0 -2rem;
}
.cont1 .sec .con2 ul li p::before,
.cont1 .sec .con2 ul li::before,
.cont1 .sec .con2 ul li span::before {
    animation: 1.8s circleanime2 linear infinite;
}
.cont1 .sec .con2 ul li p::after,
.cont1 .sec .con2 ul li::after,
.cont1 .sec .con2 ul li span::after {
    animation: 1.8s circleanime2 linear 0.9s infinite;
}
.cont1 .sec .con2 h6 {
    display: none;
}
.cont1 .sec .con2 .chara001 {
    left: 6.4vw;
    top: 59.6vw;
}
.cont1 .box {
    height: 68vw;
    border-radius: 3.2vw;
    margin-top: -22vw;
    padding: 0.25em 0 0;
    box-sizing: border-box;
}
.cont1 .box p {
    line-height: 1.8;
    white-space: nowrap;
}
.cont1 .box .img {
    width: 21.33vw;
    height: 21.33vw;
    background-size: 10.66vw auto;
    top: -10.66vw;
    margin-left: -10.66vw;
}
}


/* cont2
------------------------------------------------- */
#anchor2 {
    position: relative;
    z-index: 3;
}
.cont2 {
    height: 50.1875em;
	padding-bottom: 2em;
    position: relative;
    z-index: 2;
}
.cont2 .headline3 {
	margin-bottom: 3.84em;
}
.cont2 .block {
	width: 96.55%;
    height: 34em;
    background-color: #000;
    margin: 0 auto;
    border-radius: 0.75em;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    overflow: hidden;
    position: relative;
}
.cont2 .block::before,
.cont2 .block::after {
    content: '';
	width: 50%;
    height: 100%;
    background: url("../img/wizard/cont2_bg1.jpg") center center no-repeat;
    background-size: cover;
    border-radius: 0.75em 0 0 0.75em;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    transition: 0.5s;
}
.cont2 .block::after {
	background-image: url("../img/wizard/cont2_bg2.jpg");
    border-radius: 0 0.75em 0.75em 0;
    left: auto;
    right: 0;
}
.cont2 .block.isAnimate::before,
.cont2 .block.isAnimate::after {
    opacity: 0.61;
}
.cont2 .block .con {
	width: 50%;
    text-align: center;
    position: relative;
    z-index: 2;
}
.cont2 .block .con.con1::after {
	content: '';
    width: 3.12em;
    height: 3.12em;
    background: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2250.828%22%20height%3D%2250.829%22%20viewBox%3D%220%200%2050.828%2050.829%22%3E%20%3Cg%20id%3D%22%E3%82%B0%E3%83%AB%E3%83%BC%E3%83%97_62666%22%20data-name%3D%22%E3%82%B0%E3%83%AB%E3%83%BC%E3%83%97%2062666%22%20transform%3D%22translate(-649.586%20-2122.586)%22%3E%20%3Cline%20id%3D%22%E7%B7%9A_2175%22%20data-name%3D%22%E7%B7%9A%202175%22%20x2%3D%2248%22%20y2%3D%2248%22%20transform%3D%22translate(651%202124)%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-linecap%3D%22round%22%20stroke-width%3D%222%22%2F%3E%20%3Cline%20id%3D%22%E7%B7%9A_2176%22%20data-name%3D%22%E7%B7%9A%202176%22%20y1%3D%2248%22%20x2%3D%2248%22%20transform%3D%22translate(651%202124)%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-linecap%3D%22round%22%20stroke-width%3D%222%22%2F%3E%20%3C%2Fg%3E%3C%2Fsvg%3E') center center no-repeat;
    background-size: cover;
    position: absolute;
    right: -1.56em;
    top: 0.5em;;
    z-index: 3;
}
.cont2 .block .con h4 {
    font-weight: 500;
    padding-bottom: 1.5em;
}
.cont2 .block .box {
	width: 44em;
    position: absolute;
    left: 50%;
    top: 20em;
    margin-left: -22em;
    padding: 0.5em 2em;
    box-sizing: border-box;
    z-index: 2;
}
.cont2 .block .box::before,
.cont2 .block .box::after {
	content: '';
    width: 1em;
    height: 9.5em;
    background: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216.5%22%20height%3D%22153%22%20viewBox%3D%220%200%2016.5%20153%22%3E%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_49921%22%20data-name%3D%22%E3%83%91%E3%82%B9%2049921%22%20d%3D%22M360.294%2C3540.851h-16v152h16%22%20transform%3D%22translate(-343.794%20-3540.351)%22%20fill%3D%22none%22%20stroke%3D%22%23fff%22%20stroke-width%3D%221%22%2F%3E%3C%2Fsvg%3E') left center no-repeat;
    background-size: cover;
    position: absolute;
    left: 0;
    top: 0;
}
.cont2 .block .box::after {
	transform: scale(-1, 1);
    left: auto;
    right: 0;
}
.cont2 .block .box p {
	line-height: 1.8;
}
@media only screen and (max-width:750px){
.cont2 {
    height: auto;
	padding-bottom: 12vw;
}
.cont2 .headline3 {
	margin-bottom: 12.8vw;
}
.cont2 .block {
	width: 100%;
    height: 166.6vw;
    background-color: rgba(0,0,0,0);
    border-radius: 0;
    display: block;
}
.cont2 .block::before {
	width: 100%;
    height: 85.33vw;
    background-image: url("../img/wizard/cont2_bg_sp.jpg");
    border-radius: 0;
}
.cont2 .block::after {
	display: none;
}
.cont2 .block.isAnimate::before,
.cont2 .block.isAnimate::after {
    opacity: 1;
}
.cont2 .block .con {
	width: 100%;
}
.cont2 .block .con.con1::after {
    width: 8.533vw;
    height: 8.533vw;
    background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2234.828%22%20height%3D%2234.829%22%20viewBox%3D%220%200%2034.828%2034.829%22%3E%20%3Cg%20id%3D%22%E3%82%B0%E3%83%AB%E3%83%BC%E3%83%97_62666%22%20data-name%3D%22%E3%82%B0%E3%83%AB%E3%83%BC%E3%83%97%2062666%22%20transform%3D%22translate(-649.586%20-2122.586)%22%3E%20%3Cline%20id%3D%22%E7%B7%9A_2175%22%20data-name%3D%22%E7%B7%9A%202175%22%20x2%3D%2232%22%20y2%3D%2232%22%20transform%3D%22translate(651%202124)%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-linecap%3D%22round%22%20stroke-width%3D%222%22%2F%3E%20%3Cline%20id%3D%22%E7%B7%9A_2176%22%20data-name%3D%22%E7%B7%9A%202176%22%20y1%3D%2232%22%20x2%3D%2232%22%20transform%3D%22translate(651%202124)%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-linecap%3D%22round%22%20stroke-width%3D%222%22%2F%3E%20%3C%2Fg%3E%3C%2Fsvg%3E');
    right: 50%;
    top: 38.4vw;
    margin-right: -4.2665vw;
}
.cont2 .block .con h4 {
    height: 42.66vw;
    font-size: 8vw;
    font-weight: 500;
    padding-bottom: 0;
    display: flex;
    justify-content: center;
    align-items: center;
}
.cont2 .block .box {
	width: 89.6%;
    position: static;
    margin: 0 auto;
    padding: 4.266vw 0;
}
.cont2 .block .box::before,
.cont2 .block .box::after {
    display: none;
}
.cont2 .block .box p {
	color: #2A363E;
}
}


/* col2
------------------------------------------------- */
.col2 {
    padding-top: 10.5em;
	margin-bottom: 8em;
}
.col2 .col2-main {
    width: 63em;
    margin: 0 auto;
}
.col2 .col2-main .historybox {
	width: 28em;
    height: 28em;
    margin: 0 auto 9em;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}
.col2 .col2-main .historybox::after {
	content: '';
    width: 100%;
    height: 100%;
    background: url("../img/wizard/cont3_bg.png") center center no-repeat;
    background-size: cover;
    position: absolute;
    left: 0;
    top: 0;
    transform: rotate(-180deg) scale(0.4);
    opacity: 0;
    transition: 0.4s;
}
.col2 .col2-main .historybox.isAnimate::after {
	transform: rotate(0deg) scale(1);
    opacity: 1;
}
.col2 .col2-main .historybox p {
    line-height: 2;
	text-align: center;
    position: relative;
    z-index: 2;
    opacity: 0;
    transition: opacity 0.4s 0.2s ease;
}
.col2 .col2-main .historybox.isAnimate p {
    opacity: 1;
}
.col2 .col2-main .historybox p span {
    font-weight: 500;
    color: #0057AA;
}
.col2 .col2-main .historybox .chara002 {
    left: 0;
    bottom: 2.15em;
}
.col2 .col2-main .historybox .chara002 img {
    top: auto;
    bottom: 0;
}
.col2 .col2-main .historybox.isAnimate .chara002 .frame1 {
	animation: wf1anime-5 4.5s infinite;
	animation-timing-function: steps(1, end);
    opacity: 0;
}
.col2 .col2-main .historybox.isAnimate .chara002 .frame2 {
	animation: wf1anime-6 4.5s infinite;
	animation-timing-function: steps(1, end);
}
.col2 .col2-nav2 {
    width: 11em;
    height: 100%;
    position: sticky;
    top: calc(50vh - 13em);
    margin: -4em 0 6.25em;
}
.col2 .col2-nav2 ul li a {
    display: inline-block;
    font-weight: 500;
    line-height: 1.4;
    color: #4D5D67;
}
.col2 .col2-nav2 ul li a.tit {
    padding-bottom: 0.8em;
}
.col2 .col2-nav2 ul li.current a.tit {
    color: #0057AA;
}
.col2 .col2-nav2 ul li ul {
    padding: 0 0 1em 2.15em;
    position: relative;
}
.col2 .col2-nav2 ul li ul::before {
    content: '';
    width: 0.125rem;
    height: 60%;
    background-color: #fff;
    position: absolute;
    left: 0.2rem;
    top: 0.3rem;
    z-index: 1;
}
.col2 .col2-nav2 ul li ul.no2::before {
    height: 50%;
}
.col2 .col2-nav2 ul li ul li {
    margin-bottom: 0.85em;
}
.col2 .col2-nav2 ul li ul li a {
    line-height: 1.23;
    color: rgba(42,54,62,0.5);
    position: relative;
}
.col2 .col2-nav2 ul li.current ul li.current a {
    color: #2A363E;
}
.col2 .col2-nav2 ul li ul li a span {
    display: block;
    font-weight: 600;
    position: relative;
    transition: 0.4s;
}
.col2 .col2-nav2 ul li.current ul li.current a span {
    color: #0057AA;
}
.col2 .col2-nav2 ul li ul li a span::before,
.col2 .col2-nav2 ul li ul li a span::after {
    content: '';
    width: 0.75rem;
    height: 0.75rem;
    background-color: #fff;
    border-radius: 50%;
    position: absolute;
    left: -2em;
    top: 50%;
    margin-top: -0.375rem;
    z-index: 1;
    transition: 0.4s;
}
.col2 .col2-nav2 ul li ul li a span::after {
    width: 0.5rem;
    height: 0.5rem;
    background-color: #0057AA;
    left: -1.875em;
    top: 50%;
    margin-top: -0.25rem;
    z-index: 2;
    opacity: 0;
}
.col2 .col2-nav2 ul li.current ul li.current a span::after {
    opacity: 1;
}
.col2 .col2-nav2 .chara004 {
    position: relative;
    margin-left: 2.1875em;
    transform: translateX(-10em);
    transition: 0.4s;
}
.col2 .col2-nav2.isAnimate .chara004 {
    transform: translateX(0);
}
.col2 .col2-nav2.isAnimate .chara004 .frame1 {
	animation: wf1anime-3 4.5s infinite;
	animation-timing-function: steps(1, end);
}
.col2 .col2-nav2.isAnimate .chara004 .frame2 {
	animation: wf1anime-4 4.5s infinite;
	animation-timing-function: steps(1, end);
}
.col2 .cont3-bg {
    width: 100vw;
    height: 100vh;
    background: linear-gradient(180deg, #0057AA, #009098);
    position: fixed;
    left: 0;
    top: 0;
    z-index: -1;
    opacity: 0;
    transition: 0.4s;
}
.col2.is-active .cont3-bg {
    opacity: 0.1;
}
@media only screen and (min-width:751px){
.col2 .col2-main .navsp {
    display: none;
}
.col2 .col2-nav2 ul li a.tit:hover {
    color: #0057AA;
}
.col2 .col2-nav2 ul li ul li a:hover {
    color: #2A363E;
}
.col2 .col2-nav2 ul li ul li a:hover span {
    color: #0057AA;
}
}
@media only screen and (max-width:750px){
.col2 {
    width: 100%;
    display: block;
    padding-top: 0;
	margin: 0 0 17vw;
}
.col2 .col2-main {
    width: 100%;
    margin: 0 auto;
}
.col2 .col2-main .navsp {
    width: 100%;
    position: sticky;
    bottom: 0;
    z-index: 8;
    margin-top: 10vw;
}
.col2 .col2-main .navsp ul {
    display: flex;
    justify-content: space-between;
    position: relative;
}
.col2 .col2-main .navsp ul::after {
    content: '';
    width: 1px;
    height: 100%;
    background-color: #DDDDDD;
    position: absolute;
    left: 50%;
    top: 0;
}
.col2 .col2-main .navsp ul li {
    width: 50%;
    position: relative;
}
.col2 .col2-main .navsp ul li a {
    display: block;
    width: 100%;
    height: 17vw;
    background: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2213.414%22%20height%3D%227.207%22%20viewBox%3D%220%200%2013.414%207.207%22%3E%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_46578%22%20data-name%3D%22%E3%83%91%E3%82%B9%2046578%22%20d%3D%22M-16464.352-9661.47l6%2C6%2C6-6%22%20transform%3D%22translate(16465.059%209662.177)%22%20fill%3D%22none%22%20stroke%3D%22%23029098%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221%22%2F%3E%3C%2Fsvg%3E') 90% center no-repeat #fff;
    background-size: 3.466vw auto;
    font-size: 3.466vw;
    font-weight: 500;
    line-height: 1.3;
    color: rgba(42,54,62,0.5);
    padding: 3.5vw 0 0 5.33vw;
    box-sizing: border-box;
} 
.col2 .col2-main .navsp ul li a span {
    display: block;
    font-weight: 600;
    letter-spacing: 0.01em;
    padding-top: 0.1em;
    transition: 0.4s;
} 
.col2 .col2-main .navsp ul li.current a {
    color: #2A363E;
} 
.col2 .col2-main .navsp ul li.current a span {
    color: #0057AA;
}
.col2 .col2-main .historybox {
	width: 89.6vw;
    height: 89.6vw;
    margin: 0 auto 2.25em;
}
.col2 .col2-main .historybox .chara002 {
    left: 0;
    bottom: 0;
}
.col2 .col2-nav2 {
    display: none;
}
}


/* cont3
------------------------------------------------- */
.cont3 {
    padding-bottom: 2em;
}
#anchor3-4 .cont3 {
    padding-bottom: 0;
}
.cont3 .sec .con {
	width: 51%;
    position: relative;
}
.cont3 .sec .con h3 {
    font-weight: 500;
    line-height: 1.45;
    border-bottom: 1px solid #fff;
    padding-bottom: 0.65em;
    margin-bottom: 4.5em;
    position: relative;
}
.cont3 .sec .con h3::after {
    content: '';
    width: 100%;
    height: 1px;
    background: linear-gradient(90deg, #0057AA, #009098);
    position: absolute;
    left: 0;
    bottom: 1px;
    z-index: 1;
}
.cont3 .sec .con h3 span {
    font-weight: 500;
    color: #0057AA;
}
.cont3 .sec .con dl {
    margin: 0 0 6em 4em;
    position: relative;
}
.cont3 .sec .con dl::before,
.cont3 .sec .con dl::after {
    content: '';
    width: 13.5em;
    height: 13.5em;
    background-color: rgba(255,255,255,0.2);
    border-radius: 50%;
    position: absolute;
    left: -4em;
    top: 50%;
    margin-top: -6.75em;
    z-index: 1;
    opacity: 0;
    transform: scale(0.6);
}
.cont3 .sec .con dl::after {
    width: 11em;
    height: 11em;
    background-color: rgba(255,255,255,0.6);
    left: -2.75em;
    top: 50%;
    margin-top: -5.5em;
    z-index: 2;
}
.cont3 .sec .con dl i {
    display: block;
    width: 12rem;
    height: 12rem;
    border: 2px solid rgba(255,255,255,0.6);
    border-radius: 50%;
    position: absolute;
    left: -3.25rem;
    top: 50%;
    margin-top: -6rem;
    z-index: 1;
    opacity: 0;
    transform: scale(0.6);
    box-sizing: border-box;
}
.cont3 .sec .con dl.isAnimate::before,
.cont3 .sec .con dl.isAnimate::after,
.cont3 .sec .con dl.isAnimate i {
    animation: 1s circleanime3 ease 1 forwards;
}
@keyframes circleanime3 {
	0%{
		transform: scale(0.6);
        opacity: 0;
	}
    50%{
        opacity: 1;
	}
    100%{
		transform: scale(1);
        opacity: 1;
	}
}
.cont3 .sec .con dl dt {
    display: flex;
    align-items: center;
    margin-bottom: 0.25em;
    position: relative;
    z-index: 4;
}
.cont3 .sec .con dl dt span {
    width: 3.1em;
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: -0.02em;
    color: #0057AA;
    position: relative;
}
.cont3 .sec .con dl dt span.spa {
    width: 3.3em;
}
.cont3 .sec .con dl dt span::after {
    content: '';
    width: 0.685em;
    height: 2px;
    background-color: #009098;
    position: absolute;
    right: 0.275em;
    top: 50%;
    margin-top: -1px;
}
.cont3 .sec .con dl dt b {
    font-weight: 500;
    line-height: 1.45;
    color: #0057AA;
}
.cont3 .sec .con dl dd {
    position: relative;
    z-index: 4;
}
.cont3 .sec .con dl dd h4 {
    font-weight: 500;
    line-height: 1.45;
    white-space: nowrap;
}
.cont3 .sec .con .cbox {
    padding: 0 0 6.25em 4em;
}
.cont3 .sec .con p {
    line-height: 1.8;
    padding-bottom: 2.15em;
}
.cont3 .sec .photo {
	width: 24em;
    height: 100%;
    position: sticky;
    top: calc(50vh - 10.5em);
}
.cont3 .sec .photo .pwrapper {
	width: 100%;
    height: 27em;
    border-radius: 0.75em;
    overflow: hidden;
    position: relative;
}
.cont3 .sec .photo .pwrapper h5 {
    background-color: rgba(255,255,255,0.8);
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    position: absolute;
    right: 1.2em;
    top: 1.2em;
    z-index: 10;
}
.cont3 .sec .photo .pwrapper h5 span {
    width: 1.8em;
    height: 6.8em;
    border: 0.1em solid #0057AA;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #0057AA;
}
.cont3 .sec .photo .control {
	width: 7.5em;
    height: 2.4em;
    background-color: #fff;
    border-radius: 3em;
    position: relative;
    margin: -1.2em auto 6.25em;
    z-index: 2;
}
.cont3 .sec .photo .control .swiper-button-next,
.cont3 .sec .photo .control .swiper-button-prev {
    width: 1.86em;
    height: 1.86em;
    background-color: #fff;
    border-radius: 50%;
    left: 0.27em;
    top: 0.27em;
    margin: 0;
    transition: 0.4s;
}   
.cont3 .sec .photo .control .swiper-button-next {
    left: auto;
    right: 0.27em;
}   
.cont3 .sec .photo .control .swiper-button-next::after,
.cont3 .sec .photo .control .swiper-button-prev::after {
    content: '';
    width: 0.466em;
    height: 0.866em;
    background: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%227.207%22%20height%3D%2213.414%22%20viewBox%3D%220%200%207.207%2013.414%22%3E%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_50017%22%20data-name%3D%22%E3%83%91%E3%82%B9%2050017%22%20d%3D%22M5130.08%2C4189.146l6%2C6-6%2C6%22%20transform%3D%22translate(-5129.373%20-4188.439)%22%20fill%3D%22none%22%20stroke%3D%22%23009098%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221%22%2F%3E%3C%2Fsvg%3E') center center no-repeat;
    background-size: cover;
    position: absolute;
    left: 50%;
    top: 50%;
    margin: -0.433em 0 0 -0.233em;
    font-size: 15px;
    text-indent: -9999px;
    transition: 0.4s;
} 
.cont3 .sec .photo .control .swiper-button-prev::after {
    transform: scale(-1, 1);
}
.cont3 .sec .photo .control .swiper-pagination {
    width: 100%;
	height: 2.4em;
    display: flex;
    justify-content: center;
    align-items: center;
    position: static;
    color: #4D5D67;
    font-weight: 500;
}
.cont3 .sec .photo .control .swiper-pagination span {
    display: inline-block;
    padding: 0 0.3em;
}
.cont3 .sec .photo .control .swiper-pagination .swiper-pagination-current {
    color: #0057AA;
}
@media only screen and (min-width:751px) and (max-width:1392px){
.cont3 .sec .photo .control .swiper-button-next::after,
.cont3 .sec .photo .control .swiper-button-prev::after {
    font-size: 1.07758vw;
} 
}
@media only screen and (min-width:751px){
.cont3 .sec .photo .control .swiper-button-next:hover,
.cont3 .sec .photo .control .swiper-button-prev:hover {
    background-color: rgba(0,87,170,0.1);
} 
}
@media only screen and (max-width:750px){
.cont3 {
    padding-bottom: 0.75em;
}
#anchor3-4 .cont3 {
    padding-bottom: 0;
}
.cont3 .sec h3 {
    font-weight: 500;
    line-height: 1.45;
    padding: 8vw 5.33vw 6.4vw;
}
.cont3 .sec h3 span {
    font-size: 6.66vw;
    font-weight: 500;
    color: #0057AA;
}
.cont3 .sec .con {
	width: 89.6%;
    margin: 18vw auto 0;
    position: relative;
}
.cont3 .sec .con dl {
    margin: 0 0 12.8vw;
}
.cont3 .sec .con dl::before,
.cont3 .sec .con dl::after {
    width: 34.2vw;
    height: 34.2vw;
    left: -11vw;
    margin-top: -17.1vw;
}
.cont3 .sec .con dl::after {
    width: 27.8vw;
    height: 27.8vw;
    left: -7.8vw;
    margin-top: -13.9vw;
}
.cont3 .sec .con dl i {
    width: 30.4vw;
    height: 30.4vw;
    border: 0.55vw solid rgba(255,255,255,0.6);
    left: -9.2vw;
    margin-top: -15.2vw;
}
.cont3 .sec .con dl dt span {
    font-size: 6.66vw;
}
.cont3 .sec .con dl dt span::after {
    width: 4.266vw;
    height: 0.55vw;
    right: 0.275em;
    margin-top: -0.275vw;
}
.cont3 .sec .con dl dd h4 {
    font-size: 5.33vw;
    font-weight: 500;
    line-height: 1.45;
    white-space: nowrap;
}
.cont3 .sec .con .cbox {
    padding: 0 0 2.5em;
}
.cont3 .sec .con p {
    line-height: 1.8;
    padding-bottom: 1.25em;
}
.cont3 .sec .photo {
	width: 100%;
    top: 0;
    z-index: 5;
}
.cont3 .sec .photo .pwrapper {
    height: 64.8vw;
    border-radius: 0;
    margin-bottom: 0;
}
.cont3 .sec .photo .pwrapper h5 {
    right: 5.33vw;
    top: 26.133vw;
}
.cont3 .sec .photo .control {
	width: 30vw;
    height: 9.6vw;
    border-radius: 9vw;
    margin: -4.8vw 0 0 65vw;
}
.cont3 .sec .photo .control .swiper-button-next,
.cont3 .sec .photo .control .swiper-button-prev {
    width: 9.6vw;
    height: 9.6vw;
    left: 0;
    top: 0;
}   
.cont3 .sec .photo .control .swiper-button-next {
    left: auto;
    right: 0;
}
.cont3 .sec .photo .control .swiper-button-next::after,
.cont3 .sec .photo .control .swiper-button-prev::after {
    content: '';
    width: 1.866vw;
    height: 3.466vw;
    margin: -1.733vw 0 0 -0.933vw;
    font-size: 4vw;
} 
.cont3 .sec .photo .control .swiper-pagination {
    font-size: 4vw;
	height: 9.6vw;
}
.cont3 .sec .photo .control .swiper-pagination span {
    padding: 0 0.3em;
}
}


/* cont4
------------------------------------------------- */
#anchor4 {
    position: relative;
    z-index: 3;
}
.cont4 {
    height: 48.1875em;
    position: relative;
    z-index: 2;
}
.cont4 .headline3 {
	margin-bottom: 3.84em;
}
.cont4 .chara005 {
    left: 50%;
    margin-left: -4.28125em;
    top: 12em;
    z-index: 1;
}
.cont4.isAnimate .chara005 {
	top: 3.4em;
}
.cont4 .block {
	width: 96.55%;
    height: 34em;
    background: url("../img/wizard/cont4_bg.jpg") center center no-repeat;
    background-size: cover;
    margin: 0 auto;
    border-radius: 0.75em;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    overflow: hidden;
    position: relative;
    z-index: 2;
}
.cont4 .block::after {
    content: '';
    width: 100%;
    height: 100%;
    background-color: #000;
    border-radius: 0.75em;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    transition: 0.5s;
    z-index: 1;
}
.cont4 .block.isAnimate::after {
    opacity: 0.39;
}
.cont4 .block .ttlbox {
    width: 34.5rem;
    padding-left: 3em;
    box-sizing: border-box;
    position: relative;
    z-index: 2;
}
.cont4 .block .ttlbox h4 {
    font-weight: 400;
    line-height: 1.6;
}
.cont4 .block .con {
    width: 34.5rem;
    position: relative;
    z-index: 2;
}
.cont4 .block .con p {
    line-height: 2;
}
@media only screen and (max-width:750px){
.cont4 {
    height: auto;
}
.cont4 .headline3 {
	margin-bottom: 12.8vw;
}
.cont4 .chara005 {
    left: 56vw;
    margin-left: 0;
}
.cont4.isAnimate .chara005 {
	top: 16vw;
}
.cont4 .block {
	width: 100%;
    height: 128.55vw;
    background-image: url("../img/wizard/cont4_bg_sp.jpg");
    background-position: center top;
    background-size: 100% auto;
    border-radius: 0;
    display: block;
    color: #fff;
}
.cont4 .block::after {
    display: none;
}
.cont4 .block .ttlbox {
    width: 100%;
    height: 72vw;
    padding-left: 11.733vw;
    display: flex;
    align-items: center;
}
.cont4 .block .ttlbox h4 {
    font-size: 6.66vw;
    padding-bottom: 12vw;
}
.cont4 .block .con {
    width: 89.6%;
    margin: 0 auto;
}
.cont4 .block .con p {
    line-height: 1.8;
    color: #2A363E;
}
}


/* cont5
------------------------------------------------- */
.cont5 {
	padding-top: 8.5em;
    position: relative;
    z-index: 3;
}
.cont5.elem {
    z-index: 4;
}
.cont5 .box {
	width: 100%;
    padding: 6em 4em 0.85em;
    position: relative;
    box-sizing: border-box;
}
.cont5 .box::after {
	content: '';
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, #0057AA, #009098);
    border-radius: 0.75em;
    opacity: 0.7;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
}
.cont5 .box .cover {
	position: relative;
    z-index: 2;
}
.cont5 .box h3 {
	position: absolute;
    left: 0;
    top: -3.89em;
}
.cont5 .box h3 span {
    width: 10.685em;
    height: 2.285em;
    background-color: #fff;
    border: 2px solid #0057AA;
    border-radius: 0.34em;
    font-weight: 500;
    color: #0057AA;
    text-align: center;
	display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
}
.cont5 .box .copy {
    line-height: 2;
    border-bottom: 1px solid rgba(255,255,255,0.4);
    color: #fff;
	padding-bottom: 2.5em;
    margin-bottom: 2.75em;
}
.cont5 .box h4 {
    font-weight: 500;
    line-height: 1.45;
    letter-spacing: 0.04em;
    color: #fff;
    margin-bottom: 1.25em;
}
.cont5 .box ul {
    margin-bottom: 3.25em;
}
.cont5 .box ul li {
    width: 48.36%;
    background-color: #fff;
    border-radius: 0.75em;
    padding: 2.5em 2em 1.5em;
    box-sizing: border-box;
}
.cont5 .box ul.list3 li {
    width: 31.1475%;
}
.cont5 .box ul li h5 {
    font-weight: 500;
    line-height: 1.45;
    background: url("../img/wizard/cont5_icon1.svg") center top no-repeat;
    background-size: 5em auto;
    text-align: center;
    padding: 5.65em 0 1.75em;
    position: relative;
}
.cont5 .box ul li h5::after {
    content: '';
    width: 1.75em;
    height: 0.11em;
    background-color: #009098;
    position: absolute;
    left: 50%;
    bottom: 0.9em;
    margin-left: -0.875em;
}
.cont5 .box ul li h5.tit2 {
    background-image: url("../img/wizard/cont5_icon2.svg");
}
.cont5 .box ul li h5.tit3 {
    background-image: url("../img/wizard/cont5_icon3.svg");
}
.cont5 .box ul li h5.tit4 {
    background-image: url("../img/wizard/cont5_icon4.svg");
}
.cont5 .box ul li h5.tit5 {
    background-image: url("../img/wizard/cont5_icon5.svg");
}
.cont5 .box ul li h5.tit6 {
    background-image: url("../img/wizard/cont5_icon6.svg");
}
.cont5 .box ul li h5.tit7 {
    background-image: url("../img/wizard/cont5_icon7.svg");
}
.cont5 .box ul li p {
    line-height: 1.8;
}
.cont5 .chara002 {
    position: fixed;
    right: 50%;
    margin-right: 31.6875em;
    bottom: -11em;
    opacity: 0;
    z-index: 10;
}
.cont5.isAnimate .chara002 {
    bottom: 0;
    opacity: 1;
}
.cont5.isAnimate .chara002.is-abs {
    bottom: -11em;
}
.cont5.isAnimate .chara002 .frame1 {
	animation: wf1anime-1 4s infinite;
	animation-timing-function: steps(1, end);
}
.cont5.isAnimate .chara002 .frame2 {
	animation: wf1anime-2 4s infinite;
	animation-timing-function: steps(1, end);
}
@media only screen and (max-width:750px){
.cont5 {
	padding-top: 19.2vw;
}
.cont5 .box {
	width: 100vw;
    margin-left: -5.2vw;
    padding: 14.5vw 5.2vw 7vw;
}
.cont5 .box::after {
    border-radius: 3.2vw;
}
.cont5 .box h3 {
    font-size: 5.33vw;
    left: 50%;
    top: -20.9vw;
    margin-left: -29.1vw;
}
.cont5 .box h3 span {
    width: 58.2vw;
    height: 12.8vw;
    border-radius: 2.133vw;
}
.cont5 .box .copy {
    line-height: 1.8;
	padding-bottom: 2em;
    margin-bottom: 2em;
}
.cont5 .box h4 {
    font-size: 5.33vw;
    line-height: 1.4;
    text-align: center;
}
.cont5 .box ul {
    margin-bottom: 5.85vw;
}
.cont5 .box ul li {
    width: 100%;
    border-radius: 3.2vw;
    padding: 6.4vw;
    margin-bottom: 2.66vw;
}
.cont5 .box ul.list3 li {
    width: 100%;
}
.cont5 .box ul li h5 {
    height: 17vw;
    font-size: 4.8vw;
    line-height: 1.5;
    background-position: left center;
    background-size: 17vw auto;
    text-align: left;
    padding: 0 0 0 23.5vw;
    display: flex;
    align-items: center;
    margin-bottom: 5vw;
}
.cont5 .box ul li h5::after {
    content: '';
    width: 100%;
    height: 1px;
    left: 0;
    bottom: -2.5vw;
    margin-left: 0;
}
.cont5 .box ul li p {
    line-height: 1.6;
}
.cont5 .chara002 {
    left: 5.33vw;
    right: auto;
    margin-right: 0;
}
}


/* cont6
------------------------------------------------- */
.cont6 {
	padding: 7.5em 0 8em;
    position: relative;
    z-index: 2;
}
.cont6 .ttlbox {
	width: 50%;
}
.cont6 .ttlbox h3 {
    font-weight: 500;
    line-height: 1.56;
    padding-bottom: 0.5em;
    
}
.cont6 .ttlbox h4 span {
    font-weight: 500;
    line-height: 1.6;
    color: #0057AA;
    padding: 0 0.8em;
    position: relative;
}
.cont6 .ttlbox h4 span::before,
.cont6 .ttlbox h4 span::after {
    content: '';
    width: 0.4em;
    height: 1.6em;
    background: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%229%22%20height%3D%2233%22%20viewBox%3D%220%200%209%2033%22%3E%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_49924%22%20data-name%3D%22%E3%83%91%E3%82%B9%2049924%22%20d%3D%22M327.578%2C9680h-8v32h8%22%20transform%3D%22translate(-319.078%20-9679.5)%22%20fill%3D%22none%22%20stroke%3D%22%230057aa%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221%22%2F%3E%3C%2Fsvg%3E') left center no-repeat;
    background-size: cover;
    position: absolute;
    left: 0;
    top: 0;
}
.cont6 .ttlbox h4 span::after {
    transform: scale(-1, 1);
    left: auto;
    right: 0;
}
.cont6 .con {
	width: 50%;
}
.cont6 .con p {
	line-height: 1.8;
}
.cont6 .slider {
	width: 100%;
    height: 17.5em;
    margin-top: 6em;
    position: relative;
}
.splide__track {
    overflow: inherit !important;
}
.splide__slide {
    width: auto;
    height: 17.5em;
    margin-right: 3.6em;
    transition: 0.4s;
    cursor: pointer;
    position: relative;
    z-index: 1;
}
.splide__slide img {
    display: block;
    width: auto;
    height: 17.5em;
    border-radius: 0.75em;
}
.splide__arrows button svg {
    display: none;
}
.splide__arrows button {
    width: 4em;
    height: 4em;
    background-color: #fff;
    border-radius: 50%;
    position: absolute;
    left: 1em;
    top: 50%;
    margin-top: -2em;
    z-index: 2;
    cursor: pointer;
    transition: 0.4s;
}
.splide__arrows button.splide__arrow--prev {
    left: auto;
    right: 1em;
}
.splide__arrows button::before {
    content: '';
    width: 0.699em;
    height: 1.299em;
    background: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%227.207%22%20height%3D%2213.414%22%20viewBox%3D%220%200%207.207%2013.414%22%3E%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_50017%22%20data-name%3D%22%E3%83%91%E3%82%B9%2050017%22%20d%3D%22M5130.08%2C4189.146l6%2C6-6%2C6%22%20transform%3D%22translate(-5129.373%20-4188.439)%22%20fill%3D%22none%22%20stroke%3D%22%23009098%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221%22%2F%3E%3C%2Fsvg%3E') center center no-repeat;
    background-size: cover;
    position: absolute;
    left: 50%;
    top: 50%;
    margin: -0.6495em 0 0 -0.3495em;
    transition: 0.4s;
}
.splide__arrows button.splide__arrow--next::before {
    transform: scale(-1, 1);
}
@media only screen and (min-width:751px){
.splide__arrows button:hover::before {
    left: 40%;
}
.splide__arrows button.splide__arrow--prev:hover::before {
    left: 60%;
}
}
@media only screen and (min-width:751px){
.splide__slide:hover {
    transform: scale(1.2);
    z-index: 2;
}
}
@media only screen and (max-width:750px){
.cont6 {
	padding: 12.8vw 0 34vw;
    overflow-x: hidden;
}
.cont6 .ttlbox {
	width: 100%;
    position: relative;
    margin-bottom: 3vw;
}
.cont6 .ttlbox h3 {
    font-size: 6.66vw;
    line-height: 1.45;
    padding-bottom: 0;
}
.cont6 .ttlbox h4 {
    margin: 0.5em 0 1em;
}
.cont6 .ttlbox h4 span {
    padding: 0 0.8em;
}
.cont6 .con {
	width: 100%;
}
.cont6 .slider {
    height: 59.733vw;
    margin-top: 8vw;
}
.splide__slide {
    height: 59.733vw;
    margin-right: 4vw;
}
.splide__slide img {
    height: 59.733vw;
	border-radius: 3.2vw;
    cursor: default;
}
.splide__arrows button {
    width: 3em;
    height: 3em;
    left: auto;
    right: 5em;
    top: -4.5em;
    margin-top: 0;
}
.splide__arrows button.splide__arrow--prev {
    left: auto;
    right: 5.2vw;
}
.splide__arrows button::before {
    content: '';
    width: 0.5592em;
    height: 1.0392em;
    margin: -0.5196em 0 0 -0.2796em;
}
}


/* illust
------------------------------------------------- */
.character {
	transition: 0.4s;
    z-index: 2;
}
.chara001 {
    width: 7.1025em;
    height: 7.4375em;
}
.chara002 {
    width: 9.17375em;
    height: 8.625em;
}
.chara003 {
	width: 6.87375em;
    height: 7.5em;
}
.chara004 {
    width: 4.895em;
    height: 7.825em;
}
.chara005 {
	width: 8.5625em;
    height: 7.8125em;
}
@media only screen and (max-width:750px){
.chara001 {
    width: 24.448vw;
    height: 25.6vw;
}
.chara002 {
    width: 30.632vw;
    height: 28.8vw;
}
.chara003 {
	width: 22.24vw;
    height: 24.266vw;
}
.chara004 {
    width: 16.68vw;
    height: 26.66vw;
}
.chara005 {
	width: 27.472vw;
    height: 25.066vw;
}
}

@keyframes wf1anime-1 {
	0% {
		opacity: 1;
	}
    25% {
		opacity: 0;
	}
	100% {
		opacity: 0;
	}
}
@keyframes wf1anime-2 {
	0% {
		opacity: 0;
	}
	25% {
		opacity: 1;
	}
    100% {
		opacity: 1;
	}
}
@keyframes wf1anime-3 {
	0% {
		opacity: 1;
	}
    25% {
		opacity: 0;
	}
    50% {
		opacity: 1;
	}
	100% {
		opacity: 1;
	}
}
@keyframes wf1anime-4 {
	0% {
		opacity: 0;
	}
	25% {
		opacity: 1;
	}
    50% {
		opacity: 0;
	}
    100% {
		opacity: 0;
	}
}
@keyframes wf1anime-5 {
	0% {
		opacity: 0;
	}
    33% {
		opacity: 1;
	}
	66% {
		opacity: 0;
	}
    100% {
		opacity: 0;
	}
}
@keyframes wf1anime-6 {
	0% {
		opacity: 1;
	}
	33% {
		opacity: 0;
	}
    66% {
		opacity: 1;
	}
    100% {
		opacity: 1;
	}
}