@charset "UTF-8";
/* CSS Document */
body {
	position: relative;
	font-size: 16px;
	line-height: 1.5;
	font-family: 'Noto Sans JP', sans-serif;
	letter-spacing: .03em;
	word-break: break-word;
	word-wrap: break-word;
	overflow-wrap: break-word;
	color: #3F3D56;
}

*, *::before, *::after {
	box-sizing: border-box;
}

a {
	text-decoration: none;
	outline: none;
}

li {
	list-style: none;
}

.sub-text {
	font-size: 16px;
	color: #797988;
}

img {
	max-width: 100%;
	margin: 0 auto;
}

.container {
	max-width: 1000px;
	margin: 0 auto;
	padding: 120px 0 40px 0;
}

.triangle {
	padding-top: 180px;
	position: relative;
	overflow: hidden;
}

.triangle::before{
	content: '';
	display: block;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 180px 0 0 50vw;
	border-color: #FFF transparent transparent transparent;
	position: absolute;
	top: 0;
	right: 50%;
}

.triangle::after {
	content: '';
	display: block;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 0 180px 50vw;
	border-color:transparent transparent transparent #FFF;
	position: absolute;
	top: 0;
	left: 50%;
}

.triangle_color::after {
	border-color:transparent transparent transparent #F4F6F7;
}

.triangle_color::before {
	border-color:#F4F6F7 transparent transparent transparent;
}

.triangle .section-title {
	position: relative;
	z-index: 1;
}

.bg-gray {
	background: #F4F6F7;
}

/*header*/

.header-nav__link {
	font-size: 12px;
	margin-right: 22px;
	color: #414141;
	font-weight: bold;
}

.header-nav__link:hover {
	color: #FE5763;
}

.header {
	display: flex;
	position: fixed;
	width: 100%;
	height: 64px;
	justify-content: space-between;
	align-items: center;
	z-index: 99;
	background: #FFF;
}

.header-nav__list {
	display: flex;
}

.header__home-link {
	display: block;
}

.header__title {
	width: 132px;
	margin: 0 24px;
}

.nav-toggle {
	display: none;
}

/*mainvisual*/
.mainvisual-inner {
	font-size: 0;
	letter-spacing: 0;
}

.mainvisual-text__area {
	width: 50%;
	padding: 0 20px;
	text-align: center;
}

.mainvisual-video__area {
	width: 50%;
	position: relative;
}

.mainvisual-list__area {
	width: 50%;
	padding: 0 14px 0 32px;
}


.mainvisual .container {
	display: flex;
	position: relative;
	max-width: 1200px;
	width: 100%;
}

.form__button {
	display: inline-block;
	width: calc(50% - 40px);
	padding: 16px 0;
	margin: 0 20px;
	background: #FE5763;
	border-radius: 10px;
	color: #FFF;
	box-shadow: 0 6px #A8222B;
}

.form__button:hover {
	-webkit-transform: translateY(4px);
	transform: translateY(4px);
	transition: .2s;
	box-shadow: none;
}

.mainvisual .form__button {
	max-width: 500px;
	width: 100%;
	margin: 20px auto 34px;
}

.btn__wrapper {
	text-align: center;
	margin-top: 64px;
}

.clear::after {
	content: " ";
	display: block;
	clear: both;
}

.section-text_sub {
	max-width: 400px;
}

.section-text_main {
	position: relative;
	max-width: 600px;
}

.mainvisual-text {
	font-size: 20px;
}

.contents__item {
	display: flex;
	align-items: center;
	margin-bottom: 24px;
}

.function-list-label {
	display: block;
	margin: 16px 0;
	background: #FFF;
	border: 2px solid #3F3D56;
	border-radius: 10px;
	color: #3F3D56;
	font-size: 14px;
	font-weight: bold;
	text-align: center;
	padding: 12px 0;
	cursor: pointer;
}

.play-tap {
	margin: 24px auto 6px;
	max-width: 176px;
}

.mainvisual-video__wrapper {
	max-width: 350px;
}

.mainvisual-video {
	width: 100%;
}

.mainvisual-caption {
	color: #797988;
	font-size: 12px;
	text-align: center;
}

/*choose*/
.choose__items {
	padding: 0 0 0 30px;
	font-size: 0;
	letter-spacing: 0;
}

.choose__item:nth-of-type(odd) {
	margin: 0 80px 0 0;
}

