@charset "UTF-8";

/* RESET
--------------------------------------------------------------------------------------------- */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
button {
	border: none;
	background: initial;
	box-sizing: border-box;
}

/* common
--------------------------------------------------------------------------------------------- */
body {
	margin: 0;
	padding: 0;
	font-family: Meiryo, "メイリオ", "Hiragino Kaku Gothic ProN", Verdana, Arial, Helvetica, sans-serif;
	font-size: 15px;
	line-height: 1.8em;
	letter-spacing: 0.08em;
	font-feature-settings: "palt";
	-webkit-text-size-adjust: 100%;
	-webkit-font-smoothing: antialiased;
	overflow-x: hidden;
	height: 100%;
	/*text-align: justify;*/
}
@media (max-width: 500px) {
	body {
		font-size: 15px;
		text-align: justify;
	}
}
img,
svg {
	max-width: 100%;
	height: auto;
	transition: 0.5s;
}
a, a:hover, a:hover img {
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	-o-transition: 0.5s;
	transition: 0.5s;
	text-decoration: none;
}
@media (min-width : 900px) {
	.pcno {
		display: none;
	}
}
@media (max-width: 500px) {
	.spno {
		display: none;
	}
}
@media (min-width:500px) and (max-width: 900px) {
	.tbno {
		display: none;
	}
}

