﻿@charset "utf-8";
html {
	font-size:100%;
}

body {
	font-size:16px;
	background:#fff;
	font-family: "Noto Sans","游ゴシック","YuGothic","ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic ProN","メイリオ","Meiryo",sans-serif;
	line-height:2;
	color:#b8b8b8;
}
body, h1, h2, h3, h4, h5, h6, p, dl, dd, ul, ol, li, form, fieldset, blockquote, table, thead, tbody, tfoot, tr, td, th {
	margin:0;
	padding:0;
}
h1, h2, h3, h4, h5, h6, th, td, table, input, button, select, textarea, em {
	font-size:1rem;
	font-weight:normal;
	font-style:normal;
	padding:0;
	margin:0;
}
table {
	width:100%;
	border-width:0;
	border-spacing:0;
	border-collapse:collapse;
}
img, input, button, select, textarea {
	vertical-align:middle;
}
ul, ol {
	list-style:none;
}
img {
	border:0;
}
a {
	text-decoration:none;
	color:#b8b8b8;
	opacity:1;
	transition:all 0.3s;
}
a:hover {
	outline:none;
	text-decoration:none;
	transition:all 0.3s;
	opacity:0.6;
}
.btn a {
	display:block;
	filter:alpha(opacity=100);
	opacity:1;
}
.btn a:hover {
	filter:alpha(opacity=60);
	opacity:0.6;
}
.clear:after, .clearFix:after {
	content: ".";
	display: block;
	height:0;
	font-size:0;
	clear:both;
	visibility:hidden;
}
.clear, .clearFix {
	display: inline-block;
}
.clear {
	clear:both;
	height:0px!important;
	overflow:hidden;
}
* html .clear, * html .clearFix {
	height:0px;
}
.clear, .clearFix {
	display:block;
}
.fl {
	float:left !important;
}
.fr {
	float:right !important;
}
.cl {
	clear:both !important;
}
.al {
	text-align:left !important;
}
.ar {
	text-align:right !important;
}
.ac {
	text-align:center !important;
}
.font_bold {
	font-weight:bold;
}
.mb_5 {
	margin-bottom:5px !important;
}
.mb_10 {
	margin-bottom:10px !important;
}
.mb_15 {
	margin-bottom:15px !important;
}
.mb_20 {
	margin-bottom:20px !important;
}
.mb_30 {
	margin-bottom:30px !important;
}
.mb_35 {
	margin-bottom:35px !important;
}
.mb_40 {
	margin-bottom:40px !important;
}
.mb_50 {
	margin-bottom:50px !important;
}
.mb_60 {
	margin-bottom:60px !important;
}
.mb_70 {
	margin-bottom:70px !important;
}
.mb_80 {
	margin-bottom:80px !important;
}
.mb_90 {
	margin-bottom:90px !important;
}
.mb_100 {
	margin-bottom:100px !important;
}
.pt_10 {
	padding-top:10px!important;
}
.pt_20 {
	padding-top:20px!important;
}
.pt_30 {
	padding-top:30px!important;
}
.pt_40 {
	padding-top:40px!important;
}
.pt_50 {
	padding-top:50px!important;
}
.pt_60 {
	padding-top:60px!important;
}
.pt_80 {
	padding-top:80px!important;
}
img {
	max-width:100%;
}
.pcNone {
	display:none!important;
}
.flex01 {
	display:flex;
	justify-content:space-between;
}
.flex02 {
	display:flex;
	justify-content:center;
}
.flex03 {
	display:flex;
	justify-content: flex-start;
}
.flex_stretch {
	align-items:stretch;
}
.flex_center {
	align-items:center;
}
.flex_wrap {
	flex-wrap: wrap;
}
.page_wp{
	overflow:hidden;
	background:#000;
}
.content_width {
	position:relative;
	z-index:2;
	max-width:1275px;
	width:100%;
	margin:0 auto;
}
.content_wrap{
	width:100%;
}
.top_wp{
	position:relative;
	z-index:99;
}
.top_box{
	position:relative;
	z-index:100;
	padding:25px 10px;
	width:155px;
	display:flex;
	justify-content:space-between;
	align-items:center;
	opacity:0;
}
.top_logo{
	width:155px;
}