.choose__item {
	display: inline-block;
	width: calc(50% - 40px);
	margin: 0 0 60px;
	font-size: 24px;
	vertical-align: top;
}

.choose-img {
	height: 100%;
}

.choose-content {
	display: table;
	position: relative;
	height: 140px;
	width: 100%;
	padding: 8px 48px;
	border-radius: 10px;
	background: #FFF;
}

.choose-caption {
	display: table-cell;
	font-weight: bold;
	font-size: 24px;
	vertical-align: middle;
}

.choose .container {
	max-width: 1060px;
}

.choose-img__wrapper {
	position: absolute;
	top: 30px;
	left: -30px;
	height: 115px;
}


.choose .section-title {
	max-width: 694px;
}

.section-title,
.section-text {
	margin: 0 auto 60px;
	text-align: center;
	font-size: 40px;
}

/*point*/
.point__items {
	font-size: 0;
	letter-spacing: 0;
}

.point-img {
	max-height: 100%;
}

.point__item {
	display: inline-block;
	width: calc(33.3333% - 40px);
	font-size: 20px;
	background: rgba(255,255,255,.9 );
	border-radius: 10px;
	box-shadow: 0 0 8px #C8C8C8;
	margin:0 60px 0 0;
	vertical-align: top;
	overflow: hidden;
}

.point__item:last-child {
	margin-right: 0;
}

.point-text {
	padding: 0 16px 24px;
	height: 120px;
}

.point-title {
	background: #3F3D56;
	padding: 24px 6px;
	color: #FFF;
	text-align: center;
}

.img-wrapper {
	height: 160px;
	margin: 24px;
}

.point .container {
	padding: 40px 16px 120px;
	max-width: 1092px;
	overflow: hidden;
}

.point .section-title {
	max-width: 578px;
	margin: 0 auto 60px 30px;
	padding-top: 125px;
}

/*frow*/
.flow .container {
	margin: -200px auto 0;
}

.flow .section-title {
	max-width: 454px;
}


.contents-img__wrapper {
	width: 160px;
	margin-right: 40px;
}

.contents-text__wrapper {
	width: calc(100% - 200px);
}

.flow-text {
	margin: 0 auto;
}

.flow .container {
	padding: 120px 0 408px 0;
}

.flow .contents-text-title {
	position: relative;
	padding: 0 0 0 32px;
}

.contents__item:last-child {
	margin-bottom: 0;
}

.contents-text-title {
	font-size: 24px;
	margin-bottom: 16px;
}

.function-img__wrapper {
	width: 50%;
	position: relative;
}

.function-text__wrapper {
	width: 50%;
	padding: 0 20px 0 0;
}

.function-text__wrapper:nth-child(2) {
	padding: 0 20px 0 0;
}

.function .section-title {
	max-width: 736px;
}

.function-text-title {
	display: block;
	margin: 0 auto 0 0; 
}

.function-text-title-sp {
	display: none;
}

.function-catch-1{
	max-width: 525px;
}

.function-catch-2{
	max-width: 470px;
}

.function-catch-3{
	max-width: 546px;
}

.contents {
	margin-top: 40px;
}

.slideshow {
	display: flex;
	width: 100%;
	margin-top: -60px;
	overflow: hidden;
}

.slideshow__items {
	display: flex;
	animation: loop-slide 30s infinite linear 1s both;
}

.slideshow__item {
	width: 330px;
}

.slideshow-text {
	margin-top: -328px;;
}
	

@keyframes loop-slide {
	from {
		transform: translateX(0);
	}
	to {
		transform: translateX(-100%);
	}
}

/*function-more*/
.flex-box {
	display: flex;
	margin: 24px 0;
}

.tag-list__items {
	padding: 12px 24px;
	margin: 12px 8px;
	font-size: 14px;
	border-radius: 30px;
	background: #F4F6F7;
}

.tag-list {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	font-weight: bold;
}

.function-more .container {
	max-width: 850px;
	padding: 40px 0 120px
}

.function-more .section-title{
	margin: 0 auto 80px;
	max-width: 414px;
}

.function-title {
	display: block;
}

.function-title-sp {
	display: none;
}

/*from-area*/
.form-area {
	background-image: url("../images/bg.jpg");
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}

.form-area .container {
	padding: 100px 0;
	text-align: center;
}

.form__button-text-sub {
	font-size: 20px;
}

