@charset "utf-8";

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

	グローバル

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

body { font-size: 0.9em;}

.ta_right-s_center { text-align: center !important;}
.ta_left-s_center { text-align: center !important;}
.ta_center-s_left { text-align: left !important;}

.hidden_s { display: none !important;}

.cont1000, .cont1200 { padding: 0 5%;}

.mb40-20 { margin-bottom: 20px !important;}
.mb60-30, .mb50-30 { margin-bottom: 30px !important;}
.mb80-40 { margin-bottom: 40px !important;}
.mb100-60 { margin-bottom: 60px !important;}
.mb120-60 { margin-bottom: 60px !important;}
.mb120-80 { margin-bottom: 80px !important;}
.mb160-80 { margin-bottom: 80px !important;}

/* ------------------------
	フッター
------------------------ */
 
.footer { font-size: 1em;}
.footer .box01 { flex-flow: column; gap: 40px;}
.footer_nav { justify-content: space-between; gap: 2em;}

@media only screen and (max-width: 500px) {
  .footer { padding: 0 8%;}
  .footer_nav { gap: 0.5em 3em; flex-wrap: wrap; font-size: min(3.2vw,1em);}
  .footer_nav ul { display: contents;}
  .footer_nav li { width: calc(50% - 1.5em);}
}


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

	トップページ

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

.mainimage { background-size: 170% auto; background-position: 80% 50%; padding-top: 85px;}
.mainimage .box01 { flex-flow: column; align-items: center;}
.mainimage .slide_wrap { width: 97%; margin: 0;}
.mainimage .img01 { width: 46%; align-self: flex-end; margin-top: -12%;}
.mainimage .box02 { position: static; justify-content: center; width: auto; padding: 0 2%;}
.mainimage .box02 .img02 { margin-top: -15%;}
.mainimage .text01 { width: 100%; margin-top: -3%; font-size: min(2.2vw,1.5em);}
.mainimage .text03 { font-size: 1.5em; margin-left: 1.5em;}

.top_sec01 h2 img { max-height: 82px;}
.top_sec01 .box02 { display: flex; flex-flow: column; align-items: center; gap: 1.5em;}

.top_sec02 .box01 a:first-child .text01 { left: -3em; top: -12em; width: 65%; text-align: left;}

.top_sec03 .cont1000 { display: block;}
.top_sec03 h2 { writing-mode: horizontal-tb; display: block;}
.top_sec03 .fo125 { font-size: min(4vw,1.25em) !important; margin: -2em auto 30px; display: table;}
.top_sec03 .box_inner02 { width: 300px; margin: auto;}

.top_sec04:before { width: 125%; bottom: -10px;}
.top_sec04 .box01 { flex-flow: column; margin-bottom: 30px; gap: 30px;}
.top_sec04 .box01 article { width: 100%; max-width: 500px; margin: 0 auto !important;}
.top_sec04 .box01 article:nth-of-type(odd) { flex-flow: row !important;}
.top_sec04 .box01 article:nth-of-type(even) { flex-flow: row-reverse !important;}
.top_sec04 .box01 .thumb { width: 100px;}
.top_sec04 .box01 article:nth-of-type(odd) .thumb { margin: -1.5em -1em 0 0 !important;}
.top_sec04 .box01 article:nth-of-type(even) .thumb { margin: -1.5em 0 0 -1em !important;}
.top_sec04 .box01 .bg { width: calc(100% - 80px); margin-top: 0.5em;}
.top_sec04 .box01 .bg:after { width: 30px; height: 15px; bottom: 20%; background-image: url("../images/top/top_sec04_bg01_02.svg");}
.top_sec04 .box01 article:nth-of-type(odd) .bg:after { right: auto; left: -24px; transform: scale(1,1);}
.top_sec04 .box01 article:nth-of-type(even) .bg:after { left: auto; right: -24px; transform: scale(-1,1);}
.top_sec04 .img01 { padding: 0 27%;}

.top_sec05 .box01 { flex-flow: column; gap: 0px;}
.top_sec05 .box01 .box_inner { display: contents;}
.top_sec05 .sp_box { order: 1;}
.top_sec05 .img_box { width: 100%; order: 2; margin: -30px 0 100px;}
.top_sec05 .img01 { bottom: -70px; right: auto; left: 50%; transform: translateX(-50%); width: calc(100% + 20px); max-width: 553px; padding-left: 35%;}
.top_sec05 .more_btn { order: 3; width: 100%; margin: 0;}

.top_sec06 { background-position: -8% 10%; background-size: 150% auto;}
.voice_box { flex-flow: column; gap: 50px; padding: 0 4%;}
.voice_box article { width: 100%; max-width: 350px; margin: auto;}

.top_sec07 .box01 .date { width: 8.5em; align-self: flex-start;}

.top_sec08 .list01 { flex-flow: column; align-items: center; gap: 30px; font-size: min(3.3vw,1em);}
.top_sec08 .list01 li { height: 17em; max-width: 453px; width: 100%;}
.top_sec08 .list01 .fo09 { font-size: 1em !important;}

@media only screen and (max-width: 640px) {
  .top_sec01 .bg_border01.top { margin-bottom: 0 !important;} 
  
  .top_sec02 .box01 { font-size: min(4vw,1em);}
  .top_sec02 .box01 a { width: 90% !important; max-width: 400px; margin: auto;}
  .top_sec02 .box01 a:first-child { margin-top: 23%;}
  .top_sec02 .box01 a:first-child .text01 { left: 0; top: -10.5em; width: 55%;}
}