.top_nav li{
	display:inline-block;
	padding:0 20px;
}
.nav_wp{
	position:fixed;
	z-index:99;
	width:100%;
	left:0;
	top:0;
	opacity:0;
}
.nav_con{
	max-width:1255px;
	padding:25px 0;
	width:100%;
	margin:0 auto;
	text-align:right;
}


.ban_wp{
	position:relative;
	width:100%;
	height:100vh;
	background:#000;
}
.ban_wp img{
	max-width:100%;
}
.kv03_ico{
	position:absolute;
	z-index:41;
	bottom:0;
	left:calc(50% + 250px);
	width:50px;
	height:110px;
	opacity:0;
	color:#fff;
	text-align:center;
	font-size:1rem;
	letter-spacing:2px;
	font-family:"游ゴシック","YuGothic","ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic ProN","メイリオ","Meiryo",sans-serif;
}
.kv03_ico_line{
	position:relative;
	overflow:hidden;
	height:100px;
}
.kv03_ico_line span{
	display:block;
	position:absolute;
	width:1px;
	left:50%;
	top:-100px;
	height:100%;
	background:#fff;
	animation:line_scr linear 4s infinite;
}
.main_logo{
	position:fixed;
	width:233px;
	height:170px;
	left:50%;
	top:50%;
	z-index:10;
	margin-left:-116px;
	margin-top:-85px;
}

.kv01_bg{
	position:absolute;
	width:100%;
	height:100%;
	left:0;
	top:0;
	z-index:10;
	background:#fff;
}
.kv02_logo{
	position:absolute;
	width:0;
	height:100%;
	left:0;
	top:0;
	z-index:12;
	background:#000;
}
.kv01_bgb{
	background:#000;
}
.kv01_bg_over{
	position:absolute;
	width:0;
	height:100%;
	left:0;
	top:0;
	z-index:11;
	background:#000;
}
.kv03_txt{
	position:fixed;
	z-index:49;
	width:600px;
	height:190px;
	left:50%;
	top:50%;
	margin-left:-300px;
	margin-top:-95px;
	opacity:0;
}
.kv04_wp{
	position:absolute;
	width:100%;
	height:100%;
	left:0;
	top:0;
	z-index:30;
	opacity:0;
	text-align:center;
	display:flex;
	align-items:center;
}
.kv04_in{
	position:relative;
	max-width:710px;
	width:100%;
	margin:0 auto;
}

.kv04_ico{
	position:absolute;
	z-index:49;
	width:173px;
	left:50%;
	bottom:10px;
	margin-left:-330px;
	margin-top:-95px;
	opacity:0;
}
.kv03_wp{
	position:absolute;
	width:100%;
	height:100%;
	overflow-y:scroll;
	left:0;
	top:0;
	z-index:1;
	opacity:0;
	text-align:center;
}
.kv03_in{
	position:relative;
	opacity:0;
}
.kv03_in_img{
	display:block;
	width:200px;
	margin:0 auto;
	padding:20vh 0 10vh;
}
.kv04_ico,.kv04_img{
	opacity:0;
}
.fade_in{
	animation:fade_in 1.8s forwards 0.8s;
}
.fade_out{
	animation:fade_out 1.8s forwards 0.8s;
}
.fade_in_f{
	animation:fade_in 1s forwards 0.2s;
}
.fade_out_f{
	animation:fade_out 1s forwards 0.2s;
}
@keyframes fade_in{
	0%{opacity:0;}
	100%{opacity:1;}
}
@keyframes fade_out{
	0%{opacity:1;}
	100%{opacity:0;}
}

