@charset "UTF-8";

/*---------------------------------------------------------*/
/*---------------------------------------------------------*/

/*! normalize.css v3.0.2 | MIT License | git.io/normalize */
img,legend{border:0}legend,td,th{padding:0}html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,optgroup,strong{font-weight:700}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}pre,textarea{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}table{border-collapse:collapse;border-spacing:0}

/*---------------------------------------------------------*/
/*---------------------------------------------------------*/

:root {
	--base-color-blue: #41A0C3;
	--base-color-green: #228D08;
	--base-color-black: #333333;
	--base-color-navy: #135A96;
	--base-color-offwhite: #FCFCFC; 
	--base-color-gray: #707070;
	--base-color-lightgray: #bababa;
	--base-color-pink: #F25555;
	--base-line-color: #D5D5D5;
	--base-transition-time: .4s;
	--base-table-th-color: #e8f1f4;

	--debug: 1px solid red;
}

@media screen and (max-width: 1520px) {}
@media screen and (min-width: 1025px) {}
@media screen and (max-width: 1024px) {}

/*---------------------------------------------------------*/

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500&display=swap');

/*---------------------------------------------------------*/

body {
	margin: 0;
	padding: 0;
	font-size: 16px;
	font-family: 'Poppins', 'Noto Sans JP', "游ゴシック体", "Yu Gothic", "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color: #333;
	position: relative;
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
	width: 100%;
	min-height: 100vh;
	overflow-x: hidden;
	background-color: var(--base-color-offwhite);
}
*,
*::before,
*::after {box-sizing: border-box;}

h1,h2,h3,h4,h5,h6,p {margin:0;padding:0;}

p,pre,blockquote,ul,ol,dl,dt,dd,hr,form,input {
	margin:0;
	padding:0;
}

img,figure {
	display: block;
	margin:0;
	padding:0;
	border:0;
}

table {
	margin:0;
	padding:0;
	border:0;
	border-collapse:collapse;
	border-spacing:0;
	empty-cells:show;
	table-layout: fixed;
}

strong {font-weight: bold;}
li {list-style:none;}

address {font-style:normal;}

img {
	margin:0;
	padding:0;
	border:none;
	vertical-align:bottom;
}
a {-webkit-tap-highlight-color:transparent;}

a:link {color: #385898}
a:hover {text-decoration: none;}

.inlineblock {
	display: inline-block;
}
.fontsmall {
	font-size: 75% !important;
}
.fontlarge {
	font-size: 125% !important;
}
.fontbold {
	font-weight: bold;
}
.fontred {
	font-weight: bold;
	color: var(--base-color-pink);
}
.fontmarker {
	background: -webkit-linear-gradient(top, #fff 55%, #f4cc3c 56%, #f4cc3c 95%, #fff 96%);
	background: -moz-linear-gradient(top, #fff 55%, #f4cc3c 56%, #f4cc3c 95%, #fff 96%);
	background: linear-gradient(to bottom, #fff 55%, #f4cc3c 56%, #f4cc3c 95%, #fff 96%);
}
.fontmarker.scroll-in {
	background-size: 0% 100%;
	background-repeat: no-repeat;
	transition: background-size .8s;
	transition-delay: .2s;
}
.fontmarker.scroll-in.is-anime {
    background-size: 100% 100%;
}

/*---------------------------------------------------------*/
/*---------------------------------------------------------*/

header {
	/* position: fixed; */
	position: absolute;
	top: 0;
	left: 0;
	display: flex;
	align-items: center;
	width: 100%;
	height: 80px;
	padding-left: 40px;
	background-color: var(--base-color-blue);
	z-index: 9990;
	transition: .3s;
}
header h1 {
	display: flex;
	justify-content: center;
	align-items: center;
}
header.is-active {
	position: fixed;
	animation: headerInn .5s linear forwards;
}
@keyframes headerInn {
	0% {top: -100px}
	100% {top: 0;}
}
header.is-noactive {
	animation: headerOut .5s linear reverse;
}
@keyframes headerOut {
	0% {top: 0}
	100% {top: -100px;}
}

main {
	padding-top: 80px;
}

@media screen and (min-width: 1280px) {
	#navMin {display: none;}
	#sp-trigger {display: none;}

	header {
		padding: 0 20px 0 40px;
	}
	header nav {
		display: flex;
		height: 100%;
		margin-left: auto;
	}
	header nav ul:nth-child(1) {
		margin-right: .5em;
	}
	header nav ul,
	header nav li {
		display: flex;
		align-items: center;
		height: 100%;
	}
	header nav a {
		position: relative;
		display: flex;
		align-items: center;
		padding: 1em;
		line-height: 1;
		text-decoration: none;
		transition: color var(--base-transition-time), background-color var(--base-transition-time);
	}
	header nav a,
	header nav a:link {
		color: var(--base-color-offwhite);
	}
	header nav .colored li {
		margin-left: 10px;
	}
	header nav .colored a {
		padding: 1em 1.5em;
		border-radius: 5em;
	}
	a.colored--navy {
		background-color: var(--base-color-navy);
	}
	header nav ul:not(.colored) a:hover {
		color: var(--base-color-navy);
	}
	header nav ul.colored a:hover {
		background-color: var(--base-color-black);
	}
}
@media screen and (max-width: 1279px) {
	header {
		height: 60px;
		padding-left: 20px;
	}
	header h1 img {
		width: auto;
		height: 12px;
	}

	header nav {
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
		position: absolute;
		top: 0;
		right: -100%;
		width: 100%;
		height: 100vh;
		background-color: rgba(65, 160, 195, .9);
		transition: right var(--base-transition-time);
	}
	header.sp-active nav {
		right: 0;
	}
	header nav li {
		width: 280px;
		margin-top: 10px;
	}
	header nav a {
		display: block;
		padding: 1em 1.5em;
		line-height: 1;
		text-decoration: none;
		border: 1px solid var(--base-color-offwhite);
		border-radius: 5em;
		transition: color var(--base-transition-time), border-color var(--base-transition-time);
	}
	header nav a,
	header nav a:link {
		color: var(--base-color-offwhite);
	}
	header nav a:hover {
		color: var(--base-color-navy);
		border-color: var(--base-color-navy);
	}

	#navMin {
		display: flex;
		margin-left: auto;
	}
	#navMin a {
		position: relative;
		display: flex;
		align-items: center;
		margin-right: 5px;
		padding: 1.2em 1.5em;
		font-size: 12px;
		color: var(--base-color-offwhite);
		line-height: 1;
		text-decoration: none;
		border-radius: 5em;
		background-color: var(--base-color-navy);
		transition: color var(--base-transition-time), background-color var(--base-transition-time);
	}

	#sp-trigger {
		position: relative;
		display: block;
		width: 60px;
		height: 60px;
		background-color: var(--base-color-black);
		cursor: pointer;
	}
	#sp-trigger::before, #sp-trigger::after, #sp-trigger span {
		position: absolute;
		display: block;
		left: 18px;
		content: "";
		width: 24px;
		height: 2px;
		background-color: var(--base-color-offwhite);
	}
	#sp-trigger::before {
		top: 22px;
	}
	#sp-trigger span {
		top: 36px;
	}
	#sp-trigger::after {
		top: 29px;
	}
	#sp-trigger::before, #sp-trigger::after, #sp-trigger span {
		-webkit-transition-duration: 0.3s;
		-webkit-transition-property: transform, top, bottom, left, opacity;
		-webkit-transition-timing-function: ease;

		transition-duration: 0.3s;
		transition-property: transform, top, bottom, left, opacity;
		transition-timing-function: ease;
	}
	.sp-active #sp-trigger::before, .sb-active #sp-trigger::after {
		top: 29px;
	}
	.sp-active #sp-trigger span {
		opacity: 0;
	}
	.sp-active #sp-trigger::before {
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}
	.sp-active #sp-trigger::after {
		-webkit-transform: rotate(-45deg);
		transform: rotate(-45deg);
	}
	.sp-active header nav {
		right: 0;
	}

	main {
		padding-top: 60px;
	}
}

