@charset "UTF-8";

/* common */
:root {
		--font-sans-serif: "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
		--font-serif: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
		--font-color: #1F2667;
		--link-font-color: #fff;
		--link-bg-color: linear-gradient(50deg, #829fff, #1ebeff, #47e9d8);
		--link-font-hover: #f00;
		--link-bg-hover: linear-gradient(50deg, #fff, #1ebeff, #47e9d8);
		--em-font-bg-color: linear-gradient(rgba(254, 254, 152, 0) 40%, #ede939 40%);
}

body {
		font-family: var(--font-sans-serif);
		color: var(--font-color);
		padding: 0;
		-webkit-text-size-adjust: 100%;
}

main {
		overflow: hidden;
}


/*carousel レスポンシブ対応*/
.carousel-item {
		padding: calc(600 / 1920 * 100%) 0 0;
		height: auto;
}

.carousel-item img {
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
}

section {
		padding: 4rem 0;
}

section:nth-of-type(odd) {
		background: #fff;
}

section:nth-of-type(even) {
		background: #f5f5f5;
}

section.link-section {
		background: rgb(31 38 103 / 10%);
}

.text-justify {
		text-align: justify;
}


.line {
		background: var(--em-font-bg-color);
}

.btn {
		color: var(--link-font-color);
		background: var(--link-bg-color);
		border: 0;
		transition: background:all 0.1s ease;
}

.btn:hover {
		color: #829fff;
		background: #fff;
		border: 0;
		box-shadow: inset 0 0 0 4px #829fff, 0 0 1px rgba(0, 0, 0, 0);
		transition: all .1s ease;
}

.btn svg {
		-webkit-transform: translateZ(0);
		transform: translateZ(0);
		/* Z軸方向の移動 */
		-webkit-transition-duration: 0.1s;
		transition-duration: 0.1s;
		/* 変化が完了するまでの時間 */
		-webkit-transition-property: transform;
		transition-property: transform;
		/* 効果を適用するプロパティ */
		-webkit-transition-timing-function: ease-out;
		transition-timing-function: ease-out;
		vertical-align: text-bottom;
		margin-left: 10px;
}

.btn:hover svg {
		-webkit-transform: translateX(5px);
		transform: translateX(5px);
}

.fixed-banner a {
		color: var(--link-font-color);
		text-decoration: none;
		position: fixed;
		right: 1rem;
		bottom: 1rem;
		max-width: 500px;
		width: 80%;
		height: 60px;
		border-radius: 50px;
		background: var(--link-bg-color);
		display: flex;
		align-items: center;
		justify-content: center;
		box-shadow: 0 0 15px #ccc;
}

.fixed-banner img {
		height: 60px;
}

.fixed-banner p {
		margin: 0 5px;
		line-height: 1.2;
}

.fixed-banner svg {
		margin-right: 10px;
}

.fixed-banner a:hover {
		color: #829fff;
		background: #fff;
		border: 0;
		box-shadow: inset 0 0 0 4px #829fff, 0 0 1px rgba(0, 0, 0, 0);
}


/* list */
section ul {
		list-style-type: none;
		border: solid 5px #ede939;
		padding: 10px 5px;
		display: inline-block;
}
section li{
	text-indent: -1.35rem;
    padding-left: 1.35rem;
}

section li:before {
		content: "•";
		color: var(--font-color);
		margin: 0 0.5em;
}


/* 文字のグラデ */
.text_gradient {
		background: linear-gradient(-60deg, #e60012 10%, #009fe8 90%);
		color: transparent;
		-webkit-background-clip: text;
		background-clip: text;
}

.card {
		border: 2px solid rgba(0, 0, 0, .125);
		border-radius: 0;
}

footer p {
		margin: 0.5rem 0 5rem;
		font-size: 13px;
}

/* 画像2列 */
.grid02 {
		text-align: center;
}

.grid02 img {
		width: 100%;
		max-width: 650px;
}

@media (min-width: 992px) {
		.grid02 {
				display: grid;
				grid-template-columns: repeat(2, 1fr);
				margin: 20px 0;
		}

		.grid02 img {
				width: 100%;
		}
}

/* 画像3列 */
.grid03 {
		text-align: center;
}

.grid03 img {
		margin: 10px 0;
		width: 100%;
}

@media (min-width: 576px) {
		.grid03 {
				display: grid;
				grid-template-columns: repeat(2, 1fr);
				margin: 20px 0;
		}

		.grid03 img {
				width: 100%;
		}
}

@media(min-width:768px) {
		.grid03 {
				grid-template-columns: repeat(3, 1fr);
		}
}