@keyframes line_scr{
	0%{top:-101px;}
	100%{top:101px;}
}


.lock {
	overflow-y:scroll;
	touch-action: none;
}
.lock body {
	overflow: hidden;
	touch-action: none;
	margin-right: 17px;
}
.lock.mobile body {
	margin-right: 0;
}

.nav_show{
	display:none;
}

.seca{
	position:relative;
	height:761px;
	margin-bottom:160px;
}
.seca_img{
	width:100%;
	height:100%;
	background:url(../img/img_a01_pc.png) no-repeat center top;
	background-size: cover;
}
.seca_txt{
	position:absolute;
	left:235px;
	top:180px;
}
.secb{
	position:relative;
	height:821px;
	margin-bottom:160px;
}
.secb_img{
	width:100%;
	height:100%;
	background:url(../img/img_b01_pc.png) no-repeat center top;
	background-size: cover;
}
.secb_txt{
	position:absolute;
	left:calc(50% - 220px);
	top:460px;
	width:439px;
}
.secc{
	position:relative;
	height:635px;
	margin-bottom:100px;
}
.secc_img{
	width:100%;
	height:100%;
	background:url(../img/img_c01_pc.png) no-repeat center top;
	background-size: cover;
}
.secc_txt{
	position:absolute;
	right:0;
	top:470px;
}
.pro_feature{
	padding-top:100px;
	display:flex;
	justify-content:center;
	align-items:center;
	color:#fff;
	font-size:0.875rem;
	letter-spacing:1px;
}
.pro_feature dt h3{
	max-width:240px;
	margin-bottom:40px;
}
.pro_feature dt{
	width:25%;
	margin:0 5% 70px;
}
.pro_feature dd{
	width:30%;
	display:flex;
	align-items:center;
}
.fea_img{
	width:32%;
	margin-right:3%;
}
.fea_info{
	width:65%;
	margin-bottom:70px;
}
.fea_info h3{
	position:relative;
	margin-bottom:20px;
	margin-left:20px;
	display:inline-block;
	padding:1px 10px 1px 30px;
	padding:5px 10px 0 30px\0;
	border:2px solid #c9c9c9;
	font-size:1rem;
	line-height:1.4;
	line-height:1.2\0;
	font-weight:bold;
}
.fea_info h3 img{
	position:absolute;
	left:-22px;
	top:-15px;
	width:46px;
}
.fea_info h3 img.fea_info_ico02{
	width:50px;
	left:-28px;
	top:-14px;
}
.pro_box{
	padding-top:160px;
	width:62%;
	margin:0 auto 70px;
	display:flex;
	justify-content:center;
	align-items:center;
}
.pro_img{
	width:45%;
	margin:0 10%;
	
}
.pro_txt{
	margin-bottom:70px;
	width:60%;
	color:#fff;
	font-size:0.875rem;
	letter-spacing:1px;
}
.pro_txt h3{
	margin-bottom:15px;
	display:inline-block;
	padding:3px 3px;
	padding:7px 3px 2px\0;
	border-top:2px solid #c9c9c9;
	border-bottom:2px solid #c9c9c9;
	font-size:1rem;
	line-height:1.4;
	line-height:1.2\0;
	font-weight:bold;
}
.pro_limit span{
	display:inline-block;
	padding:1px 4px 0 5px;
	padding:5px 4px 0 5px\0;
	margin-right:5px;
	line-height:1.3;
	line-height:1.1\0;
	border:1px solid #fff;
}
.pro_price{
	margin:1.2em 0 0.8em;
}
.pro_buy_btn{
	display:block;
	padding:8px 0;
	padding:8px 0 2px\0;
	width:222px;
	border-radius:30px;
	background:#fff;
	color:#000;
	font-weight:bold;
	font-size:1rem;
	text-align:center;
}
.foot_btn{
	position:fixed;
	z-index:9;
	left:0;
	bottom:0;
	width:100%;
	height:75px;
	text-align:center;
	background:url(../img/foot_btn_bg_pc.png) no-repeat;
	background-size:cover;
	display:flex;
	justify-content:center;
	align-items:center;
	transition: all 0.3s;
    opacity: 0;
}
.foot_btn_show{
	opacity:1!important;
    transition: all 0.3s;
}
.foot_btn a{
	display:inline-block;
	font-size:1.125rem;
	color:#444451;
}
.foot_btn a:after{
	display:inline-block;
	vertical-align:middle;
	margin:0 0 6px 20px;
	content:'';
	width:24px;
	height:9px;
	background:url(../img/foot_btn_ico_pc.png) no-repeat;
	background-size:100%;
}
.to_top_wp{
	height:32px;
}
.to_top{
	position:fixed;
	left:0;
	bottom:100px;
	width:100%;
	margin:0 auto 0;
	text-align:right;
	opacity:0;
	z-index:6;
}
.to_top a{
	display:inline-block;
}
.foot_logo{
	text-align:center;
}
.foot_logo01{
	width:218px;
	margin:0 auto;
}
.foot_logo02{
	width:118px;
	margin:40px auto 60px;
}