.form__button-text {
	position: relative;
	display: inline-block;
	padding: 0 0 0 82px;
	font-size: 28px;
	font-weight: bold;
	line-height: 1.2;
	text-align: left;
}

.form__button-pick {
	margin: 0 2px 0 0;
	color: #F4E711;
}

.form__button_line {
	background: #FFF;
	color: #FE5763;
}

.form__button-text::before {
	content: "";
	position: absolute;
	top: 4px;
	right: 0;
	bottom: 0;
	left: 0;
	display: inline-block;
	width: 58px;
	height: 58px;
	margin: auto 0;
	background-image: url("../images/line.png");
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}

.form__button_download .form__button-text::before {
	background-image: url("../images/envelope-download.png");
}


.case__item {
	display: inline-block;
	width: calc(50% - 40px);
	font-size: initial;
	vertical-align: top;
	 margin-bottom: 80px;
}

.case-title {
	font-size: 32px;
	margin-bottom: 40px;
	font-weight: bold;
	color: #3F3D56;
	text-align: center;
	line-height: 1;
}

.case-img__container {
	display: flex;
	position: relative;
	height: 190px;
	z-index: 2;
	justify-content: space-between;
	margin-bottom: -90px;
}

.case-img-right {
	margin-right: 42px;
}

.case-img-ticket {
	max-width: 252px;
}

.case-img-delivery {
	max-width: 178px;
}

.case-img-sale {
	max-width: 227px;
	margin-right: 0;
}

.case-img-reserch {
	max-width: 170px;
}

.case__items {
	margin: -20px auto 40px;
	font-size: 0;
	letter-spacing: 0;
}

.case_text {
	position: relative;
	background: #F4F6F7;
	z-index: 1;
	padding: 155px 0 60px;
	border-radius: 40px;
	text-align: inherit;
	height: 383px;
}

.case-number-img {
	height: 68px;
	margin: 0 8px 0 30px;
}

.case__item:nth-of-type(odd) {
	margin-right: 80px;
}

/*comparison*/

.comparison .section-title {
	max-width: 614px;
}

.table {
	box-shadow: 0 0 8px #C8C8C8;
	border-radius: 40px;
}

.table-cell {
	display: flex;
	flex-wrap: wrap;
	background: #FFF;
}

.table-cell__item {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 25%;
	border-right: #EDEDFA 2px solid;
	border-bottom: #EDEDFA 2px solid;
	padding: 40px 22px;
}

.table-title {
	background: #3F3D56;
	color: #FFF;
	font-size: 32px;
	font-weight: bold;
	border-radius: 40px 40px 0 0;
	overflow: hidden;
}

.table-cell__item:last-child {
	border-right: none;
}

.table-cell:last-child {
	border-radius: 0 0 40px 40px;
}

.table-cell:last-child .table-cell__item {
	border-bottom: none;
}

.table-title .table-cell__item:nth-child(2){
	background: #FF6C6D;
}

.table-cell-circle {
	color: #FF6C6D;
}

.table-cell-text::before {
	content: " ";
	display: block;
	width: 30px;
	height: 30px;
	margin: 0 auto 20px;
	background-size: cover;
}

.table-cell-circle::before {
	background-image: url("../images/circle.png");
} 

.table-cell-triangle::before {
	background-image: url("../images/triangle.png");
	width: 34px;
	height: 30px;
} 

.table-cell-cross::before {
	background-image: url("../images/cross.png");
} 

.table-cell-text {
	font-size: 14px;
}

.point-graph {
	background-image: url("../images/point-graph.png");
	background-position: top right;
	background-repeat  : no-repeat;
	background-size: 73% auto;
}

.flow .contents-text-title::before {
	content: "";
	position: absolute;
	left: 0;
	background-image: url(../images/check.png);
	width: 24px;
	height: 24px;
	margin: 6px 0;
	vertical-align: middle;
}

/*accordion*/

.accordion-check{
	display: none;
}
.accordion-label{
	display: block;
	padding: 24px 72px 24px 85px;
	background: #3F3D56;
	color: #FFF;
	border-radius: 10px;
	font-weight: bold;
	font-size: 24px;
	cursor: pointer;
}

.accordion-label::after {
	content: '';
	position: absolute;
	top: 0;
	right: 40px;
	bottom: 0;
	width: 17px;
	height: 17px;
	margin: auto 0;
	border-top: 2px solid #FFF;
	border-right: 2px solid #FFF;
	-webkit-transform: rotate(135deg);
	transform: rotate(135deg);
}