@media only screen and (max-width: 480px) {
  .top_sec03 .fo125 { font-size: min(5.3vw,1.25em) !important; margin: -2em auto 30px;}
  .top_sec03 .fo125 .show_sp, .top_sec04 h2 .show_sp, .top_sec06 h2 .show_sp { display: inline;}
  .top_sec03 .box_inner02 { width: auto;}
  .top_sec03 .box_inner02 figure { padding: 0 15%;}
  .top_sec03 .text01 { right: 0%; width: 25%;}
  
  .top_sec07 .box01 a { flex-flow: column; gap: 0.6em; align-items: flex-start;}
}



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

	下層ページ

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

.under_mainimage { background-image: image-set(url("../images/common/under_main_bg_sp.webp") 1x, url("../images/common/under_main_bg_sp@2x.webp") 2x); padding: 80px 24% 20px 8%;}

.under_mainimage figure:before { background-image: url("../images/common/under_main_shadow_sp.svg"); top: 0.5em; right: -0.5em; bottom: -0.5em; left: 0.5em;}
.under_mainimage .mask {
  width: min(100%, 530px);
  aspect-ratio: 263 / 166;
  -webkit-mask: url("../images/common/mask_sp.svg") no-repeat center / 100% 100%;
          mask: url("../images/common/mask_sp.svg") no-repeat center / 100% 100%;
}

.more_btn a { font-size: min(4.5vw,1.1em); padding: 1em 3.3em 1em 2em;}

.catch { font-size: 1.8em;}


/* ----------------------------
	固定ページテンプレート
---------------------------- */

.pagettl h1 { font-size: min(7.5vw,2.2em);}
.pagettl .bg01 { width: 12%; max-width: 50px; right: -10px;}
.pagettl .bg02 { width: 14%; max-width: 55px; left: -0px;}
.pagettl .bg03 { width: 13%; max-width: 55px; right: 10px;}

.main_contents { padding: 0px 20px;}


/* ------------------------
	contact
------------------------ */

@media only screen and (max-width: 570px) {
	.contact_sec dl { display: block;}
	.contact_sec dt, .contact_sec dd {
		display: block;
		border-bottom: none;
		padding: 0px;
	}
	.contact_sec dt {
		width: 100%;
		margin-bottom: 10px;
	}
	.contact_sec dt span {
		display: inline-block;
		vertical-align: middle;
		padding: 3px 5px;
		float: none;
		margin-left: 10px;
	}
}

/* ------------------------
	投稿
------------------------ */

.blog_wrap { flex-flow: column;}
.rNavi { max-width: 500px; align-self: center; width: 100%;}

/* 本文 */
.blog_content blockquote { padding-left: 2.5em !important; padding-right: 2.5em !important;}

.archive_list { gap: 40px 1.5em;}
.archive_list li { width: calc((100% - 3em) / 3);}

@media only screen and (max-width: 640px) {
  .blog_content .table_wrap { overflow-x: scroll;}
  .blog_content .table_wrap:before { content: "※横にスクロールしてご覧ください。"; font-size: 0.85em; margin-bottom: 0.7em;}
  .blog_content .table_wrap table { min-width: 640px;}
}

@media only screen and (max-width: 480px) {
  .archive_art article { flex-flow: column;}
  .archive_art article figure { width: 100%; max-width: 400px; margin: auto;}
}


/* ブロックエディタ用 */
.step { margin-bottom: 30px;}
.step .num_box { flex-basis: 50px !important; font-size: 2.5em;}
.step .num_box:before { top: -7px;}
.step .num_box:after { display: none;}
.step .main_box { flex-basis: calc(100% - 50px) !important;}
.step .main_box > *:not(.catch) { margin-left: -60px;}
.step .main_box .catch { margin-bottom: 10px;}

.faq_dl { margin-bottom: 50px;}
.faq_dl dt { font-size: 1.3em; padding: 0.7em 2.5em 0.7em 4rem; background-size: 3rem auto;}
.faq_dl dt:before { left: 1.7rem;}
.faq_dl dt:after { right: 0.5em; bottom: 0.9em;}
.faq_dl dd { background-size: 3rem auto; padding: 0.7em 0 0 4rem; min-height: 3.5em; display: none; margin-top: 1.5em;}

.bal_box { flex-flow: column; align-items: center; gap: 30px;}
.bal_box > div { max-width: 450px; width: 95%;}
.bal_box > div:after { top: auto !important; bottom: -15px !important;}
.bal_box > div:nth-child(odd):after { transform: scale(-1,1) !important; right: auto; left: 20%;}
.bal_box > div:nth-child(even):after { right: 20%; left: auto; transform: none !important;}
.bal_box .pos_ab { position: static; transform: none; width: auto; padding: 0 15%;}

:where(.wp-block-columns.is-layout-flex).gap03 { gap: 2em;}

@media only screen and (max-width: 640px) {
  .bird_box { flex-flow: column-reverse; align-items: center; gap: 1.5em;}
  .bird_box .box_inner { min-width: initial;}
  .bird_box .box_inner:after { background-image: url("../images/top/top_sec04_bg01.webp"); width: 35px; height: 16px; bottom: -15px; left: 8em;}
  .bird_box figure { margin-left: -10em;}

  .table_scroll { overflow-x: auto;}
  .table_scroll:before { content: "※横にスクロールしてご覧ください。"; display: block; margin-bottom: 10px; font-size: 0.85em;}
  .table_scroll table { min-width: 640px;}
}

@media only screen and (max-width: 480px) {
  .blog_content .about_table th { vertical-align: top;}
}