.copyarea{
	padding-bottom:100px;
  text-align: right;
  letter-spacing:1px;
}

.copyarea li{
  font-family: "lato",sans-serif;
}

.copyarea li span{
  padding-left: 5px;
}

.copyarea li:first-child{
  font-size: 11px;
  margin-bottom: 5px;
}
.copyarea li:first-child img{
	width:8px;
	padding-left:4px;
	margin-bottom:2px;
}
.copyarea li:last-child{
  font-size: 0.75rem;
}
.copyarea li:last-child span{
	display:inline-block;
	transform:scale(0.833);
	margin-right:-28px;
}

.anim{
	transition: opacity 1.2s, transform 1.2s;
	transform:translate3d(0,50px,0);
	opacity: 0;
}
.anim_fadein{
	opacity: 1;
	transform:translate3d(0,0,0);
	transition: opacity 1.2s, transform 1.2s;
}
.anim_fadein02{
	opacity: 1;
	transform:translate3d(0,0,0);
	transition: opacity 1.8s, transform 1.8s;
}

@media only screen and (min-width: 768px) and (max-width: 1274px) {
.content_width{
	width:calc(100% - 30px);
	margin:0 15px;
}

.pro_feature dt{
	margin:0 1% 30px;
	width:27%;
}
.pro_feature dd{
	width:32%;
	margin-right:1%;
}
.fea_info{
	margin-bottom:30px;
}
.seca,.secb,.secc,.pro_feature{
	margin-bottom:100px;
}
.secc{
	margin-bottom:50px;
}
.pro_feature{
	padding-top:50px;
}


}