section {
	width: calc( 100vw - 16% );
	min-width: 280px;
	max-width: 1280px;
	margin: 80px auto;
}

@media screen and (max-width: 1024px) {
	section {
		margin: 60px auto;
	}
}

footer {
	display: flex;
	align-items: center;
	position: sticky;
	top: 100vh;
	left: 0;
	width: 100%;
	padding: 20px 40px;
	color: var(--base-color-offwhite);
	background-color: var(--base-color-black);
}

footer ul {
	display: flex;
}
footer ul a {
	margin-right: 1.5em;
	font-size: 14px;
	line-height: 1;
	color: var(--base-color-offwhite);
	text-decoration: none;
}
footer ul a:link {
	color: var(--base-color-offwhite);
	transition: color var(--base-transition-time);
}
footer ul a:hover {
	color: var(--base-color-blue);
}

address {
	margin-left: auto;
	font-size: 14px;
	line-height: 1;
	letter-spacing: 1px;
}

@media screen and (max-width: 1024px) {
	footer {
		justify-content: center;
		flex-direction: column;
		padding: 20px;
	}
	footer ul a {
		margin: 0 1.0em;
		font-size: 12px;
	}
	address {
		margin: 10px auto 0 auto;
		font-size: 10px;
	}
}

/*---------------------------------------------------------*/
/*---------------------------------------------------------*/

.titleset {
	margin-bottom: 40px;
}
#index .titleset {
	margin-bottom: 20px;
}

.titleset em {
	display: block;
	padding: .2em 0 .2em 10px;
	font-style: normal;
	font-size: 14px;
	line-height: 1;
	color: var(--base-color-blue);
	letter-spacing: 1px;
	border-left: 4px solid var(--base-color-blue);
}
.titleset h2 {
	padding: .3em 0 .2em 10px;
	font-size: 28px;
	line-height: 1;
	border-left: 4px solid var(--base-line-color);
}

@media screen and (max-width: 1520px) {
	.titleset em {
		font-size: calc(10px + 4 * (100vw - 300px) / 1220);
	}
	.titleset h2 {
		font-size: calc(18px + 10 * (100vw - 300px) / 1220);
	}
}

/*---------------------------------------------------------*/

