@charset "UTF-8";

/* textbook-section */
@media all {
	.textbook-section-lead {text-align: center;}

	.textbook-ttl {
		font-weight: bold;
		color: var(--main-blue);
	}
	.textbook-figure-dt {
		margin-top: 1em;
		font-size: 14rem;
		font-weight: bold;
		color: var(--main-blue);
	}
	.textbook-figure-dd {
		position: relative;
		margin: 10rem auto 0;
		width: 230rem;
		font-weight: 600;
	}
	.textbook-figure-dd::after {
		content: '';
		position: absolute;
		bottom: -4rem;
		left: 0;
		display: block;
		width: 100%;
		height: max(1px, 1rem);
		background: linear-gradient(to right, #f00, #b507de, #00a2e7);
	}
	.price-num,
	.price-yen {color: var(--main-red);}
	.price-taxin {font-weight: normal;}

	.price-num {font-size: 24rem;}
	.price-yen, .price-taxin {font-size: 14rem;}

	.buy-form .button {justify-content: center;}
	.textbook-content-notice {
		background-color: #ccdfec;
		color: var(--main-blue);
		text-align: center;
	}
	.textbook-content-notice .ttl {
		margin-bottom: .5em;
		font-weight: bold;
	}

	/* sp */
	@media only screen and (max-width: 767px) {
		.textbook-content {margin-top: 70rem;}
		.textbook-content-img {
			margin: 0 auto;
			width: 220rem;
			box-shadow: 3rem 3rem 3rem rgba(0,0,0,.2);
		}
		.textbook-content-text {
			margin-top: 30rem;
			text-align: center;
		}
		.textbook-ttl {
			font-family: 'Noto Sans JP', sans-serif!important;
			margin-top: 20rem;
			font-size: 20rem;
		}
		.textbook-ttl small {font-size: 14rem;}

		.buy-form {margin-top: 40rem;}
		.buy-form .button {
			width: 250rem;
			height: 60rem;
			font-size: 22rem;
		}
		.buy-form .button.rainbow::after {
			top: calc(50% - 10rem);
			width: 20rem;
		}
		.buy-form .button > img {
			margin-left: 5rem;
			width: 25rem;
		}

		.textbook-content-notice {
			margin-top: 80rem;
			padding: 18rem 15rem;
			font-size: 12rem;
			line-height: 20rem;
		}
		.textbook-content-notice .ttl {font-size: 14rem;}
	}

	/* pc & tab */
	@media print,
	(min-width: 768px) {
		.textbook-section {margin-top: 100rem;}
		.textbook-section-lead {line-height: 2.5;}

		.textbook-content {
			display: flex;
			align-items: flex-end;
			justify-content: space-between;
			margin-top: 100rem;
		}

		.textbook-content-img {
			margin-left: 97rem;
			width: 354rem;
		}
		.textbook-content-img img {
			box-shadow: 5rem 5rem 5rem rgba(0,0,0,.2);
		}

		.textbook-content-text {width: 400rem;}
		.textbook-ttl {
			margin-top: 16rem;
			font-size: 22rem;
		}
		.textbook-ttl small {font-size: 16rem;}
		.textbook-figure-dd {margin-top: 22rem;}
		.buy-form {margin-top: 30rem;}
		.buy-form .button {
			width: 100%;
			height: 80rem;
			font-size: 22rem;
		}
		.buy-form .button > img {
			margin-left: 5rem;
			width: 25rem;
		}
		.textbook-content-notice {
			margin-top: 90rem;
			padding: 20rem 15rem;
			font-size: 14rem;
			line-height: 22rem;
		}
	}
}

/* trial-list */
@media all {
	.trial-item {background-color: var(--bg-lightblue);}
	.trial-header {
		font-family: var(--lineseed);
		font-weight: bold;
		color: var(--main-blue);
	}
	.trial-header-no {
		display: inline-block;
		color: #fff;
	}
	.trial-btn {text-align: right;}
	.trial-btn .button::before {
		top: -2rem;
		left: -2rem;
		width: calc(100% + 4rem);
		height: calc(100% + 4rem);
	}
	.trial-img img {
		width: 100%;
		height: 100%;
	}
	.trial-img, .trial-img::before, .trial-img span {
		padding: 0;
		border-radius: 0!important;
	}
	.trial-img::before {
		background: linear-gradient(to bottom right, #ff0080, #da005f 13%, #7300db 45%, #003fbe 87%, #005eff 100%);
	}

	/* sp */
	@media only screen and (max-width: 767px) {
		.trial-list {
			margin-top: 80rem;
			margin-left: -25rem;
			width: 100vw;
		}
		.trial-item {
			display: flex;
			flex-direction: column-reverse;
			padding: 40rem 25rem;
		}
		.trial-item + .trial-item {margin-top: 40rem;}

		.trial-text {margin-top: 30rem}
		.trial-header {font-size: 18rem;}
		.trial-header-no {
			padding: 7rem 15rem 7rem 10rem;
			clip-path: polygon(0 0, 100% 0, calc(100% - 10rem) 100%, 0 100%);
		}
		.trial-exp {
			margin-top: 30rem;
			line-height: 2.285;
		}

		.trial-btn {margin-top: 30rem;}
		.trial-btn .button {
			width: 198rem;
			height: 43rem;
			font-size: 16rem;
		}
		.trial-btn .button > span {padding-left: 30rem;}
		.button img.outgo {
			margin-left: 6rem;
			width: 18rem;
			transform: translate(3rem, 0);
		}
		
		.trial-img {
			width: 348rem;
			height: 245rem;
		}
	}

	/* pc & tab */
	@media print,
	(min-width: 768px) {
		.trial-list {margin-top: 100rem;}
		.trial-item {
			display: flex;
			justify-content: space-between;
			margin-top: 40rem;
			padding: 40rem 50rem;
		}

		.trial-text {
			position: relative;
			width: 420rem;
		}
		.trial-header {font-size: 22rem;}
		.trial-header-no {
			padding: 10rem 20rem 10rem 10rem;
			font-size: 20rem;
			clip-path: polygon(0 0, 100% 0, calc(100% - 10rem) 100%, 0 100%);
		}
		.trial-exp {
			margin-top: 30rem;
			line-height: 2.5;
		}
		.trial-btn {
			position: absolute;
			bottom: 0;
			right: 0;
		}
		.trial-btn .button {
			font-size: 18rem;}
		.button img.outgo {
			margin-left: 10rem;
			width: 20rem;
			transform: none;
			transition: filter .3s;
		}
		.button:hover .outgo {filter: brightness(0) invert(1);}


		.trial-img {
			width: 398rem;
			height: 283rem;
		}
	}
}

/* tab-list */
@media all {
	.tab-list {
		display: flex;
		justify-content: space-between;
		margin: 0 auto;
		font-weight: bold;
	}
	.tab-item-inner {
		display: flex;
		align-items: center;
		justify-content: center;
		margin-top: 2rem;
		margin-left: 2rem;
		width: calc(100% - 4rem);
		height: calc(100% - 2rem);
		background-color: rgba(239,239,239,1);
		color: var(--main-blue);
		transition: background-color .3s, color .3s;
	}
	.tab-item:not(.active) .tab-item-inner {cursor: pointer;}
	.active .tab-item-inner {
		color: #fff;
		background-color: rgba(239,239,239,0);
	}

	.detail-list {background-color: #fff;}
	.detail-item {display: none;}
	.detail-item.active {display: block;}

	.feature-item-header,
	.feature-item-dt {
		font-family: var(--lineseed);
		color: var(--main-blue);
		font-weight: bold;
	}
	.feature-item-no {
		display: inline-block;
		color: #fff;
	}

	.feature-item-dt.button,
	.feature-item-dt.button::before,
	.feature-item-dt.button span {
		width: 100%;
		border-radius: 0;
	}
	.feature-item-dt.button::before {left: 0;}
	.feature-item-dt span {
		justify-content: center;
		padding: 0;
	}

	/* sp */
	@media only screen and (max-width: 767px) {
		.detail-section {padding: 50rem 0;}
		.tab-list {padding: 0 25rem;}
		.tab-item {
			width: 108rem;
			height: 50rem;
			border-top-left-radius: 10rem;
			border-top-right-radius: 10rem;
		}
		.tab-item-inner {
			border-top-left-radius: 8rem;
			border-top-right-radius: 8rem;
			font-size: 18rem;
		}

		.detail-item {padding: 60rem 25rem;}
		
		.feature-item {margin-top: 70rem;}
		.feature-item-header {
			display: flex;
			margin-bottom: 20rem;
			font-size: 20rem;
		}
		.feature-item-no {
			flex-shrink: 0;
			padding: 5rem 0 5rem 14rem;
			width: 65rem;
			height: 32rem;
			font-size: 22rem;
			clip-path: polygon(0 0, 100% 0, calc(100% - 8rem) 100%, 0 100%);
		}
		.feature-item-ttl {
			margin-left: 10rem;
			line-height: 34rem;
		}

		.feature-item-dl + .feature-item-dl {margin-top: 40rem;}
		.feature-item-dt {
			height: auto;
			font-size: 18rem;
			line-height: 28rem;
		}
		.feature-item-dt > span {padding: 6rem 0;}
		.feature-item-dd {
			margin-top: 10rem;
			line-height: var(--txt-lineheight);
		}

		.feature-item-img {margin-top: 10rem;}
	}

	/* pc & tab */
	@media print,
	(min-width: 768px) {
		.tab-list {width: 970rem;}
		.tab-item {
			width: 310rem;
			height: 60rem;
			border-top-left-radius: 10rem;
			border-top-right-radius: 10rem;
		}
		.tab-item-inner {
			border-top-left-radius: 8rem;
			border-top-right-radius: 8rem;
			font-size: 22rem;
		}
		.tab-item:not(.active) .tab-item-inner:hover {
			background-color: var(--table-lightblue);
			color: #fff;
		}

		.detail-section {
			margin-top: 100rem;
			padding: 60rem 0;
			background-position: left top;
		}

		.detail-item {
			padding: 80rem 50rem 100rem;
		}
		.fotorama-wrapper {
			margin: 0 auto;
			width: 665rem;
		}

		.feature-item {margin-top: 80rem;}
		.feature-item-header {
			margin-bottom: 35rem;
			font-size: 22rem;
		}
		.feature-item-no {
			padding: 5rem 0 5rem 14rem;
			width: 65rem;
			height: 32rem;
			clip-path: polygon(0 0, 100% 0, calc(100% - 8rem) 100%, 0 100%);
		}

		.feature-item-dl {width: 420rem;}
		.feature-item-dt {
			font-size: 20rem;
			height: 40rem;
		}

		.feature-item-dd {
			margin-top: 16rem;
			line-height: 2.5;
		}
		.feature-item-text {width: 480rem;}
		.feature-item-img {width: 396rem;}
		
	}
}

/* #summary & authors */
@media all {
	.summary-list {border-bottom: max(2px, 2rem) dotted var(--table-lightblue);}
	.summary-dt {
		position: relative;
		font-weight: bold;
		color: var(--main-blue);
		border-top: max(2px,2rem) dotted var(--table-lightblue);
			line-height: 1.5;
	}
	/* .summary-dt:hover {cursor: pointer;} */
	/* .summary-dd-opener {position: absolute;} */
	.summary-dd-opener {display: none;}
	/* .summary-dd {
		display: none;
		line-height: 2;
	} */
	.summary-dd {line-height: 2;}

	.author-dl {
		display: flex;
		flex-wrap: wrap;
	}
	.author-dt {
		background-color: var(--bg-lightblue);
		font-weight: bold;
		color: var(--main-blue);
	}
	.author-dd p:last-child {
		font-weight: 500;
		color: var(--table-lightblue);
	}

	.author-dl {border-top: max(1px, 1rem) solid var(--table-lightblue);}
	.author-dt, .author-dd {border-bottom: max(1px, 1rem) solid var(--table-lightblue);}
	.author-dt {border-left: max(1px, 1rem) solid var(--table-lightblue);}
	.author-dd {border-right: max(1px, 1rem) solid var(--table-lightblue);}

	/* sp */
	@media only screen and (max-width: 767px) {
		.summary-dt {
			padding: 12rem 30rem 12rem 16rem;
			font-size: 16rem;
		}
		.summary-dd-opener {
			top: 16rem;
			right: 8rem;
			width: 16rem;
			font-size: 12rem;
		}
		/* .summary-dd-opener::before,
		.summary-dd-opener::after {top: -.5rem;} */
		.summary-dd {
			padding: 15rem 25rem;
		}

		.author-dl {line-height: var(--txt-lineheight);}
		.author-dt {
			padding: 10rem 0 10rem 10rem;
			width: 110rem;
		}
		.author-dd {
			padding: 10rem;
			width: calc(100% - 110rem);
		}
		.author-dd p:last-child {
			font-size: 14rem;
		}
	}

	/* pc & tab */
	@media print,
	(min-width: 768px) {
		.summary-dt {
			padding: 12rem 40rem;
			font-size: 20rem;
			transition: opacity .3s;
		}
		/* .summary-dt:hover {opacity: .7;} */
		/* .summary-dd-opener {
			top: 16rem;
			right: 0;
			width: 20rem;
			font-size: 14rem;
		} */

		.summary-dd {padding: 0 40rem 20rem 90rem;}

		.author-dl {
			margin: 0 auto;
			width: 640rem;
			line-height: 25rem;
		}
		.author-dt {
			padding: 15rem 25rem;
			width: 160rem;
		}
		.author-dd {
			padding: 15rem 0 15rem 25rem;
			width: calc(100% - 160rem);
		}
		.author-dd p:last-child {
			font-size: 14rem;
		}
	}
}

/* buy-section */
@media all {
	.buy-section .buy-bonus {
		margin-top: 1em;
		text-align: center;
	}
	.buy-section .notice-dd {text-align: justify;}
	.sending-notice {
		margin-top: .75em;
		color: var(--txt-gray);
		line-height: 1.5;
		padding-left: 1em;
	}
	button:hover {cursor: pointer;}

	/* sp */
	@media only screen and (max-width: 767px) {
		.page-main::after {
			content: '';
			display: block;
			width: 100%;
			height: 120rem;
		}
		.buy-section {
			/* margin-bottom: 140rem; */
			padding-top: 10rem;
			padding-bottom: 60rem;
			background: linear-gradient(to bottom, transparent 205rem, var(--bg-lightblue) 205rem);
		}
		.buy-section .buy-bonus {font-size: 12rem;}
		.buy-section .textbook-content-notice {margin-top: 60rem;}
		.buy-section .textbook-content-notice + .textbook-content-notice {margin-top: 0;}
		.sending-notice {
			position: relative;
			font-size: 12rem;
		}
		.sending-notice::before {
			content: '※';
			position: absolute;
			left: 0;
			width: 1em;
			height: 1em;
		}
	}

	/* pc & tab */
	@media print,
	(min-width: 768px) {
		.buy-section {
			padding: 125rem 0 50rem;
			background: linear-gradient(to bottom, transparent 205rem, var(--bg-lightblue) 205rem);
		}
		.buy-section .textbook-content {
			margin: 0 auto;
			width: 755rem;
		}
		.buy-section .textbook-content-img {width: 220rem;}

		.buy-section .textbook-content-text {transform: translateY(24rem);}
		.buy-section .buy-form .button {
			height: 60rem;
			font-size: 18rem;
		}
		.buy-section .buy-bonus {font-size: 12rem;}

		.buy-section .textbook-content-notice {width: 50%;}
		.buy-section .textbook-content-notice:first-child {
			padding-left: 30rem;
			padding-right: 50rem;
		}
		.buy-section .textbook-content-notice:nth-child(2) {
			padding-right: 30rem;
			padding-left: 50rem;
		}

		.sending-notice {
			font-size: 12rem;
			text-align: center;
		}

		.site-footer {margin-top: 60rem;}

	}
}







/* template-section */
@media all {

	/* sp */
	@media only screen and (max-width: 767px) {}

	/* pc & tab */
	@media print,
	(min-width: 768px) {}
}