@media only screen and (min-width: 0) and (max-width: 767px) {
a:hover{
	opacity:1;
}
.pcNone {
	display:block!important;
}
.kv04_wp{
	overflow:hidden;
}
.kv04_img{
	margin:0 -20vw 0 -3vw;
	width:123vw;
	max-width:none!important;
}

.kv03_txt{
	width:76vw;
	left:12vw;
	top:50%;
	margin:0;
	margin-top:-12vw;
    height:auto;
}
.kv03_in_img{
	width:40%;
	padding: 100px 0 120px;
}
.main_logo {
    width: 50vw;
    margin-left: -25vw;
    margin-top: -18vw;
}
.kv03_ico {
    position: absolute;
    bottom: 0;
    left:auto;
	right:10vw;
    width: 50px;
	height:95px;
	font-size:0.9rem;
}
.kv03_ico_line{
	height:70px;
}
.kv03_ico_line span{
	animation:line_scr_sp linear 4s infinite;
}

@keyframes line_scr_sp{
	0%{top:-71px;}
	100%{top:71px;}
}
.kv04_ico{
	width:35vw;
	left:6vw;
	margin:0;
    height:auto;
}


.nav_con{
	display:none;
	padding:0;
	opacity:0;
	position:absolute;
	z-index:999;
	left:0;
	top:0;
	width:100vw;
	height:100vh;
	background:rgba(0,0,0,0.8);
}

.top_box{
	width:110px;
	padding:15px;
}
.top_logo{
	width:110px;
}
.nav_show,.nav_close{
	display:block;
	position:absolute;
	right:5px;
	top:5px;
	width:30px;
	height:30px;
	padding:10px;
	background:url(../img/btn_nav.png) no-repeat center center;
	background-size:30px;
}
.nav_close{
	background-image:url(../img/btn_nav_close.png);
	background-size:20px;
}
.top_nav{
	padding:70px 10vw 30px;
}
.top_nav li{
	display:block;
	text-align:center;
	margin-bottom:25px;
}
.top_nav li a{
	display:block;
	padding:10px;
	color:#fff;
}
.top_nav li a.active{
	border:1px rgba(255,255,255,0.8) solid;
	border-radius:30px;
}


.seca,.secb,.secc{
	height:auto;
}
.seca{
	margin:20vw 0 46vw;
	padding-top:38vw;
}
.secb{
	margin-bottom:54vw;
}
.secc{
	margin-bottom:55vw;
}
.seca_img{
	width:100vw;
	height:85.9vw;
	background-image:url(../img/img_a01_sp.png);
}
.secb_img{
	width:100vw;
	height:80vw;
	background-image:url(../img/img_b01_sp.png);
}
.secc_img{
	width:100vw;
	height:24.8vw;
	background-image:url(../img/img_c01_sp.png);
}
.seca_txt{
	left:0;
	top:6.7vw;
	width:auto;
}
.secb_txt{
	left:0;
	top:44vw;
	width:auto;
}
.secc_txt{
	left:0;
	top:28vw;
	width:auto;
}
.pro_feature{
	padding-top:5vw;
	margin:0 2vw 0 3vw;
	display:block;
}
.pro_feature dt{
	width:auto;
	margin-bottom:13vw;
}
.pro_feature dt h3{
	width:50%;
	margin-bottom:5vw;
}
.pro_feature dd{
	margin-left:5vw;
	margin-bottom:12vw;
	width:auto;
}
.fea_img{
	width:28%;
}
.fea_info{
	margin-bottom:15vw;
}
.fea_info h3{
	padding-left:22px;
	border-width:1px;
	font-size:0.8rem;
}
.fea_info h3 img{
	width:37px;
	top:-12px;
}
.fea_info h3 img.fea_info_ico02{
	width:43px;
	top:-12px;
}
.fea_info p{
	font-size:0.75rem;
}
.pro_box{
	padding-top:0;
	width:68vw;
	display:block;
}
.pro_img{
	width:auto;
	margin:0 7%;
}
.pro_txt{
	width:auto;
}
.pro_txt h3{
	border-width:1px;
	font-size:0.8rem;
}
.pro_limit span{
	line-height:1.3;
}
.pro_buy_btn{
	width:auto;
	font-size:0.875rem;
}
.foot_btn{
	height:12.6vw;
	background-image:url(../img/foot_btn_bg_sp.png);
}
.foot_btn a{
	font-size:0.875rem;
}
.foot_btn a:after{
	margin: 0 0 3px 10px;
	width: 13px;
    height: 6px;
}
.to_top_wp{
	margin:0 0 10vw;
}
.to_top{
	bottom:60px;
}
.to_top a{
	width:95px;
	margin-right:20px;
}
.foot_logo01{
	width:47vw;
}
.foot_logo02{
	width:25vw;
	margin: 8vw auto 15vw;
}
.copyarea{
	margin:0 20px;
	padding-bottom:14vw;
}
.copyarea li:last-child{
	text-align:center;
}
.copyarea li:last-child span{
	margin:0;
}




}