.pager {
	display: flex;
	justify-content: center;
	width: calc( 100vw - 16% );
	min-width: 280px;
	max-width: 1280px;
	margin: 80px auto;
}
.pager li > * {
	display: flex;
	justify-content: center;
	align-items: center;
	min-width: 44px;
	height: 44px;
	margin: 0 3px;
	padding: 0.2em .8em;
	color: var(--base-color-navy);
	line-height: 1;
	text-decoration: none;
	border: 1px solid var(--base-color-navy);
	border-radius: 8px;
	transition: background-color var(--base-transition-time);
}
.pager li > *.arrow-to-left,
.pager li > *.arrow-to-right {
	width: 44px;
	padding: 0.2em;
}
.pager li > span {
	border: none;
}
.pager li svg {
	fill: var(--base-color-navy);
}
.pager li a.current,
.pager li a:hover {
	color: var(--base-color-offwhite);
	background-color: var(--base-color-navy);
}
.pager li a:hover svg {
	fill: var(--base-color-offwhite);
}

/*---------------------------------------------------------*/

.keywordNav {
	display: flex;
	flex-wrap: wrap;
	margin: -5px 0 0 -5px;
}
.titleset + .keywordNav {
	margin-bottom: 40px;
}
section .keywordNav:last-child {
	margin-top: 35px;
}

.keywordNav li {
	margin: 5px 0 0 5px;
}
.keywordNav li a {
	position: relative;
	display: inline-block;
	padding: .6em 1.0em .6em 2.0em;
	line-height: 1;
	color: var(--base-color-navy);
	background-color: #fff;
	border: 1px solid var(--base-color-navy);
	border-radius: 5em;
	text-decoration: none;
	transition: color var(--base-transition-time), background-color var(--base-transition-time);
}
.keywordNav li a::before {
	display: flex;
	align-items: center;
	position: absolute;
	content: '#';
	top: 0;
	bottom: 0;
	left: 1.0em;
	margin: auto;
	line-height: 1;
}
.keywordNav li a:hover,
.keywordNav li.current a {
	color: var(--base-color-offwhite);
	background-color: var(--base-color-navy);
}

@media screen and (max-width: 1024px) {
	.keywordNav li a {
		font-size: 12px;
	}
}

/*---------------------------------------------------------*/

.cvrbtns {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
	gap: 40px;
	width: calc( 100vw - 16% );
	max-width: 1280px;
	margin: 80px auto;
}
.cvrbtns a {
	position: relative;
	display: block;
	padding: 30px 40px;
	border-radius: 16px;
	color: var(--base-color-offwhite);
	text-decoration: none;
	transition: background-color var(--base-transition-time);
}
.cvrbtns a span {
	display: inline-block;
	margin-bottom: .8em;
	line-height: 1;
	letter-spacing: 1px;
}
.cvrbtns a p {
	font-weight: bold;
	font-size: 28px;
	line-height: 1;
}
.cvrbtns a .arrow-to-right {
	position: absolute;
	bottom: 26px;
	right: 32px;
	fill: var(--base-color-offwhite);
	transition: right var(--base-transition-time);
}
.cvrbtns a .arrow-to-right svg {
	width: 36px;
	height: auto;
}

.cvrbtns a.cvrbtns--advertiser {
	border: 4px solid var(--base-color-green);
	background-color: var(--base-color-green);
}
.cvrbtns a.cvrbtns--media {
	border: 4px solid var(--base-color-navy);
	background-color: var(--base-color-navy);
}

.cvrbtns a:hover {
	background-color: var(--base-color-offwhite);
}
.cvrbtns a:hover .arrow-to-right {
	right: -28px;
}
.cvrbtns a.cvrbtns--advertiser:hover {
	color: var(--base-color-green);
}
.cvrbtns a.cvrbtns--advertiser:hover .arrow-to-right {
	fill: var(--base-color-green);
}
.cvrbtns a.cvrbtns--media:hover {
	color: var(--base-color-navy);
}
.cvrbtns a.cvrbtns--media:hover .arrow-to-right {
	fill: var(--base-color-navy);
}

@media screen and (max-width: 1520px) {
	.cvrbtns a span {
		font-size: calc(10px + 6 * (100vw - 300px) / 1220);
	}
	.cvrbtns a p {
		font-size: calc(18px + 10 * (100vw - 300px) / 1220);
	}
}
@media screen and (max-width: 1024px) {
	.cvrbtns {
		gap: 20px;
		margin: 60px auto;
	}
	.cvrbtns a {
		padding: 12px 20px;
		border-radius: 12px;
	}
	.cvrbtns a .arrow-to-right {
		bottom: 10px;
		right: 20px;
	}
	.cvrbtns a .arrow-to-right svg {
		width: 24px;
		height: auto;
	}
	.cvrbtns a:hover .arrow-to-right {
		right: -20px;
	}
}

/*---------------------------------------------------------*/
/* index */
/*---------------------------------------------------------*/

#fv {
	position: relative;
	width: 100%;
	background-color: #F9F9F9;
	overflow: hidden;
}

@keyframes infinity-scroll-left {
	from {
		transform: translateX(0);
	}
	to {
		transform: translateX(-100%);
	}
}
@keyframes infinity-scroll-right {
	from {
		transform: translateX(-100%);
	}
	to {
		transform: translateX(0%);
	}
}
.fv-bk-list {
	position: absolute;
	display: flex;
	width: 3200px;
}
.fv-bk-list--left {
	bottom: 0;
	left: 0;
	animation :infinity-scroll-left 95s infinite linear 0.5s both;
}
.fv-bk-list--right {
	top: 0;
	right: 0;
	animation :infinity-scroll-right 95s infinite linear 0.5s both;
}

