@charset "utf-8";

@import url('reset.css');

.page_wrap{width:100%;min-width:320px;position:relative;overflow-x: hidden}
.page_wrap .fixed_inner,
.page_wrap .e-learning{position:relative;width: 1200px;margin: 0 auto;box-sizing: border-box}

.page_wrap .w{display: block !important;}
.page_wrap .m{display: none !important;}

.page_wrap .visual{position:relative;background: url(../images/visual_bg.png) no-repeat 50% 0 / cover;color: #fff;overflow: hidden;letter-spacing: -0.05em;}
.page_wrap .visual .fixed_inner{height: 889px;transition: height 0.35s ease}
.page_wrap .visual .title{font-size:  1.563rem;/*25px*/font-weight: 300;margin-bottom: 42px;}
.page_wrap .visual .text{position: absolute;bottom: 167px;right:0;}
.page_wrap .visual p{font-size: 4.375rem;/*70px*/font-weight: 700;line-height: 1.12;}
.page_wrap .visual .obj{position: absolute;left:-265px;bottom: 184px;transition: bottom 0.4s cubic-bezier(0.075, 0.82, 0.165, 1);}
.page_wrap .visual .obj img{max-width: 100%;}

.page_wrap .qrcode{position: absolute;bottom:40px;left:40px;text-align: center;font-size: 0;overflow: hidden;transition: left 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);}
.page_wrap .qrcode .tit{display:block;font-size: 1.25rem;/*20px*/font-weight: 400;color: #fff;margin-bottom: 11px;text-align: left}
.page_wrap .qrcode .icn + .icn{margin-left: 20px;}

.page_wrap .section{text-align: center;}
.page_wrap .section.row01{padding: 83px 0 79px;}
.page_wrap .section.row01 p{/*font-weight: 300;*/font-size: 1.313rem;/*21px*/letter-spacing: -0.05em;line-height: 1.45;margin-bottom: 56px;}
.page_wrap .section.row01 .fixed_inner{padding-bottom: 91px;}
.page_wrap .title01{margin-bottom: 16px;font-size: 2.5rem;/*40px*/color: #202020;font-weight: 700;position: relative;z-index: 1;}
.page_wrap .title01 > em{position: relative;}
.page_wrap .title01 > em:before{position: absolute;display: block;content: '';background-color: #fede45;width: 110%;height:21px;bottom: 3px;left:50%;left:-3px\9;-webkit-transform: translateX(-50%);transform: translateX(-50%);z-index: -1}
.page_wrap .title01.f1{font-size: 1.563rem;/*25px*/margin-bottom: 19px;}
.page_wrap .title01.f1 > em:before{height: 14px;}
.page_wrap .title02{display: inline-block;background-color: #313131;text-align: center;font-size: 1.5rem;/*24px*/color: #fff;font-weight: 700;width: 267px;line-height: 2.45;border-radius: 2em;}
.page_wrap .title02.f1{font-size: 1.438rem;/*23px*/width:168px;line-height: 1.95;border-radius: 1em;}

.page_wrap .main_func:after,
.page_wrap .el_list:after,
.page_wrap .step_list:after,
.page_wrap .info_list:after{display: block;content: '';clear: both;}

.page_wrap .main_func{text-align: center;margin: 0 -18px;}
.page_wrap .main_func > li{float: left;width: 25%;padding: 0 18px;box-sizing: border-box;}
.page_wrap .main_func .tit{font-size: 1.25rem;/*20px*/display: block;margin-top: 16px;}
.page_wrap .main_func > li img{max-width: 100%}

.page_wrap .e-learning{padding: 50px 20px 54px;background-color: #ededed;margin-bottom: 62px;}
.page_wrap .section.row01 .e-learning > p{font-size: 1.125rem;/*18px*/line-height: 1.4;}
.page_wrap .el_list{}
.page_wrap .el_list > li{float: left;width: 25%;padding: 0 30px;box-sizing: border-box}
.page_wrap .el_list > li .inner{background-color: #fff;border: 1px solid #c3c3c3;position: relative;padding: 57px 0 105px;}
.page_wrap .el_list > li .inner:after{position:absolute;bottom:19px;left:19px;display: block;content: '';width:46px;height:47px;background: url(../images/sp_icn.png) no-repeat 0 0;}
.page_wrap .el_list > li:nth-child(2) .inner:after{background-position: -48px 0}
.page_wrap .el_list > li:nth-child(3) .inner:after{width:48px;background-position: -96px 0}
.page_wrap .el_list > li:nth-child(4) .inner:after{background-position: -146px 0}
.page_wrap .el_list .tit{position:relative;display: block;font-weight: 700;font-size: 1.25rem;/*20px*/color: #313131;line-height: 1.28;padding-top: 16px;letter-spacing: -0.05em}
.page_wrap .el_list .tit:before{display: inline-block;content: '';width: 18px;height:3px;background-color: #313131;position: absolute;top:0;left:50%;margin-left: -9px;}

.page_wrap .btns{display: inline-block;text-align: center;font-size:  42px;color: #202020;font-weight: 700;width: 338px;line-height: 1.98;background-color: #fecfd0;border-radius: 2em;
	-webkit-box-shadow: 2px 3px 9px 0px rgba(6, 7, 7, 0.3);
	-moz-box-shadow: 2px 3px 9px 0px rgba(6, 7, 7, 0.3);
	box-shadow: 2px 3px 9px 0px rgba(6, 7, 7, 0.3);
}

.page_wrap .section.row02{background-color: #fede45;padding-bottom: 140px}
.page_wrap .evt_top{padding: 98px 0 209px;background: url(../images/evt_top_bg.png) no-repeat 50% 0;}
.page_wrap .evt_top .img{width:1200px;margin: 64px auto 0;display: block;text-align: center}
.page_wrap .evt_box{margin-bottom: 134px;position:relative;background-color: #313131;font-size: 2rem;/*32px*/color: #fff;font-weight: 700;line-height: 1.45;padding: 51px 0 47px;}
.page_wrap .evt_box:before,
.page_wrap .evt_box:after{position:absolute;top:-16px;left:0;display: block;content: '';width: 100%;height: 16px;background: url(../images/zigzag.png) repeat-x 0 0}
.page_wrap .evt_box:after{top:auto;bottom:-17px;height: 17px;background-position: 0 100%}

.page_wrap .section.row02 .fixed_inner > .title02{margin-bottom: 110px;}
.page_wrap .step_list {margin: 0 -8px 85px;}
.page_wrap .step_list > li{float: left;width: 33.333%;padding: 0 8px;box-sizing: border-box;margin-bottom: 88px;}
.page_wrap .step_list > li > a{display: block;}
.page_wrap .step_list .img{display: block;padding: 0 13px;}
.page_wrap .step_list .cont{padding: 12px 0 13px;background-color: #313131;position: relative;font-size: 1.063rem;/*17px*/color: #fff;}
.page_wrap .step_list .cont:after{top: 100%;left: 50%;border: solid transparent;content: '';height: 0;width: 0;position: absolute;pointer-events: none;border-color: rgba(49, 49, 49, 0);border-top-color: #313131;border-width: 26px;margin-left: -26px;}
.page_wrap .step_list .tit{font-size: 1.375rem;/*22px*/color: #fede45;font-weight: 800;display: block;margin-bottom: 7px;}
.page_wrap .step_list p{line-height: 1.38}
.page_wrap .step_list img{max-width: 100%;}

.page_wrap .info_list{margin: 0 -3px;}
.page_wrap .info_list > li .title02{margin-bottom: 0}
.page_wrap .info_list > li{float: left;width: 33.333%;padding: 0 3px;box-sizing: border-box}
.page_wrap .info_list > li > p{margin-top: -23px;padding: 40px 0 16px;border: 1px solid #494533;border-radius: 6px;font-size: 1.438rem;/*23px*/font-weight: 700;color: #313131}

.page_wrap .animate{-webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both;}
.page_wrap .delay-a{-webkit-animation-delay: 0.4s; -moz-animation-delay: 0.4s; -o-animation-delay: 0.4s; animation-delay: 0.4s;}
.page_wrap .delay-b{-webkit-animation-delay: 0.80s; -moz-animation-delay: 0.80s; -o-animation-delay: 0.80s; animation-delay: 0.80s;}
.page_wrap .delay-c {-webkit-animation-delay: 1.2s; -moz-animation-delay: 1.2s; -o-animation-delay: 1.2s; animation-delay: 1.2s;}

.page_wrap .delay-a1{-webkit-animation-delay: 0.3s; -moz-animation-delay: 0.3s; -o-animation-delay: 0.3s; animation-delay: 0.3s;}
.page_wrap .delay-b1{-webkit-animation-delay: 0.65s; -moz-animation-delay: 0.65s; -o-animation-delay: 0.65s; animation-delay: 0.65s;}
.page_wrap .delay-c1 {-webkit-animation-delay: 1s; -moz-animation-delay: 1s; -o-animation-delay: 1s; animation-delay: 1s;}
@-webkit-keyframes fadeInUp {
    from {opacity: 0; -webkit-transform: translate3d(0, 50px, 0); transform: translate3d(0, 50px, 0);}
    to {opacity: 1; -webkit-transform: none; transform: none;}
}
@keyframes fadeInUp {
    from {opacity: 0; -webkit-transform: translate3d(0, 50px, 0); transform: translate3d(0, 50px, 0);}
    to {opacity: 1; -webkit-transform: none; transform: none;}
}
.fadeInUp {-webkit-animation-name: fadeInUp; animation-name: fadeInUp;}