/* スクロールアニメーション */
.fadeinUp {
	opacity : 0;
	transform : translate(0, 100px);
	transition : all 800ms;
}
.fadeinUp.scrollin {
	opacity : 1;
	transform : translate(0, 0);
}
/* mainimgアニメーション */
.txt1 {
    animation-name: fadeup;
    animation-duration: 1s;
	animation-fill-mode:forwards;
	opacity: 0;
}
.txt2 {
    animation-name: fadeup;
    animation-duration: 1s;
	animation-fill-mode:forwards;
	opacity: 0;
	animation-delay: 0.3s;
}
@keyframes fadeup {
	from {
		opacity: 0;
		transform: translateY(50px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}
/* ブレンドモード：除外 */
.exclusion {
	mix-blend-mode: exclusion;
}
a.anchor {
    display: block;
    padding-top: 50px;
    margin-top: -50px;
}
@media (max-width: 500px) {
	a.anchor {
		padding-top: 25px;
    	margin-top: -25px;
	}
}
.en {
	font-family: Arial, "sans-serif";
}

/* header
--------------------------------------------------------------------------------------------- */
header {
	position: relative;
	line-height: 0;
}
header .txt1 {
	position: absolute;
	top: 50px;
	right: 0;
	width: 72%;
}
header .txt2 {
	position: absolute;
	bottom: 70px;
	left: 0;
	width: 39%;
}
@media (max-width: 500px) {
	header .txt1 {
		width: 91%;
		top: 30px;
	}
	header .txt2 {
		width: 90%;
		bottom: -4%;
	}
}

/* main
--------------------------------------------------------------------------------------------- */

/* intor
-------------------- */
.cont01 {
	padding: 75px 40px 130px 40px;
	background: rgb(20,27,77);
	background: linear-gradient(90deg, rgba(20,27,77,1) 0%, rgba(93,33,63,1) 60%, rgba(175,39,47,1) 100%);
	
	margin-bottom: -35px;
}
@media (max-width: 500px) {
	.cont01 {
		padding: 50px 30px 130px 30px;
	}
}
.intro-section-wrap {
	max-width: 840px;
	margin-left: auto;
	margin-right: auto;
	display: flex;
	justify-content: space-between;
	position: relative;
	z-index: 1;
}
@media (max-width: 500px) {
	.intro-section-wrap {
		width: auto;
		display: block;
	}
}
.intro-section-wrap .box {
	width: 31%;
	display: flex;
	flex-direction: column;
}
@media (max-width: 500px) {
	.intro-section-wrap .box {
		width: auto;
		flex-direction: initial;
		justify-content: space-between;
		align-items: center;
	}
	.intro-section-wrap .box:nth-of-type(n+2) {
		margin-top: 10px;
	}
}
.intro-section-wrap .box .boxno {
	width: 45%;
	margin-left: auto;
	margin-right: auto;
	line-height: 0;
	padding-bottom: 10px;
}
@media (max-width: 500px) {
	.intro-section-wrap .box .boxno {
		width: 30%;
		padding-right: 5%;
		padding-top: 4%;
	}
}
.intro-section-wrap .box .txt {
	border: #fff solid 1.5px;
	border-radius: 8px;
	color: #fff;
	font-size: 113%;
	font-weight: bold;
	text-align: center;
	padding: 15px 0;
	flex-grow: 1;
	display: flex;
	align-items: center;
	justify-content: center;
}
@media (max-width: 900px) {
	.intro-section-wrap .box .txt {
		font-size: 105%;
	}
}
@media (max-width: 500px) {
	.intro-section-wrap .box .txt {
		width: 45%;
		font-size: 95%;
		padding: 10px 0;
		line-height: 1.3em;
	}
	.intro-section-wrap .box:nth-of-type(1) .txt,
	.intro-section-wrap .box:nth-of-type(3) .txt{
		padding: 20px 0;
	}
}
.intro-wrap {
	max-width: 1030px;
	margin-top: 70px;
	margin-left: auto;
	margin-right: auto;
	display: flex;
	justify-content: space-between;
	position: relative;
	z-index: 1;
}
.intro-wrap h3 {
	width: 23%;
	max-width: 240px;
	position: relative;
}
.intro-wrap h3::before {
	position: absolute;
	content: "";
	top: -115px;
	left: -130px;
	display: block;
	width: 480px;
	height: 325px;
	background-image: url("../images/bgimg01-pc.png");
	background-size: contain;
	background-repeat: no-repeat;
}
.intro-wrap .txt {
	width: 57%;
	padding-right: 9%;
	color: #fff;
}
.intro-wrap .txt p:nth-of-type(n+2) {
	padding-top: 30px;
}
@media (max-width: 500px) {
	.intro-wrap {
		display: block;
		margin-top: 50px;
	}
	.intro-wrap h3 {
		width: auto;
	}
	.intro-wrap h3::before {
		top: -80px;
		left: -190px;
		background-image: url("../images/bgimg01-sp.png");
	}
	.intro-wrap .txt {
		width: auto;
		padding-right: 0;
	}
}

/* profile
-------------------- */
.profile-wrap {
	max-width: 1030px;
	margin-left: auto;
	margin-right: auto;
}
.profile-wrap .inner {
	padding-top: 60px;
}
.profile01 {
	margin-top: 80px;
}
@media (max-width: 500px) {
	.profile-wrap .inner {
		padding-top: 10px;
	}
	.profile01 {
		margin-top: 40px;
	}
}
.profile-wrap .md1,
.profile-wrap .md2 {
	max-width: 243px;
	position: relative;
	z-index: 2;
}
.profile-wrap .md1 {
	margin-bottom: -40px;
	margin-left: 8px;
}
.profile-wrap .md2 {
	margin-bottom: -40px;
	margin-left: auto;
	margin-right: 8px;
}
@media (max-width: 500px) {
	.profile-wrap .md1 {
		max-width: 180px;
	}
	.profile-wrap .md2 {
		max-width: 146px;
		margin-bottom: -30px;
		margin-right: -23px;
	}
	.profile-wrap .md1 {
		margin-bottom: -30px;
	}
}
.profile-wrap .profile-box {
	max-width: 765px;
	padding-top: 50px;
	padding-left: 90px;
	padding-right: 90px;
	border-radius: 20px;
	position: relative;
}
@media (max-width: 900px) {
	.profile-wrap .profile-box {
		padding-left: 50px;
		padding-right: 50px;
	}
}
@media (max-width: 500px) {
	.profile-wrap .profile-box {
		width: auto;
		padding-top: 40px;
		padding-left: 30px;
		padding-right: 30px;
	}
}
.profile-wrap .profile-box.bg01 {
	background-color: #E7E8ED;
	padding-bottom: 95px;
	margin-bottom: -85px;
}
.profile-wrap .profile-box.bg02 {
	background-color: #F7E9EA;
	padding-top: 60px;
	padding-bottom: 50px;
	margin-left: auto;
	z-index: 1;
	
	/*margin-top: -120px;*/
}
.profile-wrap .profile-box.bg02::before {
	position: absolute;
	content: "";
	top: -40px;
	left: calc(50% - 40px);
	display: block;
	width: 80px;
	height: 80px;
	background-image: url("../images/bgimg02.png");
	background-size: contain;
	background-repeat: no-repeat;
}

@media (max-width: 500px) {
	.profile-wrap .profile-box.bg01 {
		margin-left: -30px;
		border-top-left-radius: 0;
		border-bottom-left-radius: 0;
		padding-bottom: 65px;
		margin-bottom: -45px;
	}
	.profile-wrap .profile-box.bg02 {
		margin-right: -30px;
		border-top-right-radius: 0;
		border-bottom-right-radius: 0;
		padding-bottom: 40px;
		
		/*margin-top: -70px;*/
	}
	.profile-wrap .profile-box.bg02::before {
		top: -25px;
		left: calc(50% - 50px);
		width: 50px;
		height: 50px;
	}
}

.names-warp {
	position: relative;
}
@media (max-width: 500px) {
	.names-warp {
		display: flex;
		align-items: center;
	}
}
.names-warp .imgs {
	position: absolute;
	top: 0;
	max-width: 152px;
	min-width: 152px;
	line-height: 0;
}
.profile01 .names-warp .imgs {
	left: 0;
}
.profile02 .names-warp .imgs {
	right: 0;
}
@media (max-width: 500px) {
	.profile01 .names-warp .imgs,
	.profile02 .names-warp .imgs {
		position: static;
		max-width: inherit;
		min-width: inherit;
		width: 140px !important;
	}
	.profile02 .names-warp .imgs {
		order: 2;
	}
}
.names-warp .imgs img {
	border-radius: 16px;
}
.profile01 .names-warp .names {
	padding-left: 180px;
	margin-left: auto;
}
.profile02 .names-warp .names {
	padding-right: 180px;
	margin-right: auto;
}
.names-warp .names .inner {
	display: flex;
	align-items: flex-end;
}
@media (max-width: 500px) {
	.names-warp .names .inner {
		display: block;
	}
	.profile01 .names-warp .names {
		padding-left: 10px;
	}
	.profile02 .names-warp .names {
		padding-right: 10px;
	}
}
.names-warp .names h3 {
	font-size: 160%;
	font-weight: bold;
}
.names-warp .names h3 span {
	font-size: 60%;
	font-weight: bold;
}
.names-warp .names .cap {
	font-size: 15px;
	font-weight: bold;
	line-height: 1.4em;
}
.names-warp > .names .cap {
	padding-top: 5px;
}
.names-warp .names > .cap {
	padding-bottom: 10px;
}
.names-warp .names .inner .cap {
	padding-bottom: 2px;
	padding-left: 10px;
}
@media (max-width: 500px) {
	.names-warp .names .inner .cap {
		padding-left: 0px;
		padding-bottom: 10px;
	}
}
.profile01 .profile-box .lead {
	padding-left: 180px;
	margin-left: auto;
}
.profile02 .profile-box .lead {
	padding-right: 180px;
	margin-right: auto;
}
@media (max-width: 500px) {
	.names-warp .names h3 {
		font-size: 130%;
	}
	.names-warp .names .cap {
		font-size: 80%;
		padding-top: 0;
		padding-bottom: 0;
		flex: 1;
	}
	.profile01 .profile-box .lead {
		padding-left: 0;
		padding-top: 15px;
	}
	.profile02 .profile-box .lead {
		padding-right: 0;
		padding-top: 15px;
	}
}
.cap.type1 {
	color: #141B4D;
}
.cap.type2 {
	color: #AF272F;
}

/* section nav
-------------------- */
.section-nav {
	position: relative;
}
.section-nav .section-md {
	max-width: 229px;
	margin-left: auto;
	margin-right: auto;
	position: relative;
	z-index: 1;
	line-height: 0;
	margin-bottom: -25px;
}
@media (max-width: 500px) {
	.section-nav .section-md {
		max-width: 167px;
	}
}
.section-nav .inner {
	padding-top: 65px;
	padding-left: 40px;
	padding-right: 40px;
	padding-bottom: 100px;
	position: relative;
	background-color: #fff;
}
@media (max-width: 500px) {
	.section-nav .inner {
		padding-bottom: 60px;
	}
}
.section-wrap {
	max-width: 900px;
	margin-left: auto;
	margin-right: auto;
	display: flex;
	justify-content: space-between;
}
.section-wrap a {
	color: #141B4D;
}
.section-wrap .section-box {
	width: 28.5%;
	display: block;
	position: relative;
}
@media (max-width: 500px) {
	.section-wrap {
		flex-wrap: wrap;
	}
	.section-wrap .section-box {
		width: 48%;
	}
	.section-wrap .section-box:last-child {
		margin-left: auto;
		margin-right: auto;
		margin-top: 15px;
	}
}
.section-wrap .section-box::after {
	position: absolute;
	content: "";
	bottom: -10px;
	left: calc(50% - 4px);
	display: inline-block;
	width: 8px;
	height: 52px;
	background-image: url("../images/icn-01.png");
	background-size: contain;
	background-repeat: no-repeat;
	transition: 0.5s;
}
@media (max-width: 500px) {
	.section-wrap .section-box::after {
		bottom: -4px;
		width: 5px;
		height: 32.5px;
		left: calc(50% - 2px);
	}
}
.section-wrap .section-box:hover::after {
	bottom: -20px;
}
.section-wrap .section-box h3 {
	max-width: 120px;
	position: absolute;
	top: -10px;
	left: calc(50% - 70px);
	line-height: 0;
	padding: 10px;
	background-color: #fff;
}
@media (max-width: 500px) {
	.section-wrap .section-box h3 {
		max-width: 66px;
		top: -5px;
		left: calc(50% - 35px);
		padding: 4px;
	}
}
.section-wrap .section-box p {
	position: absolute;
	top:50%;
	left: 50%;
	transform: translate(-50%,-50%);
	text-align: center;
	font-size: 155%;
	font-weight: bold;
	line-height: 1.35em;
	white-space: nowrap;
}
@media (max-width: 900px) {
	.section-wrap .section-box p {
		font-size: 110%;
	}	
}
@media (max-width: 500px) {
	.section-wrap .section-box p {
		top:47%;
		font-size: 90%;
	}
}
/* section01
---------------------------------------- */
.section01 {
	padding-bottom: 100px;
}
.section01 .title-box {
	max-width: 1030px;
	margin-left: auto;
	margin-right: auto;
	padding-left: 90px;
}
.section03 .title-box {
	display: table;
	margin-left: auto;
	margin-right: auto;
}
@media (max-width: 500px) {
	.section01 {
		padding-bottom: 60px;
	}
	.section01 .title-box {
		padding-left: 30px;
		padding-right: 30px;
	}
}
.section01 .title-box .number,
.section02 .title-box .number,
.section03 .title-box .number {
	max-width: 152px;
	line-height: 0;
}
.section03 .title-box .number {
	margin-left: auto;
	margin-right: auto;
}
@media (max-width: 500px) {
	.section01 .title-box .number,
	.section02 .title-box .number,
	.section03 .title-box .number {
		max-width: 92px;
	}
}
.section01 .title-box h2,
.section03 .title-box h2{
	background: rgb(20,27,77);
	background: linear-gradient(90deg, rgba(20,27,77,1) 0%, rgba(93,33,63,1) 60%, rgba(175,39,47,1) 100%);
	color: #fff;
	font-size: 266%;
	font-weight: bold;
	letter-spacing: 0.1em;
	display: inline-table;
	padding: 20px 40px 20px 20px;
}
@media (max-width: 900px) {
	.section01 .title-box h2,
	.section03 .title-box h2 {
		font-size: 200%;
	}
}
@media (max-width: 500px) {
	.section01 .title-box h2,
	.section03 .title-box h2 {
		font-size: 160%;
		padding: 6px 10px 6px 10px;
	}
}
.section01 .title-box h2 span,
.section03 .title-box h2 span{
	position: relative;
	padding-left: 65px;
}
.section01 .title-box h2 span::before,
.section03 .title-box h2 span::before {
	content:"";
	display:inline-block;
	width: 60px;
	height: 2px;
	background-color:#fff;
	position:absolute;
	top: 50%;
	left: 0;
}
@media (max-width: 500px) {
	.section01 .title-box h2 span,
	.section03 .title-box h2 span {
		padding-left: 32px;
	}
	.section01 .title-box h2 span::before,
	.section03 .title-box h2 span::before {
		width: 27px;
		height: 1px;
	}
}


.section-talk-wrap01 {
	max-width: 1170px;
	margin-left: auto;
	margin-right: auto;
	padding-left: 40px;
	margin-top: 50px;
	display: flex;
	justify-content: space-between;
}
.section-talk-wrap02 {
	max-width: 1170px;
	margin-left: auto;
	margin-right: auto;
	padding-right: 40px;
	margin-top: 50px;
	display: flex;
	justify-content: space-between;
}
@media (max-width: 500px) {
	.section-talk-wrap01 {
		display: block;
		margin-top: 30px;
		padding-left: 0px;
	}
	.section-talk-wrap02 {
		display: block;
		margin-top: 30px;
		padding-right: 0px;
	}
}
.img01 {
	width: 39%;
}
.section-talk-wrap01 .img01 {
	/*max-width: 452px;*/
	/*margin-left: 30px;*/
	/*margin-right: -30px;*/
	/*margin-right: -5%;*/
	margin-right: -10px;
	order: 2;
}
.section-talk-wrap02 .img01 {
	margin-left: -10px;
}
@media (max-width: 500px) {
	.img01 {
		width: 64.5%;
		margin-left: auto;
	}
	.section-talk-wrap01 .img01 {
		margin-right: 0px;
	}
	.section-talk-wrap02 .img01 {
		margin-top: 30px;
		margin-left: 0px;
	}
}
.talk-wrap {
	/*max-width: 615px;*/
	width: 53%;
	order: 1;
}
.section03 .talk-wrap.type01 {
	width: auto;
	max-width: 850px;
	margin-left: auto;
	margin-right: auto;
	padding-left: 40px;
	padding-right: 40px;
	position: relative;
}
.section03 .type01:nth-of-type(1) {
	top: -12px;
}
.section03 .type01:nth-of-type(n+2) {
	margin-top: 60px;
}
@media (max-width: 500px) {
	.talk-wrap {
		width: auto;
		padding-left: 30px !important;
		padding-right: 30px !important;
	}
	.section03 .type01:nth-of-type(n+2) {
		margin-top: 40px;
	}
}
.talk-wrap .talk-box {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}
.talk-wrap .talk-box:nth-of-type(n+2) {
	margin-top: 30px;
}
@media (max-width: 500px) {
	.talk-wrap .talk-box {
		margin-top: 20px;
	}
}
.talk-wrap .talk-box .imgbox {
	width: 17%;
}
.section03 .talk-wrap.type01 .imgbox {
	width: 14%;
}
@media (max-width: 500px) {
	.talk-wrap .talk-box .imgbox {
		width: 23% !important;
	}
}
.talk-wrap .talk-box .imgbox .icnimg img {
	border-radius: 50vh;
}
.section02 .section-talk-wrap02 .talk-wrap .talk-box:nth-child(even) .imgbox .icnimg img {
	border: #af272f solid 1px;
}
@media (max-width: 500px) {
	.section02 .talk-wrap .talk-box .imgbox .icnimg img {
		border: #af272f solid 1px;
	}
}
.talk-wrap .talk-box .imgbox .name {
	text-align: center;
	line-height: 0;
	padding-top: 6px;
}
@media (max-width: 900px) {
	.talk-wrap .talk-box .imgbox .name {
		font-size: 90%;
	}
}
.section02 .talk-wrap .talk-box .imgbox .name {
	color: #fff;
}

.talk-balloon {
	width: 70%;
	position: relative;
	display: inline-block;
	padding: 18px 24px;
	color: #000;
	background: #E7E8ED;
	border-radius: 15px;
}
.section02 .section-talk-wrap02 .talk-balloon {
	border: #af272f solid 1px;
}
.section03 .bgc-wrap .talk-balloon {
	background: #fff;
}
.section03 .talk-wrap.type01 .talk-balloon {
	width: 75%;
	border: #E7E8ED solid 1px;
}
.bgc-wrap .talk-balloon {
	border: #E7E8ED solid 1px;
}
@media (max-width: 900px) {
	.talk-balloon {
		width: 65% !important;
		padding: 14px 20px;
	}
}
@media (max-width: 500px) {
	.talk-balloon {
		width: 55% !important;
		padding: 14px 20px;
	}
	.talk-balloon p {
		line-height: 1.45em;
		text-align: justify;
	}
	.section02 .talk-balloon {
		border: #af272f solid 1px;
	}
}
.talk-balloon:before {
	content: "";
	position: absolute;
	top: 18%;
	border: 12px solid transparent;
}
@media (max-width: 500px) {
	.talk-balloon:before {
		top: 10%;
	}
}

/* 入れ替え */
.talk-wrap .talk-box:nth-child(even) .imgbox,
.order2 {
	order: 2;
}
.talk-wrap .talk-box:nth-child(even) .talk-balloon,
.order1 {
	order: 1;
}
.talk-wrap .talk-box:nth-child(odd) .talk-balloon:before {
	left: -12px;
	margin-left: -12px;
	border-right: 24px solid #E7E8ED;
}
.talk-wrap .talk-box:nth-child(even) .talk-balloon:before {
	right: -12px;
	margin-right: -12px;
	border-left: 24px solid #E7E8ED;
}
.bgc-wrap .talk-wrap .talk-box:nth-child(odd) .talk-balloon:before {
	border-right: 24px solid #fff;
}
.bgc-wrap .talk-wrap .talk-box:nth-child(even) .talk-balloon:before {
	border-left: 24px solid #fff;
}
.img-big {
	max-width: 1130px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 50px;
	line-height: 0;
}
@media (max-width: 500px) {
	.img-big {
		margin-top: 30px;
	}
}

/* section02
---------------------------------------- */
.section02 {
	padding-top: 100px;
	padding-bottom: 100px;
	background: rgb(20,27,77);
	background: linear-gradient(90deg, rgba(20,27,77,1) 0%, rgba(93,33,63,1) 48%, rgba(175,39,47,1) 91%, rgba(255,255,255,1) 91%, rgba(255,255,255,1) 100%);
}
@media (max-width: 900px) {
	.section02 {
		padding-top: 50px;
		padding-bottom: 50px;
		background: linear-gradient(90deg, rgba(20,27,77,1) 0%, rgba(93,33,63,1) 48%, rgba(175,39,47,1) 94%, rgba(255,255,255,1) 94%, rgba(255,255,255,1) 100%);
	}
}
@media (max-width: 500px) {
	.section02 {
		padding-top: 50px;
		padding-bottom: 50px;
		background: linear-gradient(90deg, rgba(20,27,77,1) 0%, rgba(93,33,63,1) 48%, rgba(175,39,47,1) 91%, rgba(255,255,255,1) 91%, rgba(255,255,255,1) 100%);
	}
}
.section02 .title-box {
	max-width: 1030px;
	margin-left: auto;
	margin-right: auto;
}
@media (max-width: 500px) {
	.section02 .title-box {
		padding-left: 30px;
	}
}
.section02 .title-box h2 {
	position: relative;
	color: #fff;
	font-size: 266%;
	font-weight: bold;
	line-height: 1.3em;
	letter-spacing: 0.1em;
	padding-left: 75px;
	margin-top: 25px;
}
.section02 .title-box h2::before{
	content:"";
	display:inline-block;
	width: 60px;
	height: 2px;
	background-color:#fff;
	position:absolute;
	top: 23%;
	left: 0;
}
@media (max-width: 500px) {
	.section02 .title-box h2 {
		font-size: 160%;
		padding-left: 32px;
	}
	.section02 .title-box h2::before{
		width: 27px;
		height: 1px;
		left: -2px;
	}
}

/* section03
---------------------------------------- */
.section03 {
	padding-top: 100px;
}
@media (max-width: 500px) {
	.section03 {
		padding-top: 50px;
		padding-bottom: 50px;
	}
}
.section03 .bgc-wrap {
	margin-top: 70px;
	padding-bottom: 350px;
	margin-bottom: -350px;
	background: linear-gradient(to right, #ffffff 0%, #ffffff 9%, #E7E8ED 9%, #E7E8ED 100%);
}
@media (max-width: 500px) {
	.section03 .bgc-wrap {
		margin-top: 40px;
		padding-bottom: 60px;
		margin-bottom: -50px;
		background: linear-gradient(to right, #ffffff 0%, #ffffff 20%, #E7E8ED 20%, #E7E8ED 100%);
	}
}
.message-wrap-outer {
	position: relative;
	z-index: 1;
	padding: 0 40px;
	margin-bottom: -115px;
}
@media (max-width: 500px) {
	.message-wrap-outer {
		padding: 0 30px;
	}
}
.message-wrap {
	max-width: 865px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 100px;
}
@media (max-width: 500px) {
	.message-wrap {
		margin-top: 40px;
	}
}
.message-wrap h3 {
	display: table;
	margin-left: auto;
	margin-right: auto;
	background-color: #fff;
	padding: 0 15px;
	line-height: 0;
	margin-bottom: -45px;
	position: relative;
	z-index: 1;
}
.message-wrap h3 img {
	max-width: 486px;
}
@media (max-width: 900px) {
	.message-wrap h3 img {
		max-width: 300px;
	}
}
@media (max-width: 500px) {
	.message-wrap h3 {
		margin-bottom: -25px;
	}
	.message-wrap h3 img {
		max-width: 200px;
	}
}
.message-wrap .message-box {
	padding: 2px;
	background: linear-gradient(90deg, rgba(20,27,77,1) 0%, rgba(93,33,63,1) 60%, rgba(175,39,47,1) 100%);
}
.message-wrap .message-box p {
	padding: 70px 80px 40px 80px;
	background-color: #fff;
	font-size: 106%;
	line-height: 2.3em;
	color: #141B4D;
}
@media (max-width: 900px) {
	.message-wrap .message-box p {
		padding: 50px 30px 40px 30px;
		line-height: 2.0em;
	}
}
@media (max-width: 500px) {
	.message-wrap .message-box p {
		padding: 30px 30px 30px 30px;
		line-height: 1.8em;
		font-size: 100%;
	}
}

/* Last cont
---------------------------------------- */
.links {
	padding: 205px 40px 60px 40px;
	background: rgb(20,27,77);
	background: linear-gradient(90deg, rgba(20,27,77,1) 0%, rgba(93,33,63,1) 60%, rgba(175,39,47,1) 100%);
}
@media (max-width: 500px) {
	.links {
		padding: 125px 30px 60px 30px;
	}
}
.links h2 {
	font-size: 213%;
	font-weight: bold;
	letter-spacing: 0.1em;
	color: #fff;
	text-align: center;
}
.links h2 span {
	position: relative;
	padding-left: 50px;
	padding-right: 50px;
}
@media (max-width: 500px) {
	.links h2 {
		font-size: 133%;
	}
	.links h2 span {
		padding-left: 0px;
		padding-right: 0px;
	}
}
.links h2 span:before,
.links h2 span:after {
	content: '';
	position: absolute;
	top: 50%;
	display: inline-block;
	width: 55px;
	height: 2px;
	background-color: #fff;
}
.links h2 span:before {
	left: 0;
	-webkit-transform: rotate(60deg);
	transform: rotate(60deg);
}
.links h2 span:after {
	right: 0;
	-webkit-transform: rotate(-60deg);
	transform: rotate(-60deg);
}
@media (max-width: 500px) {
	.links h2 span:before {
		left: -50px;
	}
	.links h2 span:after {
		right: -50px;
	}
}

.links-btn {
	max-width: 910px;
	margin-left: auto;
	margin-right: auto;
	display: flex;
	justify-content: space-between;
	margin-top: 50px;
}
.links-btn li {
	width: 28%;
	position: relative;
}
@media (max-width: 500px) {
	.links-btn {
		flex-wrap: wrap;
		margin-top: 25px;
	}
	.links-btn li {
		width: 47%;
	}
	.links-btn li:nth-of-type(1) {
		margin-left: auto;
		margin-right: auto;
	}
}
.links-btn li span {
	padding-bottom: 20px;
}
.links-btn li a {
	width: 100%;
	border: #fff solid 2px;
	background-color: rgba(0,0,0,1.00);
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 160%;
	font-weight: bold;
	color: #fff;
	text-align: center;
	border-radius: 50vw;
	position: relative;
}
.links-btn .spacer {
	display: none;
}
@media (max-width: 900px) {
	.links-btn li a {
		font-size: 120%;
		line-height: 1.3em;
	}
}
@media (max-width: 500px) {
	.links-btn li span {
		padding-bottom: 5px;
	}
	.links-btn li a {
		font-size: 100%;
		line-height: 1.3em;
	}
	.links-btn .spacer {
		display: block;
		width: 100%;
	}
}
.links-btn li a:hover {
	background-color: rgba(0,0,0,0.5);
}
.links-btn li a::before {
	display: block;
	content: '';
	padding-top: 100%;
}
.links-btn li a::after {
	position: absolute;
	content: "";
	bottom: 78px;
	left: calc(50% - 50px);
	display: inline-block;
	width: 101px;
	height: 8px;
	background-image: url("../images/icn-02.png");
	background-size: contain;
	background-repeat: no-repeat;
	transition: 0.5s;
}
.links-btn li:hover a::after {
	left: calc(50% - 40px);
}
@media (max-width: 900px) {
	.links-btn li a::after {
		bottom: 48px;
		left: calc(50% - 28px);
		width: 56px;
		height: 4px;
	}
}
@media (max-width: 500px) {
	.links-btn li a::after {
		bottom: 38px;
	}
}

.sns-btn {
	margin-top: 60px;
	max-width: 860px;
	margin-left: auto;
	margin-right: auto;
	display: flex;
	justify-content: space-between;
}
@media (max-width: 500px) {
	.sns-btn {
		margin-top: 50px;
	}
}
.sns-btn li {
	width: 31%;
}
.sns-btn li a {
	padding: 20px;
	border: #fff solid 2px;
	background-color: rgba(255,255,255,0.00);
	display: flex;
	font-size: 133%;
	font-weight: bold;
	color: #fff;
	border-radius: 10px;
	position: relative;
}
.sns-btn li a:hover {
	background-color: rgba(255,255,255,0.4);
}
@media (max-width: 900px) {
	.sns-btn li a {
		font-size: 100%;
		line-height: 1.5em;
	}
}
@media (max-width: 500px) {
	.sns-btn li a {
		padding: 80px 0 20px 0;
		font-size: 85%;
		letter-spacing: 0.01em;
		justify-content: center;
		text-align: center;
		line-height: 1.2em;
	}
}
.sns-btn li a::after {
	position: absolute;
	content: "";
	display: inline-block;
	width: 50px;
	height: 50px;
	top: calc(50% - 25px);
	right: 20px;
	background-size: contain;
	background-repeat: no-repeat;
	transition: 0.5s;
}
@media (max-width: 900px) {
	.sns-btn li a::after {
		width: 40px;
		height: 40px;
		top: calc(50% - 20px);
	}
}
@media (max-width: 500px) {
	.sns-btn li a::after {
		width: 40px;
		height: 40px;
		top: 25px;
		left: calc(50% - 20px);
	}
}
.sns-btn li:nth-of-type(1) a::after,
.sns-btn li:nth-of-type(3) a::after {
	background-image: url("../images/icn-Instagram.svg");
}
.sns-btn li:nth-of-type(2) a::after {
	background-image: url("../images/icn-x.svg");
}
/* footer
--------------------------------------------------------------------------------------------- */
footer {
	background-color: #000;
	padding: 40px;
}
footer p {
	color: #fff;
	text-align: center;
}
@media (max-width: 500px) {
	footer {
		padding: 30px;
	}
	footer p {
		font-size: 85%;
	}
}