#fv-main {
	position: relative;
	display: flex;
	align-items: center;
	width: calc( 100vw - 16% );
	max-width: 1040px;
	margin: 0 auto;
	padding: 80px 0;
	z-index: 999;
}

#fv-main-catch em {
	position: relative;
	display: inline-block;
	padding: 0 1.2em 1em 1.2em;
	font-weight: normal;
	font-size: 14px;
	font-style: normal;
	line-height: 1;
	color: var(--base-color-gray);
	letter-spacing: 1px;
}
#fv-main-catch em::before,
#fv-main-catch em::after {
	position: absolute;
	content: '';
	bottom: 0;
	left: 0;
	width: 100%;
	height: 4px;
}
#fv-main-catch em::before {
	width: 2.4em;
	background-color: var(--base-color-blue);
	z-index: -1;
}
#fv-main-catch em::after {
	background-color: var(--base-line-color);
	z-index: -2;
}

#fv-main-catch h2 {
	margin: .5em 0;
	font-size: 48px;
	line-height: 1.2;
}
#fv-main-catch a {
	display: inline-block;
	position: relative;
	padding: 1em 3.6em 1em 1.6em;
	font-size: 18px;
	line-height: 1;
	color: var(--base-color-offwhite);
	text-decoration: none;
	border-radius: 5em;
	background-color: var(--base-color-green);
	border: 2px solid var(--base-color-green);
	transition: background-color var(--base-transition-time);
}
#fv-main-catch a .arrow-to-right {
	display: flex;
	align-items: center;
	position: absolute;
	top: 0;
	bottom: 0;
	right: 1.2em;
	margin: auto;
	fill: var(--base-color-offwhite);
	transition: right var(--base-transition-time);
}
#fv-main-catch a:hover {
	color: var(--base-color-green);
	background-color: var(--base-color-offwhite);
}
#fv-main-catch a:hover .arrow-to-right {
	right: -1.0em;
	fill: var(--base-color-green);
}

#fv-main-img {
	display: flex;
	align-items: center;
	margin-left: auto;
}

@media screen and (max-width: 1280px) {
	#fv-main-catch em {
		font-size: calc(10px + 4 * (100vw - 300px) / 980);
	}
	#fv-main-catch h2 {
		font-size: calc(18px + 30 * (100vw - 300px) / 980);
	}
	#fv-main-catch a {
		font-size: calc(14px + 4 * (100vw - 300px) / 980);
	}
}
@media screen and (max-width: 1200px) {
	#fv-main-catch a {
		padding: 1em 1.8em;
	}
	#fv-main-catch a .arrow-to-right {
		display: none;
	}
	#fv-main-img {
		position: absolute;
		top: 0;
		bottom: 0;
		margin: auto;
		left: 62%;
		z-index: -1;
	}
	#fv-main-img img {
		width: auto;
		height: 70%;
	}
}

/*---------------------------------------------------------*/

#index .arrivals {
	background-color: #fff;
	border: 1px solid var(--base-line-color);
}

#index .arrivals dl {
	display: flex;
	padding: 1.2em 1.2em;
}
#index .arrivals dl + dl {
	border-top: 1px dotted var(--base-line-color);
}
#index .arrivals dt {
	display: flex;
	width: 10.5em;
	line-height: 1.2;
}
#index .arrivals dd {
	width: calc( 100% - 10.5em);
	line-height: 1.2;
	word-break:break-all;
	word-wrap:break-word;
	overflow-wrap: break-word;
}
#index .arrivals dt strong {
	display: block;
	padding: 0 1em;
	font-weight: normal;
	color: var(--base-color-pink);
	text-align: center;
}

@media screen and (max-width: 1024px) {
	#index .arrivals dl {
		flex-direction: column;
		font-size: 14px;
	}
	#index .arrivals dd {
		width: 100%;
		padding-top: 1em;
	}
}

/*---------------------------------------------------------*/

#index .features {
	display: flex;
	flex-wrap: wrap;
	margin: -40px 0 0 -40px;
}
#index .features > * {
	flex-grow: 1;
	width: calc( 33.33% - 40px );
	min-width: 280px;
	margin: 40px 0 0 40px;
	padding: 40px 20px 30px 20px;
	border: 1px solid var(--base-line-color);
	background-color: #fff;
}
#index .features > * img {
	width: 80%;
	max-width: 220px;
	height: auto;
	margin: 0 auto;
}
#index .features > * em {
	display: block;
	margin-top: 30px;
	font-size: 12px;
	line-height: 1;
	color: var(--base-color-blue);
	font-style: normal;
	text-align: center;
}
#index .features > * h3 {
	margin: .8em 0;
	font-size: 18px;
	line-height: 1.6;
	text-align: center;
}
#index .features > * p {
	line-height: 1.6;
	text-align: center;
}

/*---------------------------------------------------------*/

#index .advantages {
	display: flex;
	flex-wrap: wrap;
	margin: -40px 0 0 -40px;
}
#index .advantages > * {
	flex-grow: 1;
	width: calc( 25% - 40px );
	min-width: 280px;
	margin: 40px 0 0 40px;
	padding: 40px 20px 20px 20px;
	border: 1px solid var(--base-line-color);
	background-color: #fff;
}
#index .advantages > * img {
	width: 60%;
	max-width: 120px;
	height: auto;
	margin: 0 auto;
}
#index .advantages > * em {
	display: block;
	margin-top: 30px;
	font-size: 12px;
	line-height: 1;
	color: var(--base-color-blue);
	font-style: normal;
	text-align: center;
}
#index .advantages > * h3 {
	margin: .8em 0;
	font-size: 18px;
	line-height: 1.6;
	text-align: center;
}
#index .advantages > * p {
	line-height: 1.6;
	text-align: center;
}