.accordion-label__wrapper {
	position: relative;
}

.accordion-content{
	position: relative;
	font-size: 20px;
	background:#FFF;
	border-radius: 10px;
	height: 0;
	opacity: 0;
	padding: 0 48px 0 85px;
	transition: .5s;
	margin-bottom: 24px;
}

.accordion-check:checked ~ .accordion-content{
	height: auto;
	padding: 40px 48px 40px 85px;
	opacity: 1;
	margin-top: 8px;
}

.accordion-check:checked + .accordion-label__wrapper .accordion-label::after {
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

.accordion-text::before ,
.accordion-content::before {
	content: "Q";
	position: absolute;
	left: 40px;
	font-size: 40px;
	line-height: 1;
}

.accordion-content::before {
	content: "A";
	color: #FE5763;
	font-weight: bold;
}

.question .container {
	padding: 120px 16px 96px 16px;
}

/*selected*/

.selected .contents-text-title {
	color: #FE5763;
	margin-bottom: 10px;
}

.effect .section-title,
.effect .section-text {
	margin: 0 auto 120px;
}

.effect .container{
	max-width: 880px;
}

.selected .section-title {
	max-width: 597px;
}

.selected .contents__items {
	display: flex;
	flex-wrap: wrap;
}

.selected .contents__item {
	width: calc(50% - 40px);
	margin: 0 20px 40px;
}

.selected .sub-text {
	font-size: 14px;
}


/*effect*/

.section-text_more {
	max-width: 365px;
}

.section-title_how-to {
	max-width: 462px;
}

.effect .section-text_infinity {
	max-width: 1200px;
	width: 100%;
	margin: -60px auto 160px;
}

.section-text_oparation {
	max-width: 785px;
}

.function .contents-img__wrapper {
	width: 100px;
	margin-right: 16px;
}
	
.selected .contents-img__wrapper {
	width: 100px;
	margin-right: 24px;
}

.function .contents-text__wrapper{
	width: calc(100% - 116px);
}

.selected .contents-text__wrapper {
	width: calc(100% - 124px);
}

.form-area .section-title {
	max-width: 454px;
}

.selected .container {
	padding: 120px 0 80px 0;
	margin: -175px auto 0;
}

.table-cell__item_index {
	font-size: 16px;
	font-weight: bold;
}

.effect .sub-text {
	padding: 0 40px;
}

.comparison .container {
	padding: 120px 0;
}

.table-cell-img__wrapper {
	max-width: 140px;
}

.oparation-img {
	display: block;
}

.oparation-img-sp {
	display: none;
}

/*function*/
.function__item {
	display: flex;
	align-items: center;
	margin-top: 100px;
}

.function__items .function__item:nth-child(odd){
	flex-direction: row-reverse;
}

.function__items .function__item:nth-child(odd) 
.function-text__wrapper {
	padding: 0 0 0 20px;
}

.function .contents__item {
	align-items: flex-start;
}

.function .contents-text-title {
	margin-bottom: 0;
}
.function .container {
	max-width: 1200px;
}

.function {
	overflow: hidden;
}

.function-img_live {
	max-width: 495px;
}

.function-img_revenue {
	max-width: 500px;
}

.function-img_official {
	max-width: 550px;
}

.function-img {
	width: 100%;
}

.function-img__wrapper::before {
	content: "";
	width:  640px;
	height: 300px;
	position: absolute;
	bottom: 0;
	z-index: -1;
	border-radius: 40px;
}


.function-img__wrapper_live::before {
	background: #FD8140;
	right: 13%;
}

.function-img__wrapper_revenue::before {
	background: #F6D134;
	left: 13%;
}

.function-img__wrapper_official::before {
	background: #42CFDA;
	right: 13%;
}

.section-img-sp {
	display: none;
}

.section-img-pc {
	display: block;
}

/*メインビジュアル*/

.function-list-label:hover{
	background: #3F3D56;
	color: #FFF;
}

.function-list-check {
	display: none;
}

.function-list-check:checked + .function-list-label {
	background: #3F3D56;
	color: #FFF;
	transform: translateX(-16px);
}

.section-text_main::before {
	content: " ";
	display: block;
	width: 350px;
	height: 170px;
	background-color: #FFF;
	background-image: radial-gradient(#F7F7FF 30%, transparent 30%);
	background-size: 27px 27px;
	position: absolute;
	top: -16px;
	left: -125px;
	z-index: -1;
}

.section-text_main::after {
	content: " ";
	display: block;
	width: 350px;
	height: 170px;
	background-color: #FFF;
	background-image: radial-gradient(#F7F7FF 30%, transparent 30%);
	background-size: 27px 27px;
	position: absolute;
	bottom: -64px;
	right: -72px;
	z-index: -1;
}


.mainvisual-side__area {
	display: flex;
	width: 50%;
}

/*footer*/
.footer-text {
	color: #FFF;
	padding: 12px 8px;
	font-size: 14px;
	text-align: center;
}

.footer {
	width: 100%;
	background: #3F3D56;
}

.toggle-icon {
	display: none;
}


.scrolldown {
	position: absolute;
	bottom: -24px;
	left: 50%;
	width: 34px;
	height: 33px;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
}

.scrolldown span {
	position: absolute;
	top: -15px;
	color: #3F3D56;
	font-size: 11px;
}

.scrolldown::after {
	content: "";
	position: absolute;
	top: 0;
	right: 50%;
	width: 1px;
	height: 30px;
	background: #3F3D56;
	animation: pathmove 1.4s ease-in-out infinite;
	opacity: 0;
}

@keyframes pathmove{
	0%{
		height:0;
		top:0;
		opacity: 0;
	}
	30%{
		height:30px;
		opacity: 1;
	}
	100%{
		height:0;
		top:50px;
		opacity: 0;
	}
}

/*form*/

.form__iframe {
	width: 100%;
	min-height: 850px;
}

/*complate*/
.complate .container {
	height: 100vh;
	padding: 160px 0 40px 0;
	text-align: center;
}

.complate-img__wrapper {
	max-width: 392px;
	margin: 0 auto;
}

.complate-title {
	margin-top: 80px;
	font-size: 24px;
}

.complate .sub-text {
	margin: 24px 0 40px 0;
}

.complate .form__button {
	max-width: 300px;
}

@media screen and (max-width: 1200px) {
	
	.container {
		padding: 120px 16px 40px 16px;
	}
	
	.comparison .container {
		padding: 120px 16px;
	}
	
	.point .container {
		padding: 40px 16px 120px;
	}
	
	.point__item {
		width: calc(33.3333% - 16px);
		margin: 0 24px 0 0;
		font-size: 18px;
	}
	
	.case__item:nth-of-type(odd) {
		margin-right: 24px;
	}
	
	.case__item {
		width: calc(50% - 12px);
	}
}

@media screen and (max-width: 1000px) {
	
	.form__button-text-sub {
		font-size: 14px
	}
	
	.form__button-text {
		padding: 0 0 0 56px;
		font-size: 20px
	}
	
	.form__button-text::before {
		width: 40px;
		height: 40px;
	}
	
	.mainvisual-text {
		font-size: 16px;
	}
	
	.mainvisual-list__area {
		padding: 0;
		margin: 0 0 0 32px;
	}
	
	.mainvisual-side__area {
		max-width: 600px;
		width: 100%;
		margin: 32px auto 0;
	}
	
	.mainvisual-text__area {
		padding: 0;
		width: auto;
}
	
	/*mainvisual-button*/
	
	.form__button-text {
		font-size: 18px;
	}
	
	.mainvisual .section-text {
		margin: 0 auto 24px;
	}
	
	.mainvisual .container {
		padding-top: 74px;
		flex-wrap: wrap;
		flex-direction: column;
	}
	
	.section-text_main::before,
	.section-text_main::after {
		display: none;
	}
	
	.scrolldown {
		display: none;
	}
	
	.toggle-icon,
	.toggle-icon-line{
		display: block;
		transition: all .4s;
	}
	
	.toggle-icon {
		position: relative;
		width: 50px;
		height: 50px;
		cursor: pointer;
		z-index: 4;
	}
	
	.toggle-icon-line {
		position: absolute;
		left: 50%;
		transform: translateX(-50%);
		width: 20px;
		height: 2px;
		background-color: #3F3D56;
		border-radius: 4px;
	}
	
	.toggle-icon-line:nth-of-type(1) {
		top: 17px;
	}
	
	.toggle-icon-line:nth-of-type(2) {
		top: 24px;
	}
	
	.toggle-icon-line:nth-of-type(3) {
		bottom: 17px;
	}
	
	.nav-toggle:checked + .toggle-icon > .toggle-icon-line:nth-of-type(1) {
		top:0;
		transform: translateY(24px) translateX(-50%)rotate(-45deg);
		background-color: #FFF;
	}
	
	.nav-toggle:checked + .toggle-icon > .toggle-icon-line:nth-of-type(2) {
		opacity: 0;
	}
	
	.nav-toggle:checked + .toggle-icon > .toggle-icon-line:nth-of-type(3) {
		bottom:0;
		transform: translateY(-24px) translateX(-50%) rotate(45deg);
		background-color: #FFF;
	}
	
	.nav-toggle:checked ~ .header-nav .header-nav__link {
		color: #FFF;
		padding: 16px 0;
		display: block;
		border-bottom: 1px solid;
		font-size: 14px;
	}
	
	.nav-toggle:checked ~ .header-nav .header-nav__list {
		margin-top: 50px;
	}
	
	
	.header-nav__list {
		display: block;
		text-align: center;
		margin: 0 auto;
	}
	
	.header-nav {
		display: none;
	}
	
	.nav-toggle:checked ~ .header-nav {
		display: block;
		position: fixed;
		width: 100%;
		height: 100vh;
		background: #3F3D56;
		z-index: 3;
		overflow: auto;
	}
	
	.header-nav__link {
		margin-right: 0;
	}
	
	.header__title {
		width: 96px;
		height: 27px;
		margin: auto 16px;
	}
	
	.header {
		box-shadow: 0 3px 6px rgba(0,0,0,0.1);
		height: 50px;
		align-items: normal;
	}
	
	.mainvisual-video__area {
		height: 616px;
	}
	
	.slideshow__item {
		width: 260px;
	}
	
	.slideshow-text {
		margin-top: -290px;
		padding: 0 16px;
	}
	
	.flow .container {
		padding: 120px 16px 350px 16px;
	}
	
	.slideshow {
		margin-top: -45px;
	}
	
	.form .container {
		padding: 50px 0 40px;
	}
}

@media screen and (max-width: 768px) {	
	.point__item {
		display: block;
		width: auto;
		margin: 0 0 24px 0;
	}
	
	.tag-list__items {
		width:calc(50% - 8px);
		margin: 5px 0;
		font-size: 12px;
		border-radius: 4px;
		padding: 11px 0;
		text-align: center;
	}
	
	.tag-list {
		justify-content: space-between;
	}
	
	.choose__item {
		display: block;
		width: auto;
		margin-bottom: 16px;
	}
	
	.choose__item:nth-of-type(odd){
		margin: 0 0 16px 0;
	}
	
	.choose-caption {
		font-size: 16px;
	}
	
	.choose-content {
		padding: 32px;
		height: auto;
	}
	
	.contents-text-title {
		font-size: 16px;
		margin-bottom: 4px;
	}
	
	.contents__item {
		align-items: flex-start;
	}
	
	.choose__items {
		padding: 0 0 0 20px;
	}
	
	.choose-img__wrapper {
		height: 70px;
		left: -20px;
		bottom: 0;
		top: auto;
	}
	
	.point-text {
		padding: 0 16px 24px;
		height: auto;
	}
	
	.point-title {
		padding: 20px;
		font-size: 16px;
		line-height: 1;
	}
	
	
	.section-title,
	.section-text {
		margin: 0 auto 24px;
		font-size: 18px;
	}
	
	.container,
	.selected .container,
	.comparison .container {
		padding: 40px 16px;
	}
	
	.flow .container {
		margin: -80px auto 0;
	}
	
	.flow .contents-text-title::before {
		width: 20px;
		height: 20px;
		margin: 4px 0;
		background-size: contain;
	}
	
	.contents {
		margin-top: 24px;
	}
	
	/*table*/
	.table-cell__item {
		width: 33.33%;
		padding: 16px;
		align-items: inherit;
		border-bottom: none;
		border-right: #EDEDFA 1px solid;
	}
	
	.table-title .table-cell__item:first-child {
		display: none;
	}
	
	.table-cell__item_index {
		width: 100%;
		background: #F7F7FF;
		padding: 8px 0;
		font-size: 14px;
		border: none;
	}
	
	.table-title {
		border-radius: 10px 10px 0 0;
	}
	
	/*form*/
	.form__button {
		display: block;
		max-width: 500px;
		width: auto;
		margin: 0 auto 24px;
	}
	
	.form-area .form__button-text {
		font-size: 18px;
	}
	
	.form-area .container {
		padding: 24px 16px
	}
	
	/*point*/
	.case-number-img {
		height: 40px;
		margin-left: 12px;
	}
	
	.case-img__container {
		margin-bottom: -30px;
		height: auto;
	}
	
	.case_text {
		padding: 16px;
		border-radius: 10px;
		text-align: left;
	}
	
	.case__item {
		display: block;
		width: auto;
		padding: 8px 0;
		margin: 0;
	}
	
	.case-title {
		font-size: 16px;
		margin-bottom: 8px;
		text-align: inherit;
	}
	
	.table {
		border-radius: 10px;
	}
	
	.accordion-label {
		font-size: 14px;
		padding: 16px 40px 16px 36px;
		font-weight: normal;
	}
	
	.accordion-label::after {
		right: 16px;
		width: 10px;
		height: 10px;
	}
	
	.accordion-text::before ,
	.accordion-content::before {
		font-size: 18px;
		left: 16px;
	}
	
	.accordion-content {
		margin-bottom: 16px;
		padding: 0 16px 0 36px;
		font-size: 12px;
	}
	
	.accordion-check:checked ~.accordion-content {
		margin-top: 4px;
		padding: 16px 16px 16px 36px;
	}

	
	.table-cell:last-child {
		border-radius: 0 0 10px 10px;
	}
	
	.question .container {
		padding: 60px 16px 40px;
	}
	
	.case-img-right {
		margin-right: 16px;
	}
	
	.effect .section-title,
	.effect .section-text {
		margin: 0 auto 40px;
	}
	
	.case__items {
		margin: 0 auto 32px;
	}
	
	.sub-text {
		font-size: 12px;
	}
	
	.function-more .section-title{
		margin: 0 auto 50px;
		max-width: 220px;
	}
	
	.function-more .container {
		padding: 0 16px 40px
	}
	
	.choose .section-title,
	.selected .section-title,
	.comparison .section-title {
		max-width: 300px;
	}
	
	.flow .section-title {
		max-width: 250px;
	}
	
	.point .section-title {
		max-width: 300px;
		padding-top: 24px;
		margin: 0 auto 24px 0;
	}

	.selected .section-title {
		margin: 0 auto 40px;
	}
	
	.section-text_more {
		max-width: 200px;
	}
	
	.effect .section-title_how-to {
		max-width: 240px;
		margin: 0 auto 32px;
	}
	
	.section-text_oparation {
		max-width: 343px;
	}
	
	.form-area .section-title {
		max-width: 242px;
		margin: 0 auto 16px;
	}
	
	.contents-img__wrapper,
	.selected .contents-img__wrapper{
		width: 60px;
		margin-right: 10px;
	}
	
	.contents-text__wrapper,
	.selected .contents-text__wrapper {
		font-size: 12px;
		width: calc(100% - 70px);
	}
	
	.selected .contents__items {
		display: block;
	}
	
	.selected .contents__item {
		width: 100%;
		margin: 0 0 24px 0;
	}
	
	.selected .sub-text {
		font-size: 12px;
	}
	
	.selected .contents__item:last-child {
		margin-bottom: 0;
	}
	
	.selected .container {
		margin: -75px auto 0;
	}
	
	.table-cell-text {
		font-size: 10px;
	}
	
	.table-title {
		font-size: 16px;
	}
	
	.effect .sub-text {
		height: auto;
		padding: 0;
	}
	
	.case_text {
		height: auto;
	}
	
	.table-cell-text::before {
		margin: 0 auto 8px;
	}
	
	.table-cell-circle::before,
	.table-cell-cross::before{
		width: 24px;
		height: 24px;
	} 
	
	.table-cell-triangle::before{
		width: 28px;
		height: 24px;
	} 
	
	.selected .contents-text-title {
		margin-bottom: 4px;
	}
	
	.table-cell-img__wrapper {
		max-width: 65px;
	}
	
	.case-img-ticket {
		max-width: 122px;
	}
	
	.case-img-delivery {
		max-width: 76px;
	}
	
	.case-img-sale {
		max-width: 97px;
	}
	
	.case-img-reserch {
		max-width: 74px;
	}
	
	.case__item:nth-of-type(odd) {
		margin: 0;
	}
	
	.point-graph {
		max-width: 500px;
		margin: 0 auto;
		padding: 40px 0;
		background-size: 60%;
	}
	
	.img-wrapper {
		height: 100px;
	}
	
	.point .container {
		padding: 0 16px 16px;
	}
	
	.triangle::after{
		border-width: 0 0 60px 50vw;
	}
	
	.triangle::before{
		border-width: 60px 0 0 50vw;
	}
	
	.triangle {
		padding-top: 60px;
	}
	
	.effect .section-text_infinity {
		margin: -48px auto 80px;
	}
	
	.section-img-sp {
		display: block;
	}
	
	.section-img-pc {
		display: none;
	}
	
	.selected .container,
	.choose .container,
	.flow .container,
	.effect .container,
	.point__items{
		max-width: 532px;
	}
	
	.point__items {
		margin: 0 auto;
	}
	
	.function .section-title {
		max-width: 340px;
	}

	.function-list {
		padding: 0;
	}
	
	.function .contents-img__wrapper{
		width: 60px;
		margin-right: 10px;
	}
	
	.flow .contents-text-title {
		padding: 0 0 0 24px;
	}
	
	.oparation-img {
		display: none;
	}
	
	.oparation-img-sp {
		display: block;
	}
	
	.function .contents-text__wrapper {
		font-size: 12px;
		width: calc(100% - 70px);
	}
	
	.function-title {
		display: none;
	}
	
	.function-title-sp {
		display: block;
	}
	
	.complate .form__button-text-sub {
		font-size: 14px;
	}
	
	.complate .sub-text {
		margin: 24px 0 40px 0;
	}
	
	.complate-title {
		margin-top: 40px;
		font-size: 16px;
	}
	
	.complate-img__wrapper {
		max-width: 250px;
	}
	
	.complate .container {
		padding: 90px 16px 40px 16px;
	}

}

@media screen and (max-width: 600px) {
	.function__item {
		display: block;
		margin-top: 40px;
	}
	
	.function-text__wrapper,
	.function-img__wrapper{
		width: 100%;
		padding: 0;
	}
	
	.function-img_live {
		max-width: 200px;
	}
	
	.function-img {
		padding: 24px 0 0;
	}
	
	.function-img__wrapper::before {
		display: none;
	}
	
	.function-catch {
		max-width: 300px;
	}
	
	.function-img_live {
		max-width: 200px;
	}
	
	.function-img_revenue {
		max-width: 196px;
	}
	
	.function-img_official {
		max-width: 253px;
	}
	
	.section-text_sub {
		max-width: 300px;
	}
	
	.section-text_main {
		max-width: 400px;
	}
	
	.play-tap {
		max-width: 120px;
	}
	
	.slideshow {
		margin-top: -30px;
	}
	
	.point .section-title {
		max-width: 230px;
		padding: 0;
	}
	
	.function-text-title-sp {
		display: block;
	}
	
	.function-text-title {
		display: none;
	}
	
	.function__items .function__item:nth-child(odd) .function-text__wrapper {
		padding: 0;
	}
	
	.function-catch {
		margin: 0 auto;
	}
	
	.mainvisual-video__wrapper {
		max-width: 160px;
		margin: 0 auto;
		height: 350px;
	}
	
	.mainvisual-caption {
		font-size: 10px;
	}
	
	.mainvisual-text {
		font-size: 14px;
	}
	
	.function-list {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	
	.function-list-label {
		margin: 10px 0 0;
		font-size: 12px;
		padding: 9px 0;
		text-align: center;
	}
	
	.function-list__item {
		width: calc(50% - 10px);
	}
	
	.mainvisual-side__area {
		flex-direction: column;
		width: 100%;
		margin: 0 auto;
	}
	
	.mainvisual-video__area {
		max-width: 180px;
		width: auto;
		height: 395px;
		margin: 0 auto;
	}
	
	.mainvisual-list__area {
		width: auto;
		margin: 0;
	}
	
	.function-list-check:checked + .function-list-label {
		transform: rotateX(0);
	}
	
	.slideshow__item {
		width: 180px;
	}
	
	.slideshow-text {
		margin-top: -150px;
	}
	
	.flow .container {
		padding: 120px 16px 190px 16px;
	}
	
	.function .section-title {
		margin-bottom: 60px;
	}
	
	.form__iframe {
		min-height: 1200px;
	}
	
}

