@charset "utf-8";
@import url(normalize.css);
@import url(../_plugin/fontawesome/css/all.min.css);
@import url(https://unpkg.com/aos@2.3.1/dist/aos.css);
@import url(common_parts.css);
@import url(common.css);


/* index ==============================*/
/* 共通 ----------*/
#main a { display: block; }
.bgc_red { background: #E33E5F; }
.bgc_gre { background: #1CB954; }
.bgc_ora { background: #F27554; }
.bgc_blu { background: #149EFF; }
.read_more a { display: block; padding: 1rem 0; }
.arrow{ position: relative; display: inline-block; font-size: 15px; text-decoration: none; vertical-align: middle; }
.arrow::before,
.arrow::after { position: absolute; top: 0; bottom: 0; right: -1em; content: ""; margin: auto; vertical-align: middle; }
.arrow_type::after { right: -1em; width: 10px; height: 10px; border-top: 1.5px solid #fff; border-right: 1.5px solid #fff; -webkit-transform: rotate(45deg); transform: rotate(45deg); }
.bg_chg::before { position: fixed; z-index: 1; top: 0; content:""; width: 100%; height: 100%; background: url(../_img/index/info.jpg)no-repeat; background-size: cover; }
section:not(#mv) { position: relative; z-index: 2; }
section h2 { margin-bottom: 2rem; font-size: 3.25rem; }
section .c_ttl { position: relative; padding: 1rem 0 0 2em; font-size: 2.5rem; color: #0a3289; }
section .c_ttl::before { position: absolute; top: 50%; left: 0; content: ""; display: block; width: 1em; line-height: 1; border-top: 4.5px solid #0054b4; transform: translateY(calc(-50% - 2.25px)); }
@media screen and ( min-width: 481px ) {
	section h2 { margin-bottom: 3rem; }
}
@media screen and ( min-width: 981px ) {
	section:not(#mv) { padding: 0; }
	.bg_chg::before { left: -210px; width: calc(100% + 210px); }
}
@media screen and ( min-width: 1920px ) {
	#mv img, main img { width: 100%; }
}

/* mv ----------*/
#mv { background: #000; }
#mv .inner { position: relative; height: 100%; }
#mv #animation_container,
#mv #dom_overlay_container { width: 100%!important; height: auto!important; }
#mv canvas { position: relative; width: 100%!important; height: auto!important; }
#mv .read_more a { display: block; padding: 0.3rem 2rem; color: #fff; }
#mv .img_box { position: relative; position: fixed; z-index: 0; top: 60px; left: 0; min-width: 100%; min-height: 100%; }
#mv .news_info { position: absolute; bottom: 0; left: 0; width: 100%; height: 70px; padding: 1rem 3%; color: #fff; background: #232222; }
#mv .news_info li { font-size: 1.6rem; }
#mv .news_info li span { padding: 0 1rem; }
#mv .news_info li:nth-of-type(2),
#mv .news_info li:nth-of-type(3) { display: inline-block; }
#mv .news_info li:nth-of-type(4) { margin-top: 1rem; line-height: 1.3; }
#mv .read_more { position: absolute; top: 50%; background: #232222; transform: translateY(-50%); right: 2rem; }
#mv .read_more p { border-radius: 10px; border: 1px solid #ccc; }
#mv .read_more a { display: block; padding: 0.3rem 2rem; color: #fff; }
@media screen and ( min-width: 481px ) {
	#mv .news_info { height: 100px; }
	#mv .news_info li { font-size: 2.5rem; }
	#mv .news_info li:nth-of-type(4) { margin-top: 0; line-height: 1.8; }
}
@media screen and ( min-width: 651px ) {
	#mv .news_info li { font-size: 1.3rem; }
	#mv .img_box { top: 100px; }
	#mv .news_info { bottom: -100PX; height: 80px; }
}
@media screen and ( min-width: 769px ) {
	#mv .img_box { top: 80px; }
	#mv .news_info { bottom: -80px; }
}
@media screen and ( min-width: 981px ){
	#mv .news_info { padding: 2rem 3rem; }
	#mv .img_box { z-index: 0; top: 0; left: 210px; min-width: calc(100% - 210px); }
	#mv .news_info { bottom: 0; padding: 3rem 3%; }
	#mv .news_info li span { padding: 0.3rem 1rem; }
	#mv .news_info li:nth-of-type(4) { width: 55%; }
	#mv .news_info li:not(:nth-last-of-type(1)) { margin-right: 2%; }
	#mv .read_more { right: 3%; }
}
@media screen and ( min-width: 1281px ){
	#mv .news_info li span { display: inline-block; padding: 0 1rem; }
	#mv .news_info li:not(:nth-last-of-type(1)) { margin-right: 3.5%; }
}
/* about ----------*/
#about { padding: 3rem 2rem; background: #fff; }
#about .item_box { position: relative; }
#about  h3 { font-size: 3.4rem; line-height: 1.3; }
#about  h4 { font-size: 1.8rem; color: #0b318f; }
#about  p { font-size: 2rem; }
#about div.sp_cont { position: relative; }
#about div.sp_cont span { display: block; position: absolute; right: 0; bottom: 0; width: 100%; height: 3em; }
#about div.sp_cont span::before { content: ""; position: absolute; background: #0a3289; width: 3.7rem; height: 3.7rem; bottom: -17px; right: 0; transform: translateY(-50%); }
#about div.sp_cont span::after { content: ""; position: absolute; top: 50%; right: 1.6em; width: 10px; height: 10px; border-top: 1.5px solid #fff; border-right: 1.5px solid #fff; -webkit-transform: rotate(45deg) translateY(-50%); transform: rotate(45deg) translateY(-50%); }
#about .sp_ttl { position: absolute; top: 50%; left: 1.5rem; transform: translateY(-50%); }
@media screen and ( min-width: 481px ) {
	#about { padding: 3rem; }
	#about  h3 { font-size: 4.5rem; }
	#about  h4 { font-size: 1.8rem; }
	#about  p { font-size: 2.5rem; }
	#about .sp_ttl { left: 3.5rem; }
}
@media screen and ( min-width: 651px ) {
	#about { margin-top: 100px; padding: 0; }
	#about .item { position: absolute; top: 50%; left: 3rem; padding: 3%; background: rgba(0, 33, 86, 0.9); transform: translateY(-50%); }
	#about .item h3 { font-size: 2.9rem; line-height: 1.3; }
	#about .item p { font-size: 1.347rem; }
	#about .item h3,
	#about .item h4,
	#about .item p { color: #fff; }
	#about .read_more { position: relative; max-width: 170px; margin: 3rem auto 0; background: #0054b4; }
}
@media screen and ( min-width: 769px ) {
	#about { margin-top: 80px; }
	#about .item { width: calc((100% - 28rem) /2); /*max-width: 960px;*/ }
}
@media screen and ( min-width: 981px ) {
	#about { margin-top: 0; }
	#about .item { left: 8rem; }
}
@media screen and ( min-width: 1201px ) {
	#about .item { padding: 5%; }
}
/* message ----------*/
#message { padding: 0 2rem 3rem; background: #fff; }
#message .item_box { position: relative; }
#message h3 { font-size: 3.4rem; line-height: 1.3; }
#message h4 { font-size: 1.8rem; color: #0b318f; }
#message p { font-size: 2rem; }
#message div.sp_cont { position: relative; }
#message div.sp_cont span { display: block; position: absolute; right: 0; bottom: 0; width: 100%; height: 3em; }
#message div.sp_cont span::before { content: ""; position: absolute; background: #0a3289; width: 3.7rem; height: 3.7rem; bottom: -17px; right: 0; transform: translateY(-50%); }
#message div.sp_cont span::after { content: ""; position: absolute; top: 50%; right: 1.6em; width: 10px; height: 10px; border-top: 1.5px solid #fff; border-right: 1.5px solid #fff; -webkit-transform: rotate(45deg) translateY(-50%); transform: rotate(45deg) translateY(-50%); }
#message .sp_ttl { position: absolute; top: 50%; right: 1.5rem; transform: translateY(-50%); }

@media screen and ( min-width: 481px ) {
	#message h3 { font-size: 4.5rem; }
	#message h4 { font-size: 1.8rem; }
	#message p { font-size: 2.5rem; }
	#message .sp_ttl { right: 3.5rem; }
}
/*
@media screen and ( min-width: 651px ) {
	#message { padding: 0; }
	#message .item { position: absolute; top: 50%; right: 3rem; padding: 3%; background: rgba(0, 33, 86, 0.9); transform: translateY(-50%); }
	#message .item h3 { font-size: 2.9rem; line-height: 1.3; }
	#message .item p { font-size: 1.347rem; }
	#message .item h3,
	#message .item h4,
	#message .item p { color: #fff; }
	#message .read_more { position: relative; max-width: 170px; margin: 3rem auto 0; background: #0054b4; }
}
@media screen and ( min-width: 769px ) {
	#message .item { width: calc((100% - 28rem) /2); }
}
@media screen and ( min-width: 961px ) {
	#message .item { right: 8rem; }
}
@media screen and ( min-width: 1201px ) {
	#message .item { padding: 5%; right: 8rem; }
}
*/
@media screen and ( min-width: 651px ) {
	#message { padding: 0; }
	#message .item { position: absolute; top: 50%; left: 3rem; padding: 3%; background: rgba(0, 33, 86, 0.9); transform: translateY(-50%); }
	#message .item h3 { font-size: 2.9rem; line-height: 1.3; }
	#message .item p { font-size: 1.347rem; }
	#message .item h3,
	#message .item h4,
	#message .item p { color: #fff; }
	#message .read_more { position: relative; max-width: 170px; margin: 3rem auto 0; background: #0054b4; }
}
@media screen and ( min-width: 769px ) {
	#message { margin-top: 80px; }
	#message .item { width: calc((100% - 28rem) /2); /*max-width: 960px;*/ }
}
@media screen and ( min-width: 981px ) {
	#message { margin-top: 0; }
	#message .item { left: 8rem; }
}
@media screen and ( min-width: 1201px ) {
	#message .item { padding: 5%; }
}
/* contents_list ----------*/
#contents_list { padding: 2rem; background: #ebedf3; }
#contents_list a { display: flex; flex-flow: row-reverse; }
#contents_list .c_ttl { position: absolute; top: 50%; padding-top: 0; font-size: 2.6rem; transform: translateY(-50%); left: 0; }
#contents_list .item_box { position: relative; background: #fff; }
#contents_list .item_box:not(:nth-last-of-type(1)) { margin-bottom: 3rem; }
#contents_list .img_box { width: 40%; }
#contents_list .text_box { position: relative; width: 60%;  }
@media screen and ( min-width: 481px ) {
	#contents_list { padding: 3rem; }
	#contents_list .c_ttl { font-size: 4rem; }
}
@media screen and ( min-width: 651px ) {
	#contents_list { background: #f2f4f7; }
	#contents_list .c_ttl { font-size: 2.5rem; }
}
@media screen and ( min-width: 769px ) {
	#contents_list .c_ttl { top: 3rem; transform: none; }
	#contents_list .text_box p { font-size: 1.5rem; position: absolute; bottom: 2rem; left: 0rem; padding: 2rem; }
}
@media screen and ( min-width: 961px ) {
	#contents_list { padding: 5rem 8.5rem!important; }
	#contents_list a { display: block; }
	#contents_list .c_ttl { position: relative; top: inherit; transform: none; line-height: 3; }
	#contents_list .ttl_wrap { position: relative; }
	#contents_list .ttl_wrap span { position: absolute; background: #0a3289; width: 3.7rem; height: 3.7rem; top: 50%; right: 2rem; transform: translateY(-50%); }
	#contents_list .ttl_wrap span::before, #contents_list .ttl_wrap span::after { position: absolute; top: 0; bottom: 0; right: 1em; content: ""; margin: auto; vertical-align: middle; }
	#contents_list .ttl_wrap span::after { content: ""; right: 1em; width: 10px; height: 10px; border-top: 1.5px solid #fff; border-right: 1.5px solid #fff; -webkit-transform: rotate(45deg); transform: rotate(45deg); }
	#contents_list .flb { display: flex; justify-content: center; }
	#contents_list .flb .item_box:not(:nth-last-of-type(1)) { margin-right: 4rem; }
	#contents_list .flb .item_box { width: 100%; /*max-width: 960px;*/ background: none; margin-bottom: 0; }
	#contents_list .img_box { width: 100%; position: relative; background: #fff; }
	#contents_list .text_box { width: 100%; padding: 2rem 0 0; }
	#contents_list .text_box p { position: static; margin: 0; padding: 0; font-size: 1.3rem; transform: none; }
}

/* info ----------*/
#info { padding: 3rem 2rem; }
#info::after { position: absolute; z-index: -1; top: 0; left: 0; content:""; display: block; width: 100%; height: 100%; background: rgba(0, 33, 86, 0.8); }
#info h2 { color: #fff; }
#info .read_more a { color: #fff; }
#info li { display: flex; padding: 1rem 0; color: #fff; flex-wrap: wrap; border-top: 0.25px solid #fff; }
#info li:nth-last-of-type(1) { border-bottom: 0.25px solid #fff; }
#info li p { margin: 0; font-size: 1.8rem; }
#info li > p:nth-of-type(1) { padding: 0.5rem 0; font-size: 2rem; }
#info li p span { display: block; min-width: 120px; margin-left: 3rem; font-size: 1.8rem; text-align: center; padding: 0.5rem 0; }
#info li > h3 { width: 100%; margin: 1rem 0; font-size: 2rem; line-height: 1.3; }
#info .btn { font-size: 1.8rem; border: 3px solid #fff; }
#info .btn i { font-size: 70%; vertical-align: middle; }
@media screen and ( min-width: 481px ) {
	#info { padding: 5rem 3rem 3rem; }
	#info li { padding: 3rem 0; }
	#info li > h3 { font-size: 2.5rem; line-height: 1.5; }
	#info li p { font-size: 2.5rem; }
	#info li p span { min-width: 150px; }
	#info .btn { font-size: 2rem; }
}
@media screen and ( min-width: 651px ) {
	#info li { display: table; width: 100%; padding: 3rem 0; }
	#info li > h3 { padding-left: 2rem; font-size: 1.3rem; }
	#info li p { display: table-cell; margin-right: 3rem; font-size: 1.3rem; }
	#info li p span { width: 120px; font-size: 1.12rem; }
	#info li > h3 { padding-left: 3rem; margin: 0.7rem 0; }
	#info li > p:nth-of-type(1) { width: 6%; font-size: 1.3rem; }
	#info li > p:nth-of-type(2) { width: 10%; text-align: center; }
	#info .read_more { max-width: 50%; margin-top: 5rem; margin: 5rem auto 0; }
}
@media screen and ( min-width: 961px ) {
	#info { position: relative; padding: 6rem 8.5rem!important; }
	#info .sec_inner { padding: 5.3% 0 4.3%; }
	#info li p span { font-size: 1.3rem; }
}

/* banner_link ----------*/
#banner_link { background: #ffffff; }
#banner_link .sec_inner { padding: 3rem 2rem; }
#banner_link h3 { margin-bottom: 2rem; font-size: 2.6rem; background: #ebedf3; padding-top: 0.5rem; }
#banner_link ul { display: flex; flex-wrap: wrap; }
#banner_link li { width: calc( (99.999% - 1rem) / 2 ); margin-bottom: 2rem; }
#banner_link li:not(:nth-of-type(even)) { margin-right: 1rem; }
@media screen and ( min-width: 481px ) {
	#banner_link .sec_inner {}
	#banner_link h3 { font-size: 3.2rem; }
}
@media screen and ( min-width: 651px ) {
	#banner_link h3 { margin-bottom: 1rem; font-size: 1.8rem; background: none; padding: 0 0 0 2em; }
}
@media screen and ( min-width: 769px ) {
	#banner_link { padding: 8.5rem; }
	#banner_link ul { margin-bottom: 6rem; }
}
@media screen and ( min-width: 981px ) {
	#banner_link .sec_inner { padding: 5.3% 7% 4.3%; }
	#banner_link li { width: calc( (99.999% - 7.5rem) / 4 ); }
	#banner_link li:not(:nth-last-of-type(even)) { margin-right: 0; }
	#banner_link li:not(:nth-last-of-type(1)) { margin: 0 2.5rem 0 0; }
}