/*---------------------------------------------------------*/

#index .performance {
	padding: 50px;
	border: 1px solid var(--base-line-color);
	background-color: #fff;
}
/* 2025/11/12 */
#index .performance_inner {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	margin: -80px 0 0 -80px;
}
#index .performance img {
	width: 100%;
	height: auto;
	max-width: 500px;
	margin: 80px 0 0 80px;
}
@media screen and (max-width: 1024px) {
	#index .performance_inner {
		margin: -40px 0 0 -40px;
	}
	#index .performance img {
		margin: 40px 0 0 40px;
	}
}
/* #index .performance img {
	width: 100%;
	max-width: 520px;
	height: auto;
	margin: 0 auto;
} */

/*---------------------------------------------------------*/
/* price.html */
/*---------------------------------------------------------*/

#price .price {
	display: flex;
	flex-wrap: wrap;
	margin: -40px 0 0 -40px;
}
#price .price > * {
	flex-grow: 1;
	width: calc( 50% - 40px );
	min-width: 280px;
	margin: 40px 0 0 40px;
	padding: 40px 20px 20px 20px;
	border: 1px solid var(--base-line-color);
	background-color: #fff;
}
#price .price > * img {
	width: 80%;
	max-width: 220px;
	height: auto;
	margin: 0 auto;
}
#price .price > * h3 {
	margin: .8em 0;
	font-size: 32px;
	line-height: 1.6;
	text-align: center;
}

@media screen and (max-width: 1520px) {
	#price .price > * h3 {
		font-size: calc(16px + 16 * (100vw - 300px) / 1220);
	}
}

/*---------------------------------------------------------*/
/* /document/index.html */
/*---------------------------------------------------------*/

#documentsIndex .lists {
	margin-top: 40px;
}

#documentsIndex .lists-item-btn {
	display: flex;
	justify-content: flex-end;
	align-items: flex-end;
	margin-top: 20px;
}
#documentsIndex .lists-item-btn a {
	display: inline-block;
	position: relative;
	padding: .8em 3.4em .8em 1.6em;
	line-height: 1;
	color: var(--base-color-offwhite);
	text-decoration: none;
	border-radius: 5em;
	background-color: var(--base-color-green);
	border: 2px solid var(--base-color-green);
	transition: background-color var(--base-transition-time);
}
#documentsIndex .lists-item-btn a .arrow-to-right {
	display: flex;
	align-items: center;
	position: absolute;
	top: 0;
	bottom: 0;
	right: 1.0em;
	margin: auto;
	fill: var(--base-color-offwhite);
	transition: right var(--base-transition-time);
}
#documentsIndex .lists-item-btn a:hover {
	color: var(--base-color-green);
	background-color: var(--base-color-offwhite);
}
#documentsIndex .lists-item-btn a:hover .arrow-to-right {
	right: -1.2em;
	fill: var(--base-color-green);
}

@media screen and (max-width: 1024px) {
	#documentsIndex .lists-item-btn a {
		font-size: 14px;
	}
}

/*---------------------------------------------------------*/

@media screen and (min-width: 1025px) {
	#documentsIndex .lists--horizon .lists-item {
		position: relative;
		display: grid;
		grid-template-columns: 1fr 40%;
		grid-template-areas: "main  thm" "main  btn";
		column-gap: 60px;
		padding: 60px;
		border: 1px solid var(--base-line-color);
		background-color: #fff;
	}
	#documentsIndex .lists--horizon .lists-item + .lists-item {
		margin-top: 40px;
	}
	
	#documentsIndex .lists--horizon .lists-item-new:not(:empty) {
		position: absolute;
		top: 10px;
		left: -5px;
		padding: .5em .8em;
		font-size: 12px;
		line-height: 1;
		color: var(--base-color-offwhite);
		background-color: var(--base-color-pink);
	}

	#documentsIndex .lists--horizon .lists-item-main {
		grid-area: main;
	}
	#documentsIndex .lists--horizon .lists-item-main h3 {
		position: relative;
		margin-bottom: .6em;
		font-size: 24px;
		line-height: 1.2;
	}
	#documentsIndex .lists--horizon .lists-item-main h3::after {
		position: absolute;
		content: '';
		top: .5em;
		left: -60px;
		width: calc( 60px - .5em );
		height: 1px;
		background-color: var(--base-line-color);
	}

	#documentsIndex .lists--horizon .lists-item-main-txt-date {
		position: relative;
		margin-bottom: 20px;
		font-size: 12px;
		color: var(--base-color-lightgray);
		line-height: 1;
		text-align: right;
	}
	#documentsIndex .lists--horizon .lists-item-main-txt-date::before {
		position: absolute;
		content: '';
		top: .5em;
		left: 0;
		width: calc( 100% - 6.5em );
		height: 0;
		border-top: 1px dotted var(--base-line-color);
	}
	#documentsIndex .lists--horizon .lists-item-main-txt > * {
		margin-top: 1.0em;
	}
	#documentsIndex .lists--horizon .lists-item-main li {
		position: relative;
		padding-left: 1em;
		line-height: 1.4;
	}
	#documentsIndex .lists--horizon .lists-item-main li + li {
		margin-top: .5em;
	}
	#documentsIndex .lists--horizon .lists-item-main li::before {
		position: absolute;
		content: '・';
		top: 0;
		left: 0;
	}
	#documentsIndex .lists--horizon .lists-item-main p {
		line-height: 1.8;
	}
	
	#documentsIndex .lists--horizon .lists-item-thm {
		grid-area: thm;
	}
	#documentsIndex .lists--horizon .lists-item-thm img {
		width: 100%;
		height: auto;
	}
}

@media screen and (max-width: 1024px) {
	#documentsIndex .lists--horizon {
		display: grid;
		grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
		gap: 40px;
	}
	#documentsIndex .lists--horizon .lists-item {
		position: relative;
		display: flex;
		flex-direction: column;
		border: 1px solid var(--base-line-color);
		background-color: #fff;
	}
	
	#documentsIndex .lists--horizon .lists-item-new:not(:empty) {
		display: flex;
		justify-content: center;
		align-items: center;
		position: absolute;
		top: 0;
		left: 0;
		width: 4em;
		height: 4em;
		padding: .5em;
		font-size: 12px;
		line-height: 1;
		color: var(--base-color-offwhite);
		background-color: var(--base-color-pink);
	}
	
	#documentsIndex .lists--horizon .lists-item-main {
		order: 2;
		flex-grow: 1;
		margin: 1em 20px 0 20px;
	}
	#documentsIndex .lists--horizon .lists-item-main-txt-date {
		margin-top: .5em;
		font-size: 12px;
		color: var(--base-color-lightgray);
		line-height: 1;
	}
	#documentsIndex .lists--horizon .lists-item-main-txt {
		display: none;
	}
	#documentsIndex .lists--horizon .lists-item-thm {
		order: 1;
	}
	#documentsIndex .lists--horizon .lists-item-thm img {
		width: 100%;
		height: auto;
	}
	#documentsIndex .lists--horizon .lists-item-main h3 {
		font-size: 18px;
		line-height: 1.4;
	}
	#documentsIndex .lists--horizon .lists-item-btn {
		order: 3;
		margin: 0 20px 20px 20px;
	}
}

@media screen and (max-width: 1520px) {
	#documentsIndex .lists--horizon .lists-item-main h3 {
		font-size: calc(16px + 8 * (100vw - 300px) / 1220);
	}
	#documentsIndex .lists--horizon .lists-item-main-txt > * {
		font-size: calc(14px + 2 * (100vw - 300px) / 1220);
	}
}

/*---------------------------------------------------------*/

#documentsIndex .lists--column {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
	gap: 40px;
}
#documentsIndex .lists--column .lists-item {
	position: relative;
	display: flex;
	flex-direction: column;
	border: 1px solid var(--base-line-color);
	background-color: #fff;
}

#documentsIndex .lists--column .lists-item-new:not(:empty) {
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	top: 0;
	left: 0;
	width: 4em;
	height: 4em;
	padding: .5em;
	font-size: 12px;
	line-height: 1;
	color: var(--base-color-offwhite);
	background-color: var(--base-color-pink);
}

#documentsIndex .lists--column .lists-item-main {
	order: 2;
	flex-grow: 1;
	margin: 1em 20px 0 20px;
}
#documentsIndex .lists--column .lists-item-main-txt-date {
	margin-top: .5em;
	font-size: 12px;
	color: var(--base-color-lightgray);
	line-height: 1;
}
#documentsIndex .lists--column .lists-item-main-txt {
	display: none;
}
#documentsIndex .lists--column .lists-item-thm {
	order: 1;
}
#documentsIndex .lists--column .lists-item-thm img {
	width: 100%;
	height: auto;
}
#documentsIndex .lists--column .lists-item-main h3 {
	font-size: 18px;
	line-height: 1.4;
}
#documentsIndex .lists--column .lists-item-btn {
	order: 3;
	margin: 0 20px 20px 20px;
}

/*---------------------------------------------------------*/
/* documentDetail.html */
/*---------------------------------------------------------*/

#documentDetail .document-main h3 {
	font-size: 24px;
}

@media screen and (max-width: 1520px) {
	#documentDetail .document-main h3 {
		font-size: calc(16px + 8 * (100vw - 300px) / 1220);
	}
}

#documentDetail .document-wrap {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 40px;
}
#documentDetail .document-wrap > div {
	border: 1px solid var(--base-line-color);
	background-color: #fff;
}

#documentDetail .document-main {
	padding: 60px;
}

#documentDetail .document-main h3 {
	position: relative;
	margin-bottom: .6em;
	line-height: 1.2;
}
#documentDetail .document-main h3::after {
	position: absolute;
	content: '';
	top: .5em;
	left: -60px;
	width: calc( 60px - .5em );
	height: 1px;
	background-color: var(--base-line-color);
}

#documentDetail .document-main img {
	width: auto;
	max-width: 100%;
	height: auto;
	margin: 30px auto;
}

#documentDetail .document-main-txt > * {
	margin-top: 1.0em;
}
#documentDetail .document-main li {
	position: relative;
	padding-left: 1em;
	line-height: 1.4;
}
#documentDetail .document-main li + li {
	margin-top: .5em;
}
#documentDetail .document-main li::before {
	position: absolute;
	content: '・';
	top: 0;
	left: 0;
}
#documentDetail .document-main p {
	line-height: 1.8;
}

@media screen and (max-width: 1280px) {
	#documentDetail .document-wrap {
		grid-template-columns: 1fr;
		gap: 20px;
	}
	#documentDetail .document-main {
		padding: 40px;
	}
	#documentDetail .document-main h3::after {
		left: -40px;
		width: calc( 40px - .5em );
	}

}

/*---------------------------------------------------------*/
/* documentDetail.html form */
/*---------------------------------------------------------*/

.document-form {
	padding-top: 10px;
}
.document-form dt {
	display: flex;
	align-items: center;
	padding: 20px 30px 10px 30px;
	line-height: 1;
}
.document-form--confirm dt {
	padding-bottom: 16px;
	font-size: 12px;
	color: var(--base-color-gray);
}
.document-form dd {
	padding: 0 30px 20px 30px;
	border-bottom: 1px dotted var(--base-line-color);
	word-break:break-all;
	word-wrap:break-word;
	overflow-wrap: break-word;
}

.document-form .tag {
	display: block;
	width: 4em;
	margin-right: 8px;
	padding: .4em .6em;
	font-size: 10px;
	line-height: 1;
	color: var(--base-color-offwhite);
	border-radius: 5em;
	text-align: center;
}
.document-form .tag--free {
	background-color: var(--base-color-green);
}
.document-form .tag--required {
	background-color: var(--base-color-pink);
}

.document-form .error {
	position: relative;
}
.document-form .error span:not(:empty) {
	position: absolute;
	bottom: 8px;
	left: 0;
	display: block;
	width: 100%;
	padding: .6em 1em;
	font-size: 12px;
	line-height: 1.2;
	color: var(--base-color-offwhite);
	background-color: var(--base-color-pink);
	box-shadow: 0 0 8px rgba(0, 0, 0, .2);
}
.document-form .error span:not(:empty):after {
	position: absolute;
	content: '';
	bottom: -8px;
	left: 15px;
	width: 0;
	height: 0;
	border-top: 10px solid var(--base-color-pink);
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
}

.document-form .note {
	margin: 10px 0;
	font-size: 80%;
	line-height: 1.2;
}
.document-form dd .note:last-child {
	margin-bottom: 0;
}
.document-form dl + .note,
.document-form input[type="hidden"] + .note,
.document-form .submitset + .note {
	margin-top: 30px;
	padding: 0 20px;
	text-align: center;
}

.document-form .form--column {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 10px;
}

@media screen and (max-width: 1280px) {
	.document-form {
		padding-top: 0;
	}
	.document-form dt {
		padding: 20px 20px 10px 20px;
	}
	.document-form dd {
		padding: 0 20px 20px 20px;
	}
}

/*---------------------------------------------------------*/

input,
textarea,
select {
	-webkit-appearance: none;
	appearance: none;
	border: none;
	outline: none;
}

input[type="text"],
textarea {
	display: block;
	width: 100%;
	min-height: 40px;
	padding: 0 .8em;
	background-color: #fff;
	border-radius: 8px;
	border: 1px solid var(--base-line-color);
	outline: none;
	transition: var(--base-transition-time)
}
textarea {
	width: 100%;
	min-height: 40px;
	padding: 0.8em .8em;
	line-height: 1.6;
	background-color: #fff;
	border-radius: 8px;
	border: 1px solid var(--base-line-color);
	outline: none;
	transition: var(--base-transition-time);
}

select {
	width: 100%;
	height: 40px;
	padding: 0 36px 0 .8em;
	line-height: 1.2;
	background-color: #fff;
	border-radius: 8px;
	border: 1px solid var(--base-line-color);
	outline: none;
	transition: var(--base-transition-time);
	background: url(../img/form-arrow.svg) right 12px center no-repeat;
	background-size: 12px 12px;
}

::-webkit-input-placeholder {color:#bebebe}

input[type="text"]:focus,
textarea:focus,
select:focus {
	border-color: #187CE0;
	box-shadow: 0 0 10px rgba(0, 0, 0, .2);
}
input[type="text"].error,
textarea.error,
select.error {
	border-color: var(--base-color-pink);
}

/*---------------------------------------------------------*/

dd > input + *:not(.note),
dd > textarea + *:not(.note),
dd > select + *:not(.note),
dd > .radioset + *:not(.note) {
	margin-top: 10px;
}

/*---------------------------------------------------------*/

input[type='radio'],
input[type='checkbox'] {
	width: 0;
	height: 0;
}
.radioset {
	display: flex;
	align-items: center;
}
.radioset label {
	display: flex;
	align-items: center;
	position: relative;
	min-height: 40px;
	padding-left: 46px;
	font-size: 15px;
	line-height: 1.2;
	cursor: pointer;
}
.radioset label input {
	position: absolute;
	opacity: 0;
}
.radioset label::before {
	position:absolute;
	top: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	content: "";
	width: 40px;
	height: 40px;
	background-color: #fff;
	border: 1px solid var(--base-line-color);
	transition: .3s;
}
.radioset input[type='radio'] + label::before {
	border-radius: 50%;
}
.radioset input[type='checkbox'] + label::before {
	border-radius: 8px;
}
.radioset input[type='radio'] + label::after {
	position:absolute;
	top: 0;
	bottom: 0;
	left: calc((40px - 18px)/2);
	margin: auto;
	content: '';
	width: 18px;
	height: 18px;
	border: 3px solid #E8E8E8;
	background-color: #E8E8E8;
	border-radius: 50%;
}
.radioset input[type='checkbox'] + label::after {
	position:absolute;
	top: 11px;
	left: 11px;
	content: '';
	width: 18px;
	height: 12px;
	border-left: 4px solid #E8E8E8;
	border-bottom: 4px solid #E8E8E8;
	transform: rotate(-45deg);
}
.radioset input[type='radio']:checked + label::before,
.radioset input[type='checkbox']:checked + label::before {
	background-color: #187CE0;
	border-color: #187CE0;
	box-shadow: 0 0 10px #187CE0;
}
.radioset input[type='radio']:checked + label::after {
	background-color: var(--base-color-offwhite);
	border-color: var(--base-color-offwhite);
}
.radioset input[type='checkbox']:checked + label::after {
	border-color: var(--base-color-offwhite);
}
.radioset label:hover::before {
	box-shadow: 0 0 10px rgba(0, 0, 0, .2);
}

/*---------------------------------------------------------*/

.submitset {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	margin: 10px auto 30px auto;
	padding: 0 20px;
}
.submitset > * {
	width: calc( 50% - 40px );
	min-width: 240px;
	max-width: 320px;
	margin: 20px 10px 0 10px;
}
.submitset > * > * {
	-webkit-appearance: none;
	appearance: none;
	border: none;
	outline: none;
	
	display: flex;
	justify-content: center;
	width: 100%;
	padding: 1.2em 2.0em;
	font-size: 18px;
	line-height: 1;
	text-decoration: none;
	border-radius: 5em;
	color: var(--base-color-offwhite);
	background-color: var(--base-color-green);
	border: 2px solid var(--base-color-green);
	transition: border-color var(--base-transition-time), var(--base-transition-time), box-shadow var(--base-transition-time);
	cursor: pointer;
}
.submitset > * > *:hover {
	border-color: var(--base-color-navy);
	background-color: var(--base-color-navy);
	box-shadow: 0 0 10px rgba(0, 0, 0, .4);
}

.submitset > *.rewrite > * {
	color: var(--base-color-black);
	background-color: var(--base-color-offwhite);
	border-color: var(--base-color-gray);
}

/*---------------------------------------------------------*/
/*---------------------------------------------------------*/

.documentThx {
	padding: 80px;
	background-color: #fff;
	border: 1px solid var(--base-line-color);
}

.documentThx > *:not(:nth-child(1)):not(:last-child) {
	margin: 40px 0;
}

.documentThx h3 {
	position: relative;
	padding: .4em 0 .4em 14px;
	font-size: 24px;
	line-height: 1;
	border-left: 4px solid var(--base-color-lightgray);
}
.documentThx h3::after {
	position: absolute;
	content: '';
	top: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	width: 8px;
	height: 1px;
	background-color: var(--base-color-lightgray);
}

.documentThx dl {
	display: inline-flex;
	line-height: 1;
	border: 2px solid var(--base-color-navy);
	border-radius: 8px;
}
.documentThx dt {
	display: flex;
	align-items: center;
	padding: .8em 1.2em;
	color: var(--base-color-offwhite);
	background-color: var(--base-color-navy);
}
.documentThx dd {
	display: flex;
	align-items: center;
	padding: .8em 1.2em;
	font-size: 20px;
}
.documentThx p {
	font-size: 18px;
	line-height: 1.8;
}
a.documentThx-btn {
	display: inline-block;
	position: relative;
	padding: 1.2em 3.4em 1.2em 1.6em;
	font-size: 20px;
	line-height: 1;
	color: var(--base-color-offwhite);
	text-decoration: none;
	border-radius: 5em;
	background-color: var(--base-color-green);
	transition: background-color var(--base-transition-time);
}
.documentThx-btn .icon-download {
	display: flex;
	align-items: center;
	position: absolute;
	top: 0;
	bottom: 0;
	right: 1.4em;
	fill: var(--base-color-offwhite);
}
a.documentThx-btn:hover {
	background-color: var(--base-color-navy);
}

@media screen and (max-width: 1520px) {
	.documentThx h3 {
		font-size: calc(16px + 8 * (100vw - 300px) / 1220);
	}
	.documentThx dt {
		font-size: calc(14px + 2 * (100vw - 300px) / 1220);
	}
	.documentThx dd {
		font-size: calc(16px + 4 * (100vw - 300px) / 1220);
	}
	.documentThx p {
		font-size: calc(14px + 4 * (100vw - 300px) / 1220);
	}
	.documentThx-btn {
		font-size: calc(16px + 4 * (100vw - 300px) / 1220);
	}
}

@media screen and (max-width: 1024px) {
	.documentThx {
		padding: 20px;
	}
	.documentThx > *:not(:nth-child(1)):not(:last-child) {
		margin: 20px 0;
	}
	.documentThx dl {
		flex-direction: column;
		width: 100%;
		max-width: 280px;
	}
}

/*---------------------------------------------------------*/
/*---------------------------------------